feat: icon middle in left tabs

Postcatlab · Jul 26, 2022 · b22eba3 · b22eba3
1 parent 8c6bb4c
commit b22eba3
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 4 deletions.
diff --git a/src/workbench/browser/src/app/pages/api/api.component.html b/src/workbench/browser/src/app/pages/api/api.component.html
@@ -5,7 +5,7 @@
       <nz-tabset nzCentered [nzAnimated]="false" [(nzSelectedIndex)]="tabsIndex">
         <nz-tab [nzTitle]="apiTitle">
           <ng-template #apiTitle>
-            <span i18n-nzTooltipTitle nzTooltipTitle="Collections" nz-tooltip class="text-lg">
+            <span i18n-nzTooltipTitle nzTooltipTitle="Collections" nz-tooltip class="text-lg tab-content">
               <eo-iconpark-icon name="folder-open"></eo-iconpark-icon>
             </span>
           </ng-template>
@@ -15,15 +15,15 @@
         </nz-tab>
         <nz-tab [nzTitle]="historyTitle">
           <ng-template #historyTitle>
-            <span i18n-nzTooltipTitle nzTooltipTitle="History" nz-tooltip class="text-lg">
+            <span i18n-nzTooltipTitle nzTooltipTitle="History" nz-tooltip class="text-lg tab-content">
               <eo-iconpark-icon name="history"></eo-iconpark-icon>
             </span>
           </ng-template>
           <eo-history></eo-history>
         </nz-tab>
         <nz-tab [nzTitle]="envTitle">
           <ng-template #envTitle>
-            <span i18n-nzTooltipTitle nzTooltipTitle="Environment" nz-tooltip class="text-lg">
+            <span i18n-nzTooltipTitle nzTooltipTitle="Environment" nz-tooltip class="text-lg tab-content">
               <eo-iconpark-icon name="instruction"></eo-iconpark-icon>
             </span>
           </ng-template>
@@ -59,7 +59,8 @@
             <span
               class="flex items-center justify-center mx-1 icon"
               i18n-nzTooltipTitle
-              nz-tooltip nzTooltipTitle="Enviroment Quick Look"
+              nz-tooltip
+              nzTooltipTitle="Enviroment Quick Look"
               nz-popover
               [nzPopoverContent]="envParams"
               nzPopoverPlacement="bottomRight"

diff --git a/src/workbench/browser/src/app/pages/api/api.component.scss b/src/workbench/browser/src/app/pages/api/api.component.scss
@@ -90,9 +90,26 @@ nz-sider {
 .api-tabs {
   ::ng-deep .ant-tabs-tab {
     padding: 0.2em 0;
+    padding: 0;
+    margin: 0;
+    .ant-tabs-tab-btn {
+      width: 100%;
+      height: 100%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      .tab-content {
+        width: 100%;
+        height: 100%;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+    }
   }
 }
 
+
 .fix-mt {
   margin-top: -6px;
 }