machankura/mempool
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add rtl-layout class to base component

Browse Source
This commit is contained in:
TechMiX 2020-12-09 01:57:18 +01:00
parent 260735665b
commit e0adc505db
5 changed files with 53 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/app/components/address/address.component.html
View File

@ -1,5 +1,5 @@
<div class="container-xl">
<h1 style="float: left;" i18n="shared.address">Address</h1>
<h1 class="float-left" i18n="shared.address">Address</h1>
<a [routerLink]="['/address/' | relativeUrl, addressString]" style="line-height: 56px; margin-left: 10px;">
<span class="d-inline d-lg-none">{{ addressString | shortenString : 24 }}</span>
<span class="d-none d-lg-inline">{{ addressString }}</span>

2
frontend/src/app/components/app/app.component.ts
View File

@ -19,10 +19,12 @@ export class AppComponent implements OnInit {
) {
if (this.locale.startsWith('ar') || this.locale.startsWith('fa')) {
this.dir = 'rtl';
this.class = 'rtl-layout';
}
}
@HostBinding('attr.dir') dir = 'ltr';
@HostBinding('class') class;
@HostListener('document:keydown', ['$event'])
handleKeyboardEvents(event: KeyboardEvent) {

2
frontend/src/app/components/latest-blocks/latest-blocks.component.html
View File

@ -1,5 +1,5 @@
<div class="container-xl">
<h1 style="float: left;" i18n="latest-blocks.blocks">Blocks</h1>
<h1 class="float-left" i18n="latest-blocks.blocks">Blocks</h1>
<br>
<div class="clearfix"></div>

24
frontend/src/app/components/transactions-list/transactions-list.component.html
View File

@ -1,6 +1,6 @@
<ng-container *ngFor="let tx of transactions; let i = index; trackBy: trackByFn">
<div *ngIf="!transactionPage" class="header-bg box" style="padding: 10px; margin-bottom: 10px;">
<a [routerLink]="['/tx/' | relativeUrl, tx.txid]" [state]="{ data: tx }">
<a class="float-left" [routerLink]="['/tx/' | relativeUrl, tx.txid]" [state]="{ data: tx }">
<span style="float: left;" class="d-block d-md-none">{{ tx.txid | shortenString : 16 }}</span>
<span style="float: left;" class="d-none d-md-block">{{ tx.txid }}</span>
</a>
@ -69,32 +69,32 @@
<ng-template [ngIf]="vin.scriptsig">
<tr>
<td i18n="transactions-list.scriptsig.asm|ScriptSig (ASM)">ScriptSig (ASM)</td>
<td [innerHTML]="vin.scriptsig_asm | asmStyler"></td>
<td class="text-left" [innerHTML]="vin.scriptsig_asm | asmStyler"></td>
</tr>
<tr>
<td i18n="transactions-list.scriptsig.hex|ScriptSig (HEX)">ScriptSig (HEX)</td>
<td>{{ vin.scriptsig }}</td>
<td class="text-left">{{ vin.scriptsig }}</td>
</tr>
</ng-template>
<tr *ngIf="vin.witness">
<td i18n="transactions-list.witness">Witness</td>
<td>{{ vin.witness.join(' ') }}</td>
<td class="text-left">{{ vin.witness.join(' ') }}</td>
</tr>
<tr *ngIf="vin.inner_redeemscript_asm">
<td i18n="transactions-list.p2sh-redeem-script">P2SH redeem script</td>
<td [innerHTML]="vin.inner_redeemscript_asm | asmStyler"></td>
<td class="text-left" [innerHTML]="vin.inner_redeemscript_asm | asmStyler"></td>
</tr>
<tr *ngIf="vin.inner_witnessscript_asm">
<td i18n="transactions-list.p2wsh-witness-script">P2WSH witness script</td>
<td [innerHTML]="vin.inner_witnessscript_asm | asmStyler"></td>
<td class="text-left" [innerHTML]="vin.inner_witnessscript_asm | asmStyler"></td>
</tr>
<tr>
<td i18n="transactions-list.nsequence">nSequence</td>
<td>{{ formatHex(vin.sequence) }}</td>
<td class="text-left">{{ formatHex(vin.sequence) }}</td>
</tr>
<tr *ngIf="vin.prevout">
<td i18n="transactions-list.previous-output-script">Previous output script</td>
<td [innerHTML]="vin.prevout.scriptpubkey_asm | asmStyler">{{ vin.prevout.scriptpubkey_type ? ('(' + vin.prevout.scriptpubkey_type + ')') : '' }}"</td>
<td class="text-left" [innerHTML]="vin.prevout.scriptpubkey_asm | asmStyler">{{ vin.prevout.scriptpubkey_type ? ('(' + vin.prevout.scriptpubkey_type + ')') : '' }}"</td>
</tr>
</tbody>
</table>
@ -164,19 +164,19 @@
<tbody>
<tr *ngIf="vout.scriptpubkey_type">
<td i18n="transactions-list.vout.scriptpubkey-type">Type</td>
<td>{{ vout.scriptpubkey_type.toUpperCase() }}</td>
<td class="text-left">{{ vout.scriptpubkey_type.toUpperCase() }}</td>
</tr>
<tr>
<td i18n="transactions-list.scriptpubkey.asm|ScriptPubKey (ASM)">ScriptPubKey (ASM)</td>
<td [innerHTML]="vout.scriptpubkey_asm | asmStyler"></td>
<td class="text-left" [innerHTML]="vout.scriptpubkey_asm | asmStyler"></td>
</tr>
<tr>
<td i18n="transactions-list.scriptpubkey.hex|ScriptPubKey (HEX)">ScriptPubKey (HEX)</td>
<td>{{ vout.scriptpubkey }}</td>
<td class="text-left">{{ vout.scriptpubkey }}</td>
</tr>
<tr *ngIf="vout.scriptpubkey_type == 'op_return'">
<td>OP_RETURN <span i18n="transactions-list.vout.scriptpubkey-type.data">data</span></td>
<td>{{ vout.scriptpubkey_asm | hex2ascii }}</td>
<td class="text-left">{{ vout.scriptpubkey_asm | hex2ascii }}</td>
</tr>
</tbody>
</table>

37
frontend/src/styles.scss
View File

@ -450,3 +450,40 @@ th {
.crypto { color: #fa3d3d }
.locktime { color: #ff8c00 }
.reserved { color: #ff8c00 }
.rtl-layout {
.arrow {
@extend .arrow;
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
}
.table td {
text-align: right;
}
.table th {
text-align: right;
}
.title-block {
text-align: right;
}
.mr-3 {
@extend .ml-3;
margin-right: 0 !important;
}
.mr-1 {
@extend .ml-1;
}
.float-left {
float: right !important;
}
.float-right {
float: left !important;
}
}