Merge pull request #4820 from mempool/nymkappa/polish-enterprise-logo

[enterprise] polish enterprise logo
This commit is contained in:
wiz 2024-04-03 16:17:37 +09:00 committed by GitHub
commit 69578f8086
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 43 additions and 13 deletions

View File

@ -15,12 +15,31 @@
<div *ngIf="user === undefined" class="profile_image_container"></div>
</ng-container>
<a class="navbar-brand" [ngClass]="{'dual-logos': subdomain}" [routerLink]="['/' | relativeUrl]" (click)="brandClick($event)">
<ng-template [ngIf]="subdomain && enterpriseInfo">
<div class="subdomain_container">
<img [src]="'/api/v1/services/enterprise/images/' + subdomain + '/logo?imageMd5=' + enterpriseInfo.imageMd5" class="subdomain_logo">
</div>
</ng-template>
<!-- Large screen -->
<a class="navbar-brand d-none d-md-flex" [ngClass]="{'dual-logos': subdomain}" [routerLink]="['/' | relativeUrl]" (click)="brandClick($event)">
<ng-template [ngIf]="subdomain && enterpriseInfo">
<div class="subdomain_container">
<img [src]="'/api/v1/services/enterprise/images/' + subdomain + '/logo?imageMd5=' + enterpriseInfo.imageMd5" class="subdomain_logo" [class]="{'rounded': enterpriseInfo.rounded_corner}">
</div>
<div class="vertical-line"></div>
</ng-template>
<ng-container *ngIf="{ val: connectionState$ | async } as connectionState">
<app-svg-images *ngIf="!officialMempoolSpace" name="mempoolSpace" viewBox="0 0 500 126" class="mempool-logo" [ngStyle]="{'opacity': connectionState.val === 2 ? 1 : 0.5 }"></app-svg-images>
<app-svg-images *ngIf="officialMempoolSpace" name="officialMempoolSpace" viewBox="0 0 500 126"></app-svg-images>
<div class="connection-badge">
<div class="badge badge-warning" *ngIf="connectionState.val === 0" i18n="master-page.offline">Offline</div>
<div class="badge badge-warning" *ngIf="connectionState.val === 1" i18n="master-page.reconnecting">Reconnecting...</div>
</div>
</ng-container>
</a>
<!-- Mobile -->
<a class="navbar-brand d-flex d-md-none justify-content-center" [ngClass]="{'dual-logos': subdomain, 'mr-0': subdomain}" [routerLink]="['/' | relativeUrl]" (click)="brandClick($event)">
<ng-template [ngIf]="subdomain && enterpriseInfo">
<div class="subdomain_container">
<img [src]="'/api/v1/services/enterprise/images/' + subdomain + '/logo?imageMd5=' + enterpriseInfo.imageMd5" class="subdomain_logo" [class]="{'rounded': enterpriseInfo.rounded_corner}">
</div>
<div class="vertical-line"></div>
</ng-template>
<ng-container *ngIf="{ val: connectionState$ | async } as connectionState">
<app-svg-images *ngIf="!officialMempoolSpace" name="mempoolSpace" viewBox="0 0 500 126" class="mempool-logo" [ngStyle]="{'opacity': connectionState.val === 2 ? 1 : 0.5 }"></app-svg-images>
<app-svg-images *ngIf="officialMempoolSpace" name="officialMempoolSpace" viewBox="0 0 500 126"></app-svg-images>
@ -77,7 +96,7 @@
<a class="nav-link" [routerLink]="['/about']" (click)="collapse()"><fa-icon [icon]="['fas', 'info-circle']" [fixedWidth]="true" i18n-title="master-page.about" title="About"></fa-icon></a>
</li>
</ul>
<app-search-form [hamburgerOpen]="user != null" class="search-form-container" location="top" (searchTriggered)="collapse()"></app-search-form>
<app-search-form [hamburgerOpen]="enterpriseInfo === null && user != null" class="search-form-container" location="top" (searchTriggered)="collapse()"></app-search-form>
</div>
</nav>
<app-menu *ngIf="servicesEnabled" [navOpen]="menuOpen" (loggedOut)="onLoggedOut()" (menuToggled)="menuToggled($event)"></app-menu>

View File

@ -106,6 +106,8 @@ li.nav-item {
.dropdown {
.dropdown-toggle {
width: 62px;
height: 36px;
margin-top: 5px;
}
}
}
@ -181,19 +183,30 @@ nav {
}
.subdomain_logo {
max-height: 45px;
height: 35px;
overflow: clip;
max-width: 140px;
margin: auto;
align-self: center;
.rounded {
border-radius: 5px;
}
}
.subdomain_container {
width: 140px;
margin-right: 15px;
max-width: 140px;
text-align: center;
align-self: center;
}
.vertical-line {
border-left: 1px solid #444;
height: 30px;
margin-left: 20px;
margin-right: 20px;
margin-top: 3px;
}
.logo-holder {
display: flex;
flex-direction: row;

View File

@ -15,8 +15,6 @@
form {
margin-top: 5px;
@media (min-width: 564px) {
margin-top: 0px;
margin-left: 5px;
margin-right: -5px;
}
@media (min-width: 992px) {
@ -39,7 +37,7 @@ form {
position: relative;
width: 100%;
@media (min-width: 768px) {
min-width: 400px;
min-width: 300px;
}
@media (min-width: 992px) {
min-width: 142px;