GlcoinCore/mempool
1
0
Fork 0
mirror of https://github.com/mempool/mempool.git synced 2026-08-13 12:33:11 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

bootstrap 5: last fixes

Browse source
This commit is contained in:
natsoni 2026-03-16 18:14:50 +01:00
parent 122f7b1fa2
commit aebcf3729f
No known key found for this signature in database
GPG key ID: 5554443C889C720E
7 changed files with 53 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

14
frontend/src/app/components/calculator/calculator.component.html
View file

@ -5,8 +5,8 @@
<ng-container *ngIf="(price$ | async) !== undefined; else loading">
<div class="row justify-content-center align-item-center mb-3">
<div class="input-group-prepend">
<div class="row calculator-row justify-content-center align-item-center mb-3">
<div class="input-group calculator-date-group">
<input
class="form-control flex-grow-1 disabled"
style="max-width: 125px"
@ -24,8 +24,8 @@
</div>
</div>
<div class="row justify-content-center col-12 col-sm-8 col-md-6 col-lg-5 col-xl-4">
<form [formGroup]="form">
<div class="row calculator-row justify-content-center">
<form [formGroup]="form" class="calculator-form">
<div class="input-group input-group-lg mb-1">
<span class="input-group-text">{{ currency$ | async }}</span>
<input type="text" inputmode="decimal" class="form-control" formControlName="fiat" (input)="transformInput('fiat')" (click)="selectAll($event)">
@ -54,7 +54,7 @@
<br>
<div class="row justify-content-center">
<div class="row calculator-inline-row justify-content-center">
<div class="bitcoin-satoshis-text">
₿
<span [innerHTML]="form.get('bitcoin').value | bitcoinsatoshis"></span>
@ -62,13 +62,13 @@
</div>
</div>
<div class="row justify-content-center">
<div class="row calculator-inline-row justify-content-center">
<div class="fiat-text">
<app-fiat [value]="form.get('satoshis').value" digitsInfo="1.2-2" [blockConversion]="blockConversion"></app-fiat>
</div>
</div>
<div class="row justify-content-center mt-3">
<div class="row calculator-inline-row justify-content-center mt-3">
<div class="symbol" *ngIf="{ value: (price$ | async) } as priceData">
@if (todaySelected) {
<span>Fiat price last updated <app-time kind="since" [time]="lastFiatPrice$ | async" [fastRender]="true"></app-time>: {{ priceData.value | fiatCurrency : '1.0-0' : (currency$ | async) }}</span>

31
frontend/src/app/components/calculator/calculator.component.scss
View file

@ -33,4 +33,35 @@
pointer-events: none;
background-color: var(--secondary);
opacity: 0.75;
}
.calculator-date-group {
width: 172px;
}
.calculator-form {
width: 100%;
max-width: 373px;
}
.calculator-row > * {
padding-left: 0;
padding-right: 0;
}
.calculator-inline-row > * {
flex: 0 0 auto;
width: auto;
max-width: 100%;
padding-left: 0;
padding-right: 0;
}
:host ::ng-deep ngb-datepicker .ngb-dp-weekday {
color: #fff;
}
:host ::ng-deep ngb-datepicker .ngb-dp-weekdays,
:host ::ng-deep ngb-datepicker .ngb-dp-header {
background-color: var(--bg) !important;
}

4
frontend/src/app/components/rbf-list/rbf-list.component.html
View file

@ -6,9 +6,9 @@
<form class="formRadioGroup">
<div class="btn-group btn-group-toggle" name="radioBasic">
<label class="btn btn-primary btn-sm" [class.active]="!fullRbf">
<input type="radio" [value]="'All'" fragment="" [routerLink]="[]"><span i18n="all">All</span></label>
<input type="radio" class="btn-check" [value]="'All'" fragment="" [routerLink]="[]"><span i18n="all">All</span></label>
<label class="btn btn-primary btn-sm" [class.active]="fullRbf">
<input type="radio" [value]="'Full RBF'" fragment="fullrbf" [routerLink]="[]" i18n="transaction.full-rbf">Full RBF</label>
<input type="radio" class="btn-check" [value]="'Full RBF'" fragment="fullrbf" [routerLink]="[]" i18n="transaction.full-rbf">Full RBF</label>
</div>
</form>
</div>

2
frontend/src/app/components/statistics/statistics.component.html
View file

@ -27,7 +27,7 @@
<label class="btn btn-primary btn-sm" for="dateSpan-1w">1W</label>
<input type="radio" class="btn-check" id="dateSpan-1m" [value]="'1m'" [routerLink]="['/graphs' | relativeUrl]" fragment="1m" formControlName="dateSpan">
<label class="btn btn-primary btn-sm" for="dateSpan-1m">1M</label>
<input type="radio" class="btn-check" id="dateSpan-3m" [value]="'3m'" [routerLink]="['/graphs' | relativeUrl]"fragment="3m" formControlName="dateSpan">
<input type="radio" class="btn-check" id="dateSpan-3m" [value]="'3m'" [routerLink]="['/graphs' | relativeUrl]" fragment="3m" formControlName="dateSpan">
<label class="btn btn-primary btn-sm" for="dateSpan-3m">3M</label>
</div>
<div class="btn-group" role="group">

2
frontend/src/app/lightning/channel/closing-type/closing-type.component.html
View file

@ -1 +1 @@
<span class="badge rounded-pill badge-{{ label.class }}" >{{ label.label }}</span>
<span class="badge rounded-pill text-bg-{{ label.class }}">{{ label.label }}</span>

6
frontend/src/app/shared/components/testnet-alert/testnet-alert.component.html
View file

@ -1,13 +1,11 @@
<div class="container p-lg-0 pb-0" style="max-width: 100%; margin-top: 7px" *ngIf="storageService.getValue('hideWarning') !== 'hidden'">
<div class="alert alert-danger mb-0 text-center">
<div class="alert alert-danger alert-dismissible mb-0 text-center" role="alert">
<div class="message-container">
<span i18n="warning-testnet">This is a test network. Coins have no value.</span>
@if (stateService.network === 'testnet') {
<span i18n="testnet3-deprecated">Testnet3 is deprecated, and will soon be replaced by <a href="/testnet4">Testnet4</a></span>
}
</div>
<button type="button" class="close" (click)="dismissWarning()">
<span aria-hidden="true">&times;</span>
</button>
<button type="button" class="btn-close btn-close-white" aria-label="Close" i18n-aria-label (click)="dismissWarning()"></button>
</div>
</div>

23
frontend/src/app/shared/components/testnet-alert/testnet-alert.component.scss
View file

@ -7,27 +7,22 @@
display: flex;
justify-content: center;
align-items: flex-start;
align-items: center;
position: relative;
}
.message-container {
display: flex;
flex-direction: column;
margin-left: auto;
margin: 0 auto;
}
.close {
display: flex;
color: #fff;
align-items: center;
.btn-close {
top: 50%;
transform: translateY(-50%);
}
button {
display: flex;
margin-left: auto;
}
span {
position: relative;
top: -2px;
.btn-close:hover,
.btn-close:focus {
opacity: 1;
}