Fix WooCommerce integration tab to show copy buttons in small displays
This commit is contained in:
parent
4780c64dcf
commit
8b7172f8ab
2 changed files with 86 additions and 46 deletions
|
@ -16,7 +16,7 @@ var Buffer = require('buffer/').Buffer;
|
|||
selector: 'app-invoice',
|
||||
templateUrl: './invoice.component.html',
|
||||
styleUrls: ['./invoice.component.css']
|
||||
});
|
||||
})
|
||||
|
||||
export class InvoiceComponent implements OnInit {
|
||||
faCheck = faCheck;
|
||||
|
|
|
@ -170,52 +170,92 @@
|
|||
</div>
|
||||
</mat-tab>
|
||||
<mat-tab label="WooCommerce">
|
||||
<div *ngIf="wooOwner == ''">
|
||||
<button mat-raised-button color="primary" (click)="generateWooToken()">
|
||||
Generate Token
|
||||
</button>
|
||||
<div >
|
||||
<div *ngIf="wooOwner == ''">
|
||||
<button mat-raised-button color="primary" (click)="generateWooToken()">
|
||||
Generate Token
|
||||
</button>
|
||||
</div>
|
||||
<table *ngIf="wooOwner != ''">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="heading" style="width: 100%;">Owner:</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div>
|
||||
<textarea disabled
|
||||
style="border: none;
|
||||
outline: none;
|
||||
min-height: 150px;
|
||||
width: 94%;"
|
||||
cdkTextareaAutosize
|
||||
cdkAutosizeMinRows="1"
|
||||
cdkAutosizeMaxRows="3">{{wooOwner}}
|
||||
</textarea>
|
||||
</div>
|
||||
</td>
|
||||
<td class="urlCopyBtn">
|
||||
<a (click)='copyWooOwner()' >
|
||||
<fa-icon [icon]="faCopy"
|
||||
class="copy-button">
|
||||
</fa-icon>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="heading" style="width: 60%;">Token:</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div>
|
||||
<textarea disabled
|
||||
style="border: none;
|
||||
outline: none;
|
||||
min-height: 150px;
|
||||
width: 94%;"
|
||||
cdkTextareaAutosize
|
||||
cdkAutosizeMinRows="1"
|
||||
cdkAutosizeMaxRows="3">{{wooToken}}
|
||||
</textarea>
|
||||
</div>
|
||||
</td>
|
||||
<td class="urlCopyBtn">
|
||||
<a (click)='copyWooToken()' >
|
||||
<fa-icon [icon]="faCopy"
|
||||
class="copy-button">
|
||||
</fa-icon>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="heading" style="width: 60%;">URL:</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div>
|
||||
<textarea disabled
|
||||
style="border: none;
|
||||
outline: none;
|
||||
min-height: 150px;
|
||||
width: 94%;"
|
||||
cdkTextareaAutosize
|
||||
cdkAutosizeMinRows="1"
|
||||
cdkAutosizeMaxRows="3">{{wooUrl}}
|
||||
</textarea>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="toolbar" align="center">
|
||||
<button mat-raised-button
|
||||
(click)="close()">
|
||||
Close
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<table *ngIf="wooOwner != ''">
|
||||
<tr>
|
||||
<td class="heading">Owner:</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="small">{{wooOwner}}</td>
|
||||
<td class="urlCopyBtn">
|
||||
<a (click)='copyWooOwner()' >
|
||||
<fa-icon [icon]="faCopy"
|
||||
class="copy-button">
|
||||
</fa-icon>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="heading">Token:</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="small">{{wooToken}}</td>
|
||||
<td class="urlCopyBtn">
|
||||
<a (click)='copyWooToken()' >
|
||||
<fa-icon [icon]="faCopy"
|
||||
class="copy-button">
|
||||
</fa-icon>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="heading">URL:</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="small">{{wooUrl}}</td>
|
||||
</tr>
|
||||
</table>
|
||||
<div class="toolbar" align="center">
|
||||
<button mat-raised-button
|
||||
(click)="close()">
|
||||
Close
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</mat-tab>
|
||||
</mat-tab-group>
|
||||
</mat-tab>
|
||||
|
|
Loading…
Reference in a new issue