fix styles

Author: hackeris

entry/src/main/ets/model/TabStyle.ets

@@ -15,10 +15,10 @@
 
 export const STYLE_CONFIGURATION: Record<string, number> = {
   'TAB_BAR_HEIGHT': 48,
-  'ICON_SIZE': 16,
+  'ICON_SIZE': 20,
   'TAB_BAR_CONTENT_GUTTER': 6,
   'TAB_BAR_ITEM_GUTTER': 6,
-  'SEPARATOR_STROKE_WIDTH': 2,
+  'SEPARATOR_STROKE_WIDTH': 1,
   'CONTENT_GUTTER_M': 12,
   'CONTENT_GUTTER_S': 8,
   'GRID_HEIGHT': 170,

entry/src/main/ets/pages/Index.ets

@@ -50,6 +50,7 @@ struct Index {
       })
 
       Divider()
+        .height(1)
         .width(FULL_PERCENT)
         .backgroundColor($r('sys.color.ohos_id_color_subheading_separator_dark'))
 

entry/src/main/ets/pages/TabSheetComponent.ets

@@ -25,9 +25,11 @@ export struct TabSheets {
             Image($r('app.media.ic_public_cancel_filled'))
               .width(STYLE_CONFIGURATION.ICON_SIZE)
               .aspectRatio(1)
+              .padding(2)
               .onClick(() => {
                 this.closeTabAndTerm(item.id)
               })
+              .hoverEffect(HoverEffect.Highlight)
           }
         }
         .flexShrink(1)
@@ -37,8 +39,7 @@ export struct TabSheets {
         })
         .borderRadius($r('sys.float.ohos_id_corner_radius_default_xs'))
         .height(FULL_PERCENT)
-        .backgroundColor(this.middleIndex === index ? $r('sys.color.ohos_id_color_background') :
-        $r('sys.color.ohos_id_color_sub_background'))
+        .backgroundColor(this.middleIndex === index ? '#222222' : $r('sys.color.ohos_id_color_sub_background'))
         .onClick(() => {
           this.controller.changeIndex(index);
           this.focusIndex = index;
@@ -51,13 +52,21 @@ export struct TabSheets {
               .strokeWidth(STYLE_CONFIGURATION.SEPARATOR_STROKE_WIDTH)
               .height('50%')
               .lineCap(LineCapStyle.Round)
+          } else {
+            Divider()
+              .vertical(true)
+              .strokeWidth(STYLE_CONFIGURATION.SEPARATOR_STROKE_WIDTH)
+              .height('50%')
+              .lineCap(LineCapStyle.Round)
+              .color($r('sys.color.ohos_id_color_background_transparent'))
           }
         }
       }, (item: TermModel) => 'tab-' + item.id.toString())
 
       Image($r('app.media.ic_public_add_filled'))
         .width(STYLE_CONFIGURATION.ICON_SIZE)
         .aspectRatio(1)
+        .padding(2)
         .onClick(() => {
           if (this.tabArray.length < 6) {
 
@@ -73,6 +82,7 @@ export struct TabSheets {
             })
           }
         })
+        .hoverEffect(HoverEffect.Highlight)
     }
     .padding(STYLE_CONFIGURATION.TAB_SHEET_PADDING)
     .backgroundColor($r('sys.color.ohos_id_color_sub_background'))

entry/src/main/resources/base/element/string.json

@@ -20,13 +20,9 @@
       "name": "documents_permission",
       "value": "Access ~/Documents"
     },
-    {
-      "name": "HandleTabs",
-      "value": "增删页签"
-    },
     {
       "name": "newSheet",
-      "value": "新建标签"
+      "value": "Harmonix"
     }
   ]
 }