From 4e0e3ca6beb0a3ff2bcabd35234aedb37029fb82 Mon Sep 17 00:00:00 2001 From: huxiyang <1872591453@qq.com> Date: Wed, 19 Jun 2024 10:39:14 +0800 Subject: [PATCH 1/2] =?UTF-8?q?feat(tabpane):=20=E5=A2=9E=E6=B7=BB?= =?UTF-8?q?=E4=BF=AE=E6=94=B9tabpane=E8=83=8C=E6=99=AF=E8=89=B2=E7=9A=84?= =?UTF-8?q?=E4=B8=BB=E9=A2=98=E5=8F=98=E9=87=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/packages/tabpane/tabpane.scss | 2 +- src/packages/tabs/doc.en-US.md | 1 + src/packages/tabs/doc.md | 1 + src/packages/tabs/doc.taro.md | 1 + src/packages/tabs/doc.zh-TW.md | 1 + src/styles/variables-jmapp.scss | 5 ++++- src/styles/variables.scss | 5 ++++- 7 files changed, 13 insertions(+), 3 deletions(-) diff --git a/src/packages/tabpane/tabpane.scss b/src/packages/tabpane/tabpane.scss index b87ac0f208..eacc7bafaf 100644 --- a/src/packages/tabpane/tabpane.scss +++ b/src/packages/tabpane/tabpane.scss @@ -2,7 +2,7 @@ width: 100%; flex-shrink: 0; display: block; - background-color: $color-background-overlay; + background-color: $tabs-tabpane-backgroundColor; color: $color-title; padding: $tabs-tabpane-padding; box-sizing: border-box; diff --git a/src/packages/tabs/doc.en-US.md b/src/packages/tabs/doc.en-US.md index b1ff97a552..1a495dddf8 100644 --- a/src/packages/tabs/doc.en-US.md +++ b/src/packages/tabs/doc.en-US.md @@ -261,3 +261,4 @@ The component provides the following CSS variables, which can be used to customi | \--nutui-tabs-vertical-tab-line-width | Vertical title line width | `3px` | | \--nutui-tabs-vertical-tab-line-height | The height of the vertical title line | `12px` | | \--nutui-tabs-tabpane-padding | Padding of the Tabpane content | `24px 20px` | +| \--nutui-tabs-tabpane-backgroundColor | BackgroundColor of the Tabpane content| `#FFFFFF` | diff --git a/src/packages/tabs/doc.md b/src/packages/tabs/doc.md index 68aae8a95b..b3b0338452 100644 --- a/src/packages/tabs/doc.md +++ b/src/packages/tabs/doc.md @@ -261,3 +261,4 @@ import { Tabs } from '@nutui/nutui-react'; | \--nutui-tabs-vertical-tab-line-width | 垂直方向标题线条的宽度 | `3px` | | \--nutui-tabs-vertical-tab-line-height | 垂直方向标题线条的高度 | `12px` | | \--nutui-tabs-tabpane-padding | Tabpane 的内边距 | `24px 20px` | +| \--nutui-tabs-tabpane-backgroundColor | Tabpane 的背景色| `#FFFFFF` | diff --git a/src/packages/tabs/doc.taro.md b/src/packages/tabs/doc.taro.md index 27fa0d74aa..5bf0d1bbbe 100644 --- a/src/packages/tabs/doc.taro.md +++ b/src/packages/tabs/doc.taro.md @@ -259,3 +259,4 @@ import { Tabs } from '@nutui/nutui-react-taro'; | \--nutui-tabs-vertical-tab-line-width | 垂直方向标题线条的宽度 | `3px` | | \--nutui-tabs-vertical-tab-line-height | 垂直方向标题线条的高度 | `12px` | | \--nutui-tabs-tabpane-padding | Tabpane 的内边距 | `24px 20px` | +| \--nutui-tabs-tabpane-backgroundColor | Tabpane 的背景色| `#FFFFFF` | \ No newline at end of file diff --git a/src/packages/tabs/doc.zh-TW.md b/src/packages/tabs/doc.zh-TW.md index 1b7fd54842..dd0725437c 100644 --- a/src/packages/tabs/doc.zh-TW.md +++ b/src/packages/tabs/doc.zh-TW.md @@ -259,3 +259,4 @@ import { Tabs } from '@nutui/nutui-react'; | \--nutui-tabs-vertical-tab-line-width | 垂直方向標題線條的寬度 | `3px` | | \--nutui-tabs-vertical-tab-line-height | 垂直方向標題線條的高度 | `12px` | | \--nutui-tabs-tabpane-padding | Tabpane 的內邊距 | `24px 20px` | +| \--nutui-tabs-tabpane-backgroundColor | Tabpane 的背景色| `#FFFFFF` | \ No newline at end of file diff --git a/src/styles/variables-jmapp.scss b/src/styles/variables-jmapp.scss index 6fb05e0719..e8045b36fb 100644 --- a/src/styles/variables-jmapp.scss +++ b/src/styles/variables-jmapp.scss @@ -1764,7 +1764,10 @@ $tabs-titles-item-smile-bottom: var( -10px ) !default; $tabs-tabpane-padding: var(--nutui-tabs-tabpane-padding, 24px 20px) !default; - +$tabs-tabpane-backgroundColor: var( + --nutui-tabs-tabpane-backgroundColor, + #ffffff +) !default; // indicator（✅） $indicator-color: var(--nutui-indicator-color, $color-primary) !default; $indicator-dot-color: var(--nutui-indicator-dot-color, $color-default) !default; diff --git a/src/styles/variables.scss b/src/styles/variables.scss index b40e0294d8..a59ab32db3 100644 --- a/src/styles/variables.scss +++ b/src/styles/variables.scss @@ -1717,7 +1717,10 @@ $tabs-titles-item-smile-bottom: var( -10% ) !default; $tabs-tabpane-padding: var(--nutui-tabs-tabpane-padding, 24px 20px) !default; - +$tabs-tabpane-backgroundColor: var( + --nutui-tabs-tabpane-backgroundColor, + #ffffff +) !default; // indicator（✅） $indicator-color: var( --nutui-indicator-color, From d2ee39494456607bcff68dfb42496439ec3dce5d Mon Sep 17 00:00:00 2001 From: huxiyang <1872591453@qq.com> Date: Wed, 19 Jun 2024 10:45:33 +0800 Subject: [PATCH 2/2] =?UTF-8?q?feat(tabpane):=20=E5=A2=9E=E6=B7=BB?= =?UTF-8?q?=E4=BF=AE=E6=94=B9tabpane=E8=83=8C=E6=99=AF=E8=89=B2=E7=9A=84?= =?UTF-8?q?=E4=B8=BB=E9=A2=98=E5=8F=98=E9=87=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/packages/tabs/doc.en-US.md | 2 +- src/packages/tabs/doc.md | 2 +- src/packages/tabs/doc.taro.md | 2 +- src/packages/tabs/doc.zh-TW.md | 2 +- src/styles/variables-jmapp.scss | 2 +- src/styles/variables.scss | 2 +- 6 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/packages/tabs/doc.en-US.md b/src/packages/tabs/doc.en-US.md index 1a495dddf8..b19be867de 100644 --- a/src/packages/tabs/doc.en-US.md +++ b/src/packages/tabs/doc.en-US.md @@ -261,4 +261,4 @@ The component provides the following CSS variables, which can be used to customi | \--nutui-tabs-vertical-tab-line-width | Vertical title line width | `3px` | | \--nutui-tabs-vertical-tab-line-height | The height of the vertical title line | `12px` | | \--nutui-tabs-tabpane-padding | Padding of the Tabpane content | `24px 20px` | -| \--nutui-tabs-tabpane-backgroundColor | BackgroundColor of the Tabpane content| `#FFFFFF` | +| \--nutui-tabs-tabpane-backgroundColor | BackgroundColor of the Tabpane content| `#fff` | diff --git a/src/packages/tabs/doc.md b/src/packages/tabs/doc.md index b3b0338452..2c9183faa5 100644 --- a/src/packages/tabs/doc.md +++ b/src/packages/tabs/doc.md @@ -261,4 +261,4 @@ import { Tabs } from '@nutui/nutui-react'; | \--nutui-tabs-vertical-tab-line-width | 垂直方向标题线条的宽度 | `3px` | | \--nutui-tabs-vertical-tab-line-height | 垂直方向标题线条的高度 | `12px` | | \--nutui-tabs-tabpane-padding | Tabpane 的内边距 | `24px 20px` | -| \--nutui-tabs-tabpane-backgroundColor | Tabpane 的背景色| `#FFFFFF` | +| \--nutui-tabs-tabpane-backgroundColor | Tabpane 的背景色| `#fff` | diff --git a/src/packages/tabs/doc.taro.md b/src/packages/tabs/doc.taro.md index 5bf0d1bbbe..da9718ca1a 100644 --- a/src/packages/tabs/doc.taro.md +++ b/src/packages/tabs/doc.taro.md @@ -259,4 +259,4 @@ import { Tabs } from '@nutui/nutui-react-taro'; | \--nutui-tabs-vertical-tab-line-width | 垂直方向标题线条的宽度 | `3px` | | \--nutui-tabs-vertical-tab-line-height | 垂直方向标题线条的高度 | `12px` | | \--nutui-tabs-tabpane-padding | Tabpane 的内边距 | `24px 20px` | -| \--nutui-tabs-tabpane-backgroundColor | Tabpane 的背景色| `#FFFFFF` | \ No newline at end of file +| \--nutui-tabs-tabpane-backgroundColor | Tabpane 的背景色| `#fff` | \ No newline at end of file diff --git a/src/packages/tabs/doc.zh-TW.md b/src/packages/tabs/doc.zh-TW.md index dd0725437c..83919406cf 100644 --- a/src/packages/tabs/doc.zh-TW.md +++ b/src/packages/tabs/doc.zh-TW.md @@ -259,4 +259,4 @@ import { Tabs } from '@nutui/nutui-react'; | \--nutui-tabs-vertical-tab-line-width | 垂直方向標題線條的寬度 | `3px` | | \--nutui-tabs-vertical-tab-line-height | 垂直方向標題線條的高度 | `12px` | | \--nutui-tabs-tabpane-padding | Tabpane 的內邊距 | `24px 20px` | -| \--nutui-tabs-tabpane-backgroundColor | Tabpane 的背景色| `#FFFFFF` | \ No newline at end of file +| \--nutui-tabs-tabpane-backgroundColor | Tabpane 的背景色| `#fff` | \ No newline at end of file diff --git a/src/styles/variables-jmapp.scss b/src/styles/variables-jmapp.scss index e8045b36fb..dbcb7896e0 100644 --- a/src/styles/variables-jmapp.scss +++ b/src/styles/variables-jmapp.scss @@ -1766,7 +1766,7 @@ $tabs-titles-item-smile-bottom: var( $tabs-tabpane-padding: var(--nutui-tabs-tabpane-padding, 24px 20px) !default; $tabs-tabpane-backgroundColor: var( --nutui-tabs-tabpane-backgroundColor, - #ffffff + #fff ) !default; // indicator（✅） $indicator-color: var(--nutui-indicator-color, $color-primary) !default; diff --git a/src/styles/variables.scss b/src/styles/variables.scss index a59ab32db3..8f303a6be4 100644 --- a/src/styles/variables.scss +++ b/src/styles/variables.scss @@ -1719,7 +1719,7 @@ $tabs-titles-item-smile-bottom: var( $tabs-tabpane-padding: var(--nutui-tabs-tabpane-padding, 24px 20px) !default; $tabs-tabpane-backgroundColor: var( --nutui-tabs-tabpane-backgroundColor, - #ffffff + #fff ) !default; // indicator（✅） $indicator-color: var(