Settings component reformated >> Link to Xero button

This commit is contained in:
Rene V. Vergara A. 2022-08-12 15:31:01 -05:00
parent 2eef36c33d
commit ee539f66a6
7 changed files with 76 additions and 48 deletions

View File

@ -1,6 +1,6 @@
<mat-toolbar color="primary">
<span align="center">
<img class="logo" src="/assets/logo-new-white.png" height="40px" />
<img class="logo" src="/assets/logo-new-white_01.png" height="40px" />
</span>
<span class="spacer"></span>
<span align="center">

View File

@ -1,6 +1,6 @@
<div align="center" class="text">
<mat-card class="coolcard">
<img src="/assets/logo-new-white.png" height="120px" />
<img src="/assets/logo-new-white_01.png" height="120px" />
<p class="text">Last block seen: <span class="numbers">{{ heightUpdate | async }}</span></p>
</mat-card>
</div>

View File

@ -23,3 +23,8 @@
.mat-slide-toggle-content {
font-family: 'Spartan', sans-serif;
}
.full-width {
width: 100%;
}

View File

@ -1,50 +1,58 @@
<div class="settings-title">Settings</div>
<div class="container" style="margin-top: 10px;">
<div class="container"
style="margin-top: 10px;
height: 430px;
margin-left: 10px;
margin-right: 10px;">
<mat-tab-group mat-tab-align-tabs="start">
<mat-tab label="Main">
<mat-dialog-content [formGroup]="settingsForm">
<mat-form-field class="settings-field" [style.width.%]="100">
<mat-label>Name</mat-label>
<input matInput
width="100%"
placeholder="Name"
formControlName="name">
</mat-form-field>
<mat-form-field [style.width.%]="100" >
<mat-label>Currency</mat-label>
<mat-select formControlName="currency">
<mat-option *ngFor="let coin of coins"
[value]="coin.symbol">
{{coin.label}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-slide-toggle formControlName="useZats"
class="settings-toggle"
(change)="onChange($event)">
Use zatoshis?
</mat-slide-toggle>
<pre></pre>
<mat-slide-toggle formControlName="useVKey"
class="settings-toggle"
(change)="onChangeVKeyOn($event)">
Confirm payments?
</mat-slide-toggle>
<pre></pre>
<mat-form-field [style.width.%]="100">
<mat-label>Viewing key</mat-label>
<input matInput placeholder="Your wallet viewing key"
formControlName="vKey">
</mat-form-field>
<mat-tab label="Main" style="height: 400px;">
<div class="container" style="margin-bottom: 20px;">
<mat-dialog-content [formGroup]="settingsForm">
<mat-form-field class="settings-field" [style.width.%]="100">
<mat-label>Name</mat-label>
<input matInput
width="100%"
placeholder="Name"
formControlName="name">
</mat-form-field>
<mat-form-field [style.width.%]="100" >
<mat-label>Currency</mat-label>
<mat-select formControlName="currency">
<mat-option *ngFor="let coin of coins"
[value]="coin.symbol">
{{coin.label}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-slide-toggle formControlName="useZats"
class="settings-toggle"
(change)="onChange($event)">
Use zatoshis?
</mat-slide-toggle>
<pre></pre>
<mat-slide-toggle formControlName="useVKey"
class="settings-toggle"
(change)="onChangeVKeyOn($event)">
Confirm payments?
</mat-slide-toggle>
<pre></pre>
<mat-form-field class="full-width"
appearance="fill">
<mat-label>Viewing key</mat-label>
<textarea matInput placeholder="Your wallet viewing key"
formControlName="vKey">
</textarea>
</mat-form-field>
</mat-dialog-content>
</mat-dialog-content>
</div>
<mat-dialog-actions style="display: flex;
justify-content: space-between;
align-items: center;
margin-top: 12px;">
<div class="container"
style="display: flex;
justify-content: space-between;
align-items: center;">
<button mat-raised-button
(click)="close()">
Cancel
@ -54,12 +62,26 @@
(click)="save()">
Save
</button>
</mat-dialog-actions>
</div>
<div style="height: 20px;
margin-top: 10px;">
</div>
</mat-tab>
<mat-tab label="Advanced">
<a mat-raised-button color="primary" href="{{this.xeroLink}}">
Link to Xero
</a>
<mat-tab label="Advanced"
style="align-items: center;">
<div style="height: 20px;
margin-top: 10px;">
</div>
<div class="container"
style="height: 300;">
<p style="text-align:center">
<a mat-raised-button
color="primary"
href="{{this.xeroLink}}">
Link to Xero
</a>
</p>
</div>
</mat-tab>
</mat-tab-group>
</div>

View File

@ -69,6 +69,7 @@ export class SettingsComponent implements OnInit {
}
ngOnInit() {
this.settingsForm.get('vKey')!.disable();
}
safeURL(s: string){

Binary file not shown.

After

Width:  |  Height:  |  Size: 78 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 91 KiB