Settings component reformated >> Link to Xero button
This commit is contained in:
parent
2eef36c33d
commit
ee539f66a6
7 changed files with 76 additions and 48 deletions
|
|
@ -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">
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -23,3 +23,8 @@
|
|||
.mat-slide-toggle-content {
|
||||
font-family: 'Spartan', sans-serif;
|
||||
}
|
||||
|
||||
.full-width {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -69,6 +69,7 @@ export class SettingsComponent implements OnInit {
|
|||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.settingsForm.get('vKey')!.disable();
|
||||
}
|
||||
|
||||
safeURL(s: string){
|
||||
|
|
|
|||
BIN
src/assets/logo-new-white-orange_00.png
Normal file
BIN
src/assets/logo-new-white-orange_00.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 78 KiB |
BIN
src/assets/logo-new-white_01.png
Normal file
BIN
src/assets/logo-new-white_01.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 91 KiB |
Loading…
Reference in a new issue