style(websocket): button error

Postcatlab · Dec 30, 2022 · 1b006fa · 1b006fa
1 parent 268ffcc
commit 1b006fa
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 14 deletions.
diff --git a/src/workbench/browser/src/app/pages/workspace/project/api/websocket/websocket.component.html b/src/workbench/browser/src/app/pages/workspace/project/api/websocket/websocket.component.html
@@ -1,5 +1,5 @@
 <div class="h-full overflow-hidden">
-  <header class="p-[10px]">
+  <header class="p-[10px] websocket-header">
     <form nz-form [formGroup]="validateForm" class="flex">
       <nz-form-item nz-col class="flex-1">
         <nz-form-control [nzValidateStatus]="validateForm.controls.uri" i18n-nzErrorTip nzErrorTip="Please enter URL">
@@ -142,7 +142,7 @@
         <div (click)="expandMessage(index)" class="flex flex-col w-full text-gray-500 top-line">
           <div *ngIf="item.type === 'send'" class="inline-flex items-center px-2 py-3 truncate hover:bg-gray-100 hover:cursor-pointer">
             <span class="flex items-center justify-center w-4 h-4 rounded shrink-0 send_icon">
-              <eo-iconpark-icon name="arrow-up" size="10"></eo-iconpark-icon>
+              <eo-iconpark-icon name="up-small" size="16"></eo-iconpark-icon>
             </span>
             <div class="px-2">{{ item.msg }}</div>
           </div>

diff --git a/src/workbench/browser/src/app/pages/workspace/project/api/websocket/websocket.component.scss b/src/workbench/browser/src/app/pages/workspace/project/api/websocket/websocket.component.scss
@@ -1,20 +1,12 @@
 :host {
   overflow: initial;
 
-  ::ng-deep .main-bg {
-    background-color: var(--BTN_SEC_BG_HOVER) !important;
-
-    &:focus,
-    &:active,
-    &:target {
-      background-color: var(--MAIN_BG) !important;
+  .websocket-header {
+    .ant-input,
+    .ant-btn {
+      height: 40px;
     }
   }
-
-  .ant-input,
-  .ant-btn {
-    height: 40px;
-  }
 }
 
 .top-line {
@@ -70,6 +62,16 @@
 }
 
 :host ::ng-deep {
+  .main-bg {
+    background-color: var(--BTN_SEC_BG_HOVER) !important;
+
+    &:focus,
+    &:active,
+    &:target {
+      background-color: var(--MAIN_BG) !important;
+    }
+  }
+
   .no-radius-select {
     .ant-select-selector {
       border-top-right-radius: 0 !important;