style: 头部功能按钮样式优化

src/page-instrument/header-top/index.module.less

@@ -4,7 +4,7 @@
     width: 100%;
     height: 100%;
     flex-shrink: 0;
-    padding: 0 10px;
+    padding: 0 20px;
     background: var(--container-background);
     padding-bottom: 0;
     transform: translateY(-100%);
@@ -40,7 +40,6 @@
     display: flex;
     align-items: center;
     height: 100%;
-    padding: 0 11px 0 6px;
     cursor: pointer;
 
     img {
@@ -57,7 +56,7 @@
 
 .headRight {
     display: flex;
-    align-items: flex-end;
+    align-items: center;
     margin-left: auto;
     height: 100%;
 
@@ -73,11 +72,12 @@
     font-size: 10px;
     line-height: 14px;
     font-weight: 400;
-    padding: 4px 6px;
+    // padding: 4px 6px;
     border-radius: 4px;
     color: #999;
     cursor: pointer;
-
+    margin-right: 16px;
+    margin-top: -12px;
     .iconBtn {
         display: block;
         width: 25px;
@@ -86,7 +86,10 @@
 
     span {
         white-space: nowrap;
-        margin-top: 2px;
+        position: absolute;
+        left: 50%;
+        top: 27px;
+        transform: translateX(-50%);
     }
 
     .btnWrap {
@@ -104,7 +107,7 @@
         height: 85%;
     }
     .iconContent {
-        position: relative;
+        // position: relative;
         .arrowIcon {
             position: absolute;
             left: 50%;
@@ -137,6 +140,10 @@
     }     
 }
 
+.setBtn {
+    margin-right: 0;
+}
+
 .disabled {
     pointer-events: none;
     opacity: .5;

src/page-instrument/header-top/index.tsx

@@ -456,7 +456,7 @@ export default defineComponent({
                 }}
               </Popover> : null            
             }
-            <div id={state.platform === IPlatform.PC ? "teacherTop-6" : "studnetT-6"} style={{ display: settingBtn.value.display ? "" : "none" }} class={[styles.btn, settingBtn.value.disabled && styles.disabled]} onClick={() => (headTopData.settingMode = true)}>
+            <div id={state.platform === IPlatform.PC ? "teacherTop-6" : "studnetT-6"} style={{ display: settingBtn.value.display ? "" : "none" }} class={[styles.btn, styles.setBtn, settingBtn.value.disabled && styles.disabled]} onClick={() => (headTopData.settingMode = true)}>
               <img class={styles.iconBtn} src={headImg("icon_menu.svg")} />
               <span>设置</span>
             </div>

src/page-instrument/header-top/title/index.module.less

@@ -5,11 +5,11 @@
   display: flex;
   align-items: center;
   border-radius: 18px;
-  padding: 6px;
+  padding: 6px 10px;
 
   .noticeBar {
     flex: 1;
-    padding: 0 6px;
+    padding: 0;
   }
 }