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

[enterprise] polish enterprise logo

Browse Source
This commit is contained in:
nymkappa 2024-03-26 11:36:20 +09:00
parent 1b21cd89a3
commit f4b9301f55
No known key found for this signature in database
GPG Key ID: 92358FC85D9645DE
3 changed files with 43 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
frontend/src/app/components/master-page/master-page.component.html
View File

@ -15,11 +15,30 @@
<div *ngIf="user === undefined" class="profile_image_container"></div> <div *ngIf="user === undefined" class="profile_image_container"></div>
</ng-container> </ng-container>
<a class="navbar-brand" [ngClass]="{'dual-logos': subdomain}" [routerLink]="['/' | relativeUrl]" (click)="brandClick($event)"> <!-- 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"> <ng-template [ngIf]="subdomain && enterpriseInfo">
<div class="subdomain_container"> <div class="subdomain_container">
<img [src]="'/api/v1/services/enterprise/images/' + subdomain + '/logo?imageMd5=' + enterpriseInfo.imageMd5" class="subdomain_logo"> <img [src]="'/api/v1/services/enterprise/images/' + subdomain + '/logo?imageMd5=' + enterpriseInfo.imageMd5" class="subdomain_logo" [class]="{'rounded': enterpriseInfo.rounded_corner}">
</div> </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-template>
<ng-container *ngIf="{ val: connectionState$ | async } as connectionState"> <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="mempoolSpace" viewBox="0 0 500 126" class="mempool-logo" [ngStyle]="{'opacity': connectionState.val === 2 ? 1 : 0.5 }"></app-svg-images>
@ -78,7 +97,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> <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> </li>
</ul> </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> </div>
</nav> </nav>
<app-menu *ngIf="servicesEnabled" [navOpen]="menuOpen" (loggedOut)="onLoggedOut()" (menuToggled)="menuToggled($event)"></app-menu> <app-menu *ngIf="servicesEnabled" [navOpen]="menuOpen" (loggedOut)="onLoggedOut()" (menuToggled)="menuToggled($event)"></app-menu>

19
frontend/src/app/components/master-page/master-page.component.scss
View File

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

4
frontend/src/app/components/search-form/search-form.component.scss
View File

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