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

Fix title styles.

Browse Source
This commit is contained in:
Miguel Medeiros 2021-10-26 21:47:17 -03:00
parent d6a9017267
commit 9264f3cf4f
No known key found for this signature in database
GPG Key ID: 819EDEE4673F3EBB
14 changed files with 245 additions and 206 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/src/app/assets/assets.component.html
View File

@ -1,11 +1,11 @@
<div class="container-xl">
<h1 style="float: left;" i18n="Registered assets page header">Registered assets</h1>
<br>
<div class="title-asset">
<h1 i18n="Registered assets page header">Registered assets</h1>
</div>
<div class="clearfix"></div>
<form [formGroup]="searchForm" class="form-inline">
<div class="input-group m-2">
<div class="input-group mb-2">
<input style="width: 250px;" formControlName="searchText" type="text" class="form-control" i18n-placeholder="Search Assets Placeholder Text" placeholder="Search asset">
<div class="input-group-append">
<button [disabled]="!searchForm.get('searchText')?.value.length" class="btn btn-secondary" type="button" (click)="searchForm.get('searchText')?.setValue('');" autocomplete="off" i18n="Search Clear Button">Clear</button>

7
frontend/src/app/assets/assets.component.scss
View File

@ -4,3 +4,10 @@
text-overflow: ellipsis;
white-space: nowrap;
}
.title-asset {
h1 {
line-height: 1;
margin: 0px;
padding-bottom: 10px;
}
}

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

@ -51,12 +51,13 @@
</div>
<br>
<div class="title-tx">
<h2>
<ng-template [ngIf]="!transactions?.length">&nbsp;</ng-template>
<ng-template i18n="X of X Address Transaction" [ngIf]="transactions?.length === 1">{{ (transactions?.length | number) || '?' }} of {{ txCount | number }} transaction</ng-template>
<ng-template i18n="X of X Address Transactions (Plural)" [ngIf]="transactions?.length > 1">{{ (transactions?.length | number) || '?' }} of {{ txCount | number }} transactions</ng-template>
</h2>
</div>
<app-transactions-list [transactions]="transactions" [showConfirmations]="true" (loadMore)="loadMore()"></app-transactions-list>

15
frontend/src/app/components/address/address.component.scss
View File

@ -74,13 +74,20 @@ h1 {
.tx-link {
display: block;
width: 100%;
top: 12px;
height: 100%;
top: 9px;
position: relative;
@media (min-width: 576px) {
top: 14px;
top: 11px;
}
@media (min-width: 768px) {
top: 20px;
top: 17px;
}
}
.title-tx {
h2 {
line-height: 1;
margin-bottom: 10px;
}
}

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

@ -75,11 +75,13 @@
<br>
<div class="title-tx">
<h2>
<ng-template [ngIf]="transactions?.length" i18n="asset.M_of_N">{{ (transactions?.length | number) || '?' }} of {{ txCount | number }}&nbsp;</ng-template>
<ng-template [ngIf]="isNativeAsset" [ngIfElse]="defaultAsset" i18n="Liquid native asset transactions title">Peg In/Out and Burn Transactions</ng-template>
<ng-template #defaultAsset i18n="Default asset transactions title">Issuance and Burn Transactions</ng-template>
</h2>
</div>
<app-transactions-list [transactions]="transactions" [showConfirmations]="true" (loadMore)="loadMore()"></app-transactions-list>

16
frontend/src/app/components/asset/asset.component.scss
View File

@ -33,10 +33,20 @@ h1 {
.tx-link {
display: block;
width: 100%;
top: 14px;
height: 100%;
top: 9px;
position: relative;
@media (min-width: 576px) {
top: 11px;
}
@media (min-width: 768px) {
top: 20px;
top: 17px;
}
}
.title-tx {
h2 {
line-height: 1;
margin-bottom: 10px;
}
}

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

@ -162,7 +162,7 @@
</div>
<div #blockTxTitle id="block-tx-title" class="block-tx-title">
<h2 class="float-left">
<h2>
<ng-container *ngTemplateOutlet="block.tx_count === 1 ? transactionsSingular : transactionsPlural; context: {$implicit: block.tx_count | number}"></ng-container>
<ng-template #transactionsSingular let-i i18n="shared.transaction-count.singular">{{ i }} transaction</ng-template>
<ng-template #transactionsPlural let-i i18n="shared.transaction-count.plural">{{ i }} transactions</ng-template>

44
frontend/src/app/components/block/block.component.scss
View File

@ -40,10 +40,7 @@
h1 {
margin: 0px;
padding: 0px;
@media (min-width: 576px) {
float: left;
margin-right: 10px;
}
line-height: 1;
a {
&:hover, &:focus{
text-decoration: none;;
@ -87,32 +84,23 @@ h1 {
}
.block-tx-title {
padding-top: 10px;
display: block;
text-align: right;
margin-top: -30px;
display: flex;
justify-content: space-between;
flex-direction: column;
margin-top: -15px;
position: relative;
@media (min-width: 550px) {
margin-top: 0px;
padding-top: 10px;
margin-top: 1rem;
flex-direction: row;
}
h2 {
display: inline-block;
float: left;
line-height: 1.6;
margin: 0;
margin-bottom: -15px;
padding-right: 10px;
padding-top: 15px;
position: relative;
top: -22px;
width: auto;
@media (min-width: 550px) {
padding-top: 0px;
top: 0px;
}
@media (min-width: 768px) {
padding-top: 5px;
line-height: 1;
margin: 0;
position: relative;
padding-bottom: 10px;
@media (min-width: 550px) {
padding-bottom: 0px;
align-self: end;
}
}
}
@ -122,7 +110,7 @@ h1 {
}
.next-previous-blocks {
font-size: 30px;
font-size: 28px;
display: inline-block;
@media (min-width: 768px) {
font-size: 36px;
@ -138,7 +126,7 @@ h1 {
}
.disable {
font-size: 30px;
font-size: 28px;
color: #393e5c73;
@media (min-width: 768px) {
font-size: 36px;

2
frontend/src/app/components/mempool-block/mempool-block.component.html
View File

@ -1,7 +1,7 @@
<div class="container-xl" *ngIf="mempoolBlock$ | async as mempoolBlock">
<div class="title-block">
<h1 class="float-left">{{ ordinal$ | async }}</h1>
<h1>{{ ordinal$ | async }}</h1>
<button [routerLink]="['/' | relativeUrl]" class="btn btn-sm float-right">&#10005;</button>
</div>

2
frontend/src/app/components/mempool-block/mempool-block.component.scss
View File

@ -24,9 +24,9 @@
h1 {
margin: 0px;
padding: 0px;
line-height: 1;
@media (min-width: 576px) {
float: left;
margin-right: 10px;
}
}

10
frontend/src/app/components/transaction/transaction.component.html
View File

@ -192,15 +192,19 @@
<br>
<h2 class="float-left" i18n="transaction.inputs-and-outputs|Transaction inputs and outputs">Inputs & Outputs</h2>
<div class="title float-left">
<h2 i18n="transaction.inputs-and-outputs|Transaction inputs and outputs">Inputs & Outputs</h2>
</div>
<button type="button" class="btn btn-outline-info btn-sm float-right mr-1 mt-0 mt-md-2" (click)="txList.toggleDetails()" i18n="transaction.details|Transaction Details">Details</button>
<button type="button" class="btn btn-outline-info btn-sm float-right" (click)="txList.toggleDetails()" i18n="transaction.details|Transaction Details">Details</button>
<div class="clearfix"></div>
<app-transactions-list #txList [transactions]="[tx]" [errorUnblinded]="errorUnblinded" [outputIndex]="outputIndex" [transactionPage]="true"></app-transactions-list>
<h2 class="text-left" i18n="transaction.details">Details</h2>
<div class="title">
<h2 i18n="transaction.details">Details</h2>
</div>
<div class="box">
<table class="table table-borderless table-striped">
<tbody>

44
frontend/src/app/components/transaction/transaction.component.scss
View File

@ -21,28 +21,29 @@
}
.title-block {
height: 100px;
flex-direction: column;
h1 {
margin-bottom: 0rem;
}
@media (min-width: 650px) {
height: 80px;
flex-direction: row;
h1 {
margin-bottom: 1rem;
}
h1 {
margin: 0rem;
line-height: 1;
}
}
.tx-link {
display: flex;
margin-bottom: 0px;
margin-top: 8px;
@media (min-width: 650px) {
margin-left: 15px;
align-self: end;
margin-bottom: 9px;
margin-left: 15px;
margin-top: 0px;
margin-bottom: -3px;
}
@media (min-width: 768px) {
margin-bottom: 2px;
margin-bottom: 0px;
top: 1px;
position: relative;
}
}
@ -71,10 +72,6 @@
color: #dc3545;
}
.btn {
margin-top: 5px;
}
.container-xl {
margin-bottom: 40px;
}
@ -123,9 +120,26 @@
}
}
.effective-fee-container{
.effective-fee-container {
display: block;
@media (min-width: 768px){
display: inline-block;
}
}
.title {
h2 {
line-height: 1;
margin: 0;
padding-bottom: 10px;
}
}
.btn-outline-info {
margin-top: -10px;
@media (min-width: 768px){
display: inline-block;
margin-top: 0px;
}
}

4
frontend/src/app/components/transactions-list/transactions-list.component.scss
View File

@ -115,3 +115,7 @@
margin-top: 0px;
margin-bottom: 10px;
}
h2 {
line-height: 1;
}

28
frontend/src/styles.scss
View File

@ -197,18 +197,21 @@ body {
display: flex;
flex-direction: row;
justify-content: space-between;
height: 80px;
}
.title-address, .title-asset {
color: #FFF;
padding-top: 20px;
padding-bottom: 10px;
display: flex;
flex-direction: column;
margin-bottom: 7px;
@media (min-width: 576px) {
flex-direction: row;
justify-content: space-between;
height: 80px;
margin-top: -20px;
margin-bottom: 0px;
}
h1 {
line-height: 1;
}
}
.smaller-text {
@ -300,7 +303,7 @@ html:lang(ru) .card-title {
left: -1px;
position: relative;
}
&:nth-child(4){
&:nth-child(4) {
display: none;
}
}
@ -391,10 +394,10 @@ html:lang(ru) .card-title {
left: -1px;
position: relative;
}
&:nth-child(4){
&:nth-child(4) {
display: none;
}
&:nth-child(5){
&:nth-child(5) {
display: none;
}
}
@ -469,10 +472,10 @@ html:lang(ru) .card-title {
thead {
th {
&:nth-child(4){
&:nth-child(4) {
display: table-cell;
}
&:nth-child(5){
&:nth-child(5) {
display: table-cell;
}
}
@ -664,7 +667,7 @@ h1, h2, h3 {
}
}
.flex{
.flex {
display: flex;
}
@ -803,7 +806,6 @@ th {
}
}
.scriptmessage {
overflow: hidden;
display: inline-block;
@ -880,7 +882,7 @@ th {
padding: 0;
}
.collapsed{
.collapsed {
background-color: #2d3348;
color: #1bd8f4;
}