feat: v15 style adaption

jdf2e · Dec 22, 2024 · 4539dc5 · 4539dc5
1 parent 4354a63
commit 4539dc5
Show file tree

Hide file tree

Showing 6 changed files with 22 additions and 16 deletions.
diff --git a/src/packages/sidebar/doc.en-US.md b/src/packages/sidebar/doc.en-US.md
@@ -86,8 +86,8 @@ The component provides the following CSS variables, which can be used to customi
 | \--nutui-sidebar-width | Sidebar width | `104px` |
 | \--nutui-sidebar-title-height | Sidebar title height | `52px` |
 | \--nutui-sidebar-inactive-font-size | Font size in normal state | `$font-size-base` |
-| \--nutui-sidebar-active-font-size | Font size in active state | `$font-size-xl` |
-| \--nutui-sidebar-active-font-weight | Font weight in active state | `500` |
-| \--nutui-sidebar-active-color | Font color in active state | `#fa2c19` |
+| \--nutui-sidebar-active-font-size | Font size in active state | `$font-size-l` |
+| \--nutui-sidebar-active-font-weight | Font weight in active state | `$font-weight-bold` |
+| \--nutui-sidebar-active-color | Font color in active state | `$color-primary` |
 | \--nutui-sidebar-item-background | The background color of the content area | `$white` |
 | \--nutui-sidebar-item-padding | Padding of the content area | `24px 20px` |
diff --git a/src/packages/sidebar/doc.md b/src/packages/sidebar/doc.md
@@ -86,8 +86,8 @@ import { SideBar } from '@nutui/nutui-react'
 | \--nutui-sidebar-width | 侧边栏宽度 | `104px` |
 | \--nutui-sidebar-title-height | 侧边栏标题高度 | `52px` |
 | \--nutui-sidebar-inactive-font-size | 普通状态下的字体大小 | `$font-size-base` |
-| \--nutui-sidebar-active-font-size | 激活状态下的字体大小 | `$font-size-xl` |
-| \--nutui-sidebar-active-font-weight | 激活状态下的字重 | `500` |
-| \--nutui-sidebar-active-color | 激活状态下的字体颜色 | `#fa2c19` |
+| \--nutui-sidebar-active-font-size | 激活状态下的字体大小 | `$font-size-l` |
+| \--nutui-sidebar-active-font-weight | 激活状态下的字重 | `$font-weight-bold` |
+| \--nutui-sidebar-active-color | 激活状态下的字体颜色 | `$color-primary` |
 | \--nutui-sidebar-item-background | 内容区域的背景色 | `$white` |
 | \--nutui-sidebar-item-padding | 内容区域的内边距 | `24px 20px` |
diff --git a/src/packages/sidebar/doc.taro.md b/src/packages/sidebar/doc.taro.md
@@ -86,8 +86,8 @@ import { SideBar } from '@nutui/nutui-react-taro'
 | \--nutui-sidebar-width | 侧边栏宽度 | `104px` |
 | \--nutui-sidebar-title-height | 侧边栏标题高度 | `52px` |
 | \--nutui-sidebar-inactive-font-size | 普通状态下的字体大小 | `$font-size-base` |
-| \--nutui-sidebar-active-font-size | 激活状态下的字体大小 | `$font-size-xl` |
-| \--nutui-sidebar-active-font-weight | 激活状态下的字重 | `500` |
-| \--nutui-sidebar-active-color | 激活状态下的字体颜色 | `#fa2c19` |
+| \--nutui-sidebar-active-font-size | 激活状态下的字体大小 | `$font-size-l` |
+| \--nutui-sidebar-active-font-weight | 激活状态下的字重 | `$font-weight-bold` |
+| \--nutui-sidebar-active-color | 激活状态下的字体颜色 | `$color-primary` |
 | \--nutui-sidebar-item-background | 内容区域的背景色 | `$white` |
 | \--nutui-sidebar-item-padding | 内容区域的内边距 | `24px 20px` |
diff --git a/src/packages/sidebar/doc.zh-TW.md b/src/packages/sidebar/doc.zh-TW.md
@@ -86,8 +86,8 @@ import { SideBar } from '@nutui/nutui-react'
 | \--nutui-sidebar-width | 側邊欄寬度 | `104px` |
 | \--nutui-sidebar-title-height | 側邊欄標題高度 | `52px` |
 | \--nutui-sidebar-inactive-font-size | 普通狀態下的字體大小 | `$font-size-base` |
-| \--nutui-sidebar-active-font-size | 激活狀態下的字體大小 | `$font-size-xl` |
-| \--nutui-sidebar-active-font-weight | 激活狀態下的字重 | `500` |
-| \--nutui-sidebar-active-color | 激活狀態下的字體顏色 | `#fa2c19` |
+| \--nutui-sidebar-active-font-size | 激活狀態下的字體大小 | `$font-size-l` |
+| \--nutui-sidebar-active-font-weight | 激活狀態下的字重 | `$font-weight-bold` |
+| \--nutui-sidebar-active-color | 激活狀態下的字體顏色 | `$color-primary` |
 | \--nutui-sidebar-item-background | 內容區域的背景色 | `$white` |
 | \--nutui-sidebar-item-padding | 內容區域的內邊距 | `24px 20px` |
diff --git a/src/packages/sidebar/sidebar.scss b/src/packages/sidebar/sidebar.scss
@@ -45,12 +45,15 @@
       flex: none;
       font-size: $sidebar-inactive-font-size;
       &-text {
+        font-family: PingFangSC-Regular;
         text-align: center;
         text-overflow: ellipsis;
         white-space: nowrap;
         overflow: hidden;
+        color: $color-text;
       }
-      &-active {
+      &-active .nut-sidebar-titles-item-text {
+        font-family: PingFangSC-Semibold;
         color: $sidebar-active-color;
         font-weight: $sidebar-active-font-weight;
         font-size: $sidebar-active-font-size;

diff --git a/src/styles/variables.scss b/src/styles/variables.scss
@@ -2192,13 +2192,16 @@ $sidebar-inactive-font-size: var(
 ) !default;
 $sidebar-active-font-size: var(
   --nutui-sidebar-active-font-size,
-  $font-size-xl
+  $font-size-l
 ) !default;
 $sidebar-active-font-weight: var(
   --nutui-sidebar-active-font-weight,
-  500
+  $font-weight-bold
+) !default;
+$sidebar-active-color: var(
+  --nutui-sidebar-active-color,
+  $color-primary
 ) !default;
-$sidebar-active-color: var(--nutui-sidebar-active-color, #fa2c19) !default;
 $sidebar-item-background: var(--nutui-sidebar-item-background, $white) !default;
 $sidebar-item-padding: var(--nutui-sidebar-item-padding, 24px 20px) !default;
 // sidenavbar（✅）