fix: extensions detail css style

This commit is contained in:
buqiyuan 2022-08-12 15:20:54 +08:00
parent 71bfa2fa37
commit 9023e8cc40
3 changed files with 29 additions and 27 deletions

View File

@ -144,11 +144,13 @@ export class ApiComponent implements OnInit, OnDestroy {
onSideResize({ width }: NzResizeEvent): void {
this.isDragging = true;
cancelAnimationFrame(this.animateId);
this.animateId = requestAnimationFrame(() => {
this.siderWidth = width;
// cancelAnimationFrame(this.animateId);
// this.animateId = requestAnimationFrame(() => {
this.siderWidth = width;
requestAnimationFrame(() => {
localStorage.setItem(LEFT_SIDER_WIDTH_KEY, String(width));
});
// });
}
onResizeEnd() {

View File

@ -33,32 +33,15 @@
<div class="w-[1px] bg-[#f2f2f2] mx-[10px]"></div>
<div class="shrink-0 w-[200px] 2xl:w-[250px] overflow-auto h-full">
<h2 class="text-lg font-bold" i18n>Install</h2>
<div class="flex items-center mt-[22px]" *ngIf="!extensionDetail?.installed">
<div class="flex items-center mt-[22px]" *ngIf="isElectron && !extensionDetail?.installed">
<nz-skeleton-element *ngIf="isNotLoaded" nzType="button" nzSize="large" [nzActive]="true" style="width:100%">
</nz-skeleton-element>
<button *ngIf="isElectron && !isNotLoaded" nz-button nzType="primary" nzBlock nzSize="large"
[nzLoading]="isOperating" (click)="manageExtension('install', extensionDetail?.name)" i18n>
Install
</button>
<div *ngIf="!isElectron">
<button nz-button nzType="primary" nz-dropdown [nzDropdownMenu]="download" class="!w-full" i18n>
Download Client
</button>
<nz-dropdown-menu #download="nzDropdownMenu">
<ul nz-menu>
<ng-container *ngFor="let item of resourceInfo; let index = index">
<a [href]="item.link" nz-menu-item>{{ item.name }}</a>
<li nz-menu-divider *ngIf="index !== resourceInfo.length - 1"></li>
</ng-container>
</ul>
</nz-dropdown-menu>
<div class="bg-[#FF1744] p-[6px] mt-[14px] rounded-[3px] text-white" i18n>
The extensions can only be installed on the client at present. Please download the client first~
</div>
</div>
</div>
<div *ngIf="extensionDetail?.installed">
<div *ngIf="isElectron && extensionDetail?.installed">
<nz-skeleton-element *ngIf="isNotLoaded" nzType="button" [nzActive]="true" nzSize="large" style="width:100%">
</nz-skeleton-element>
<button *ngIf="!isNotLoaded" nz-button nzBlock nzType="primary" nzDanger nzSize="large"
@ -68,6 +51,23 @@
</button>
</div>
<div *ngIf="!isElectron">
<button nz-button nzType="primary" nz-dropdown [nzDropdownMenu]="download" class="!w-full" i18n>
Download Client
</button>
<nz-dropdown-menu #download="nzDropdownMenu">
<ul nz-menu>
<ng-container *ngFor="let item of resourceInfo; let index = index">
<a [href]="item.link" nz-menu-item>{{ item.name }}</a>
<li nz-menu-divider *ngIf="index !== resourceInfo.length - 1"></li>
</ng-container>
</ul>
</nz-dropdown-menu>
<div class="bg-[#FF1744] p-[6px] mt-[14px] rounded-[3px] text-white" i18n>
The extensions can only be installed on the client at present. Please download the client first~
</div>
</div>
<h2 class="text-lg font-bold mt-[30px]" i18n>Support</h2>
<nz-descriptions [nzColumn]="1" nzTitle="">
<nz-descriptions-item i18n-nzTitle nzTitle="Author">{{ extensionDetail?.author }}</nz-descriptions-item>

View File

@ -23,15 +23,15 @@
</ul>
</nz-dropdown-menu>
<div *ngIf="!OS_TYPE.includes('mac') && isElectron">
<span nz-tooltip i18n-nzTooltipTitle nzTooltipTitle="Minimize" nzTooltipPlacement="left"
class="iconfont icon-jianhao mr10 fs24 cp" (click)="minimize()">
<span nz-tooltip i18n-nzTooltipTitle nzTooltipTitle="Minimize" class="iconfont icon-jianhao mr10 fs24 cp"
nzTooltipPlacement="bottom" (click)="minimize()">
</span>
<span nz-tooltip i18n-nzTooltipTitle [nzTooltipTitle]="isMaximized ? 'Restore' : 'Maximize'"
nzTooltipPlacement="left" class="iconfont icon-{{ isMaximized ? 'copy' : 'duoxuanweixuanzhong' }} mr10 fs24 cp"
class="iconfont icon-{{ isMaximized ? 'copy' : 'duoxuanweixuanzhong' }} mr10 fs24 cp"
(click)="toggleMaximize()">
</span>
<span nz-tooltip i18n-nzTooltipTitle nzTooltipTitle="Close" nzTooltipPlacement="left"
class="iconfont icon-guanbi pr15 fs24 cp" (click)="close()">
<span nz-tooltip i18n-nzTooltipTitle nzTooltipTitle="Close" class="iconfont icon-guanbi pr15 fs24 cp"
(click)="close()">
</span>
</div>
<div *ngIf="!isElectron">