From e2b9c2a39b63e62e191350513f0aa87374ff0b4b Mon Sep 17 00:00:00 2001 From: Bang <15622356989@163.com> Date: Thu, 7 Sep 2023 15:32:46 +0800 Subject: [PATCH 1/2] =?UTF-8?q?=E6=96=AD=E7=82=B9mixin=20<=20=E6=9B=B4?= =?UTF-8?q?=E6=94=B9=E4=B8=BA=20<=3D?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/opendesign/src/_styles/mixin.scss | 6 +++--- packages/opendesign/src/anchor/style/media.scss | 2 +- packages/opendesign/src/badge/style/media.scss | 2 +- packages/opendesign/src/breadcrumb/style/media.scss | 2 +- packages/opendesign/src/carousel/style/media.scss | 2 +- packages/opendesign/src/cascader/style/media.scss | 2 +- packages/opendesign/src/checkbox/style/media.scss | 2 +- packages/opendesign/src/collapse/style/media.scss | 2 +- packages/opendesign/src/dialog/style/media.scss | 6 +++--- packages/opendesign/src/divider/style/media.scss | 2 +- packages/opendesign/src/message/style/media.scss | 2 +- packages/opendesign/src/progress/style/media.scss | 2 +- packages/opendesign/src/radio/style/media.scss | 2 +- packages/opendesign/src/result/style/media.scss | 2 +- packages/opendesign/src/select/style/media.scss | 2 +- packages/opendesign/src/tag/style/media.scss | 2 +- packages/opendesign/src/upload/style/media.scss | 2 +- packages/portal-ak/src/ak/theme/carousel.scss | 2 +- packages/portal-ak/src/ak/theme/dialog.scss | 4 ++-- packages/portal-ak/src/ak/theme/loading.scss | 4 ++-- packages/portal-ak/src/ak/theme/mixin.scss | 6 +++--- packages/portal-ak/src/ak/theme/select.scss | 2 +- packages/portal-ak/src/ak/theme/tab.scss | 8 ++++---- packages/portal-ak/src/ak/theme/textarea.scss | 2 +- 24 files changed, 35 insertions(+), 35 deletions(-) diff --git a/packages/opendesign/src/_styles/mixin.scss b/packages/opendesign/src/_styles/mixin.scss index 30259d938..4ae3eddaa 100644 --- a/packages/opendesign/src/_styles/mixin.scss +++ b/packages/opendesign/src/_styles/mixin.scss @@ -5,17 +5,17 @@ $breakpoints: ( '>phone': 601px, // pad 'pad': (601px, 1200px), - 'pad': 1201px, // pad-v 'pad_v': (601px, 840px), - 'pad_v': 841px, // pad-h 'pad_h': (841px, 1200px), // laptop 'laptop': (1201px, 1440px), - 'laptop': 1441px, 'pad-laptop': (601px, 1440px), 'pad_v-laptop': (841px, 1440px) diff --git a/packages/opendesign/src/anchor/style/media.scss b/packages/opendesign/src/anchor/style/media.scss index 9b73c585e..f415089a7 100644 --- a/packages/opendesign/src/anchor/style/media.scss +++ b/packages/opendesign/src/anchor/style/media.scss @@ -1,6 +1,6 @@ @use '../../_styles/mixin.scss' as *; -@include respond-to('phone': 601px, // pad 'pad': (601px, 1200px), - 'pad': 1201px, // pad-v 'pad_v': (601px, 840px), - 'pad_v': 841px, // pad-h 'pad_h': (841px, 1200px), // laptop 'laptop': (1201px, 1440px), - 'laptop': 1441px, 'pad-laptop': (601px, 1440px), 'pad_v-laptop': (841px, 1440px) diff --git a/packages/portal-ak/src/ak/theme/select.scss b/packages/portal-ak/src/ak/theme/select.scss index 63ca0c0e1..b25884a81 100644 --- a/packages/portal-ak/src/ak/theme/select.scss +++ b/packages/portal-ak/src/ak/theme/select.scss @@ -23,7 +23,7 @@ --select-text-size: var(--o-font_size-text1); --select-text-height: var(--o-line_height-text1); - @include respond-to(' .o-icon { font-size: var(--o-icon_size_control-m); margin-right: 8px; - @include respond-to(' .o-icon { font-size: var(--o-icon_size_control-l); margin-right: 8px; - @include respond-to(' Date: Thu, 7 Sep 2023 15:45:03 +0800 Subject: [PATCH 2/2] =?UTF-8?q?=E6=9B=B4=E6=96=B0token?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../opendesign/src/_styles/dark.token.css | 42 +++++++------- .../opendesign/src/_styles/light.token.css | 42 +++++++------- .../opendesign/tokens/opendesign-token.json | 55 ++++++++++++------- .../portal-ak/src/ak/theme/a.dark.token.css | 42 +++++++------- .../portal-ak/src/ak/theme/a.light.token.css | 42 +++++++------- .../portal-ak/src/ak/theme/a.media.token.css | 12 ++-- .../portal-ak/src/ak/theme/k.dark.token.css | 42 +++++++------- .../portal-ak/src/ak/theme/k.light.token.css | 42 +++++++------- .../portal-ak/src/ak/theme/k.media.token.css | 48 +++++++++------- .../portal/src/assets/style/a.dark.token.css | 42 +++++++------- .../portal/src/assets/style/a.light.token.css | 42 +++++++------- .../portal/src/assets/style/k.dark.token.css | 42 +++++++------- .../portal/src/assets/style/k.light.token.css | 42 +++++++------- 13 files changed, 277 insertions(+), 258 deletions(-) diff --git a/packages/opendesign/src/_styles/dark.token.css b/packages/opendesign/src/_styles/dark.token.css index 5760dc36d..2b824c972 100644 --- a/packages/opendesign/src/_styles/dark.token.css +++ b/packages/opendesign/src/_styles/dark.token.css @@ -1571,35 +1571,35 @@ /** * @name 超小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超小尺寸控件图标(组件使用) */ --o-icon_size_control-xs: 16px; /** * @name 小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 小尺寸控件图标(组件使用) */ --o-icon_size_control-s: 20px; /** * @name 中尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 中尺寸控件图标(组件使用) */ --o-icon_size_control-m: 24px; /** * @name 大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 大尺寸控件图标(组件使用) */ --o-icon_size_control-l: 32px; /** * @name 超大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超大尺寸控件图标(组件使用) */ --o-icon_size_control-xl: 40px; @@ -1793,33 +1793,33 @@ */ --o-radius-xl: 24px; /** - * @name 大尺寸控件圆角 - * @type size - * @group radius - * @description 大尺寸控件圆角(组件使用) - */ - --o-radius_control-l: 16px; - /** - * @name 中尺寸控件圆角 + * @name 超小尺寸控件圆角 * @type size - * @group radius - * @description 中尺寸控件圆角(组件使用) + * @group radius_control + * @description 超小尺寸控件圆角(组件使用) */ - --o-radius_control-m: 12px; + --o-radius_control-xs: 4px; /** * @name 小尺寸控件圆角 * @type size - * @group radius + * @group radius_control * @description 小尺寸控件圆角(组件使用) */ --o-radius_control-s: 8px; /** - * @name 超小尺寸控件圆角 + * @name 中尺寸控件圆角 * @type size - * @group radius - * @description 超小尺寸控件圆角(组件使用) + * @group radius_control + * @description 中尺寸控件圆角(组件使用) */ - --o-radius_control-xs: 4px; + --o-radius_control-m: 12px; + /** + * @name 大尺寸控件圆角 + * @type size + * @group radius_control + * @description 大尺寸控件圆角(组件使用) + */ + --o-radius_control-l: 16px; /** * @name 持续时间 * @type animation diff --git a/packages/opendesign/src/_styles/light.token.css b/packages/opendesign/src/_styles/light.token.css index 9f6c55a6c..e60244d0d 100644 --- a/packages/opendesign/src/_styles/light.token.css +++ b/packages/opendesign/src/_styles/light.token.css @@ -1571,35 +1571,35 @@ /** * @name 超小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超小尺寸控件图标(组件使用) */ --o-icon_size_control-xs: 16px; /** * @name 小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 小尺寸控件图标(组件使用) */ --o-icon_size_control-s: 20px; /** * @name 中尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 中尺寸控件图标(组件使用) */ --o-icon_size_control-m: 24px; /** * @name 大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 大尺寸控件图标(组件使用) */ --o-icon_size_control-l: 32px; /** * @name 超大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超大尺寸控件图标(组件使用) */ --o-icon_size_control-xl: 40px; @@ -1793,33 +1793,33 @@ */ --o-radius-xl: 24px; /** - * @name 大尺寸控件圆角 - * @type size - * @group radius - * @description 大尺寸控件圆角(组件使用) - */ - --o-radius_control-l: 16px; - /** - * @name 中尺寸控件圆角 + * @name 超小尺寸控件圆角 * @type size - * @group radius - * @description 中尺寸控件圆角(组件使用) + * @group radius_control + * @description 超小尺寸控件圆角(组件使用) */ - --o-radius_control-m: 12px; + --o-radius_control-xs: 4px; /** * @name 小尺寸控件圆角 * @type size - * @group radius + * @group radius_control * @description 小尺寸控件圆角(组件使用) */ --o-radius_control-s: 8px; /** - * @name 超小尺寸控件圆角 + * @name 中尺寸控件圆角 * @type size - * @group radius - * @description 超小尺寸控件圆角(组件使用) + * @group radius_control + * @description 中尺寸控件圆角(组件使用) */ - --o-radius_control-xs: 4px; + --o-radius_control-m: 12px; + /** + * @name 大尺寸控件圆角 + * @type size + * @group radius_control + * @description 大尺寸控件圆角(组件使用) + */ + --o-radius_control-l: 16px; /** * @name 持续时间 * @type animation diff --git a/packages/opendesign/tokens/opendesign-token.json b/packages/opendesign/tokens/opendesign-token.json index 78a47a7c9..47c1f6de7 100644 --- a/packages/opendesign/tokens/opendesign-token.json +++ b/packages/opendesign/tokens/opendesign-token.json @@ -1868,7 +1868,14 @@ "light": "64px", "dark": "64px" } - }, + } + ] + }, + "icon_size_control": { + "name": "组件图标尺寸", + "type": "size", + "typeName": "尺寸", + "value": [ { "key": "icon_size_control-xs", "name": "超小尺寸图标", @@ -2179,14 +2186,30 @@ "light": "24px", "dark": "24px" } + } + ] + }, + "radius_control": { + "name": "组件圆角尺寸", + "type": "size", + "typeName": "尺寸", + "value": [ + { + "key": "radius_control-xs", + "name": "超小尺寸控件圆角", + "description": "超小尺寸控件圆角(组件使用)", + "value": { + "light": "4px", + "dark": "4px" + } }, { - "key": "radius_control-l", - "name": "大尺寸控件圆角", - "description": "大尺寸控件圆角(组件使用)", + "key": "radius_control-s", + "name": "小尺寸控件圆角", + "description": "小尺寸控件圆角(组件使用)", "value": { - "light": "16px", - "dark": "16px" + "light": "8px", + "dark": "8px" } }, { @@ -2199,25 +2222,17 @@ } }, { - "key": "radius_control-s", - "name": "小尺寸控件圆角", - "description": "小尺寸控件圆角(组件使用)", - "value": { - "light": "8px", - "dark": "8px" - } - }, - { - "key": "radius_control-xs", - "name": "超小尺寸控件圆角", - "description": "超小尺寸控件圆角(组件使用)", + "key": "radius_control-l", + "name": "大尺寸控件圆角", + "description": "大尺寸控件圆角(组件使用)", "value": { - "light": "4px", - "dark": "4px" + "light": "16px", + "dark": "16px" } } ] }, + "duration": { "name": "动画持续时间", "type": "animation", diff --git a/packages/portal-ak/src/ak/theme/a.dark.token.css b/packages/portal-ak/src/ak/theme/a.dark.token.css index e819000b9..4157825ef 100644 --- a/packages/portal-ak/src/ak/theme/a.dark.token.css +++ b/packages/portal-ak/src/ak/theme/a.dark.token.css @@ -1592,35 +1592,35 @@ /** * @name 超小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超小尺寸控件图标(组件使用) */ --o-icon_size_control-xs: 16px; /** * @name 小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 小尺寸控件图标(组件使用) */ --o-icon_size_control-s: 20px; /** * @name 中尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 中尺寸控件图标(组件使用) */ --o-icon_size_control-m: 24px; /** * @name 大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 大尺寸控件图标(组件使用) */ --o-icon_size_control-l: 32px; /** * @name 超大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超大尺寸控件图标(组件使用) */ --o-icon_size_control-xl: 40px; @@ -1814,33 +1814,33 @@ */ --o-radius-xl: 24px; /** - * @name 大尺寸控件圆角 - * @type size - * @group radius - * @description 大尺寸控件圆角(组件使用) - */ - --o-radius_control-l: 16px; - /** - * @name 中尺寸控件圆角 + * @name 超小尺寸控件圆角 * @type size - * @group radius - * @description 中尺寸控件圆角(组件使用) + * @group radius_control + * @description 超小尺寸控件圆角(组件使用) */ - --o-radius_control-m: 12px; + --o-radius_control-xs: 4px; /** * @name 小尺寸控件圆角 * @type size - * @group radius + * @group radius_control * @description 小尺寸控件圆角(组件使用) */ --o-radius_control-s: 8px; /** - * @name 超小尺寸控件圆角 + * @name 中尺寸控件圆角 * @type size - * @group radius - * @description 超小尺寸控件圆角(组件使用) + * @group radius_control + * @description 中尺寸控件圆角(组件使用) */ - --o-radius_control-xs: 4px; + --o-radius_control-m: 12px; + /** + * @name 大尺寸控件圆角 + * @type size + * @group radius_control + * @description 大尺寸控件圆角(组件使用) + */ + --o-radius_control-l: 16px; /** * @name 持续时间 * @type animation diff --git a/packages/portal-ak/src/ak/theme/a.light.token.css b/packages/portal-ak/src/ak/theme/a.light.token.css index 5c9ccf9f3..cbbe66969 100644 --- a/packages/portal-ak/src/ak/theme/a.light.token.css +++ b/packages/portal-ak/src/ak/theme/a.light.token.css @@ -1592,35 +1592,35 @@ /** * @name 超小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超小尺寸控件图标(组件使用) */ --o-icon_size_control-xs: 16px; /** * @name 小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 小尺寸控件图标(组件使用) */ --o-icon_size_control-s: 20px; /** * @name 中尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 中尺寸控件图标(组件使用) */ --o-icon_size_control-m: 24px; /** * @name 大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 大尺寸控件图标(组件使用) */ --o-icon_size_control-l: 32px; /** * @name 超大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超大尺寸控件图标(组件使用) */ --o-icon_size_control-xl: 40px; @@ -1814,33 +1814,33 @@ */ --o-radius-xl: 24px; /** - * @name 大尺寸控件圆角 - * @type size - * @group radius - * @description 大尺寸控件圆角(组件使用) - */ - --o-radius_control-l: 16px; - /** - * @name 中尺寸控件圆角 + * @name 超小尺寸控件圆角 * @type size - * @group radius - * @description 中尺寸控件圆角(组件使用) + * @group radius_control + * @description 超小尺寸控件圆角(组件使用) */ - --o-radius_control-m: 12px; + --o-radius_control-xs: 4px; /** * @name 小尺寸控件圆角 * @type size - * @group radius + * @group radius_control * @description 小尺寸控件圆角(组件使用) */ --o-radius_control-s: 8px; /** - * @name 超小尺寸控件圆角 + * @name 中尺寸控件圆角 * @type size - * @group radius - * @description 超小尺寸控件圆角(组件使用) + * @group radius_control + * @description 中尺寸控件圆角(组件使用) */ - --o-radius_control-xs: 4px; + --o-radius_control-m: 12px; + /** + * @name 大尺寸控件圆角 + * @type size + * @group radius_control + * @description 大尺寸控件圆角(组件使用) + */ + --o-radius_control-l: 16px; /** * @name 持续时间 * @type animation diff --git a/packages/portal-ak/src/ak/theme/a.media.token.css b/packages/portal-ak/src/ak/theme/a.media.token.css index 02377911b..c40be2572 100644 --- a/packages/portal-ak/src/ak/theme/a.media.token.css +++ b/packages/portal-ak/src/ak/theme/a.media.token.css @@ -1,7 +1,6 @@ @media (min-width: 1201px) and (max-width: 1440px) { - - [data-o-theme='light'], - [data-o-theme='dark'] { + [data-o-theme='a.light'], + [data-o-theme='a.dark'] { /** * @name 中尺寸 * @type size @@ -20,9 +19,8 @@ } @media (max-width: 1200px) { - - [data-o-theme='light'], - [data-o-theme='dark'] { + [data-o-theme='a.light'], + [data-o-theme='a.dark'] { /** * @name 中尺寸 * @type size @@ -31,4 +29,4 @@ */ --o-control_size-m: 28px; } -} \ No newline at end of file +} diff --git a/packages/portal-ak/src/ak/theme/k.dark.token.css b/packages/portal-ak/src/ak/theme/k.dark.token.css index ffa810c33..122ab423c 100644 --- a/packages/portal-ak/src/ak/theme/k.dark.token.css +++ b/packages/portal-ak/src/ak/theme/k.dark.token.css @@ -1592,35 +1592,35 @@ /** * @name 超小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超小尺寸控件图标(组件使用) */ --o-icon_size_control-xs: 16px; /** * @name 小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 小尺寸控件图标(组件使用) */ --o-icon_size_control-s: 20px; /** * @name 中尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 中尺寸控件图标(组件使用) */ --o-icon_size_control-m: 24px; /** * @name 大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 大尺寸控件图标(组件使用) */ --o-icon_size_control-l: 32px; /** * @name 超大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超大尺寸控件图标(组件使用) */ --o-icon_size_control-xl: 40px; @@ -1814,33 +1814,33 @@ */ --o-radius-xl: 0px; /** - * @name 大尺寸控件圆角 - * @type size - * @group radius - * @description 大尺寸控件圆角(组件使用) - */ - --o-radius_control-l: 0px; - /** - * @name 中尺寸控件圆角 + * @name 超小尺寸控件圆角 * @type size - * @group radius - * @description 中尺寸控件圆角(组件使用) + * @group radius_control + * @description 超小尺寸控件圆角(组件使用) */ - --o-radius_control-m: 4px; + --o-radius_control-xs: 4px; /** * @name 小尺寸控件圆角 * @type size - * @group radius + * @group radius_control * @description 小尺寸控件圆角(组件使用) */ --o-radius_control-s: 4px; /** - * @name 超小尺寸控件圆角 + * @name 中尺寸控件圆角 * @type size - * @group radius - * @description 超小尺寸控件圆角(组件使用) + * @group radius_control + * @description 中尺寸控件圆角(组件使用) */ - --o-radius_control-xs: 4px; + --o-radius_control-m: 4px; + /** + * @name 大尺寸控件圆角 + * @type size + * @group radius_control + * @description 大尺寸控件圆角(组件使用) + */ + --o-radius_control-l: 4px; /** * @name 持续时间 * @type animation diff --git a/packages/portal-ak/src/ak/theme/k.light.token.css b/packages/portal-ak/src/ak/theme/k.light.token.css index 9e36e4bcf..30e2009bf 100644 --- a/packages/portal-ak/src/ak/theme/k.light.token.css +++ b/packages/portal-ak/src/ak/theme/k.light.token.css @@ -1592,35 +1592,35 @@ /** * @name 超小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超小尺寸控件图标(组件使用) */ --o-icon_size_control-xs: 16px; /** * @name 小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 小尺寸控件图标(组件使用) */ --o-icon_size_control-s: 20px; /** * @name 中尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 中尺寸控件图标(组件使用) */ --o-icon_size_control-m: 24px; /** * @name 大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 大尺寸控件图标(组件使用) */ --o-icon_size_control-l: 32px; /** * @name 超大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超大尺寸控件图标(组件使用) */ --o-icon_size_control-xl: 40px; @@ -1814,33 +1814,33 @@ */ --o-radius-xl: 0px; /** - * @name 大尺寸控件圆角 - * @type size - * @group radius - * @description 大尺寸控件圆角(组件使用) - */ - --o-radius_control-l: 0px; - /** - * @name 中尺寸控件圆角 + * @name 超小尺寸控件圆角 * @type size - * @group radius - * @description 中尺寸控件圆角(组件使用) + * @group radius_control + * @description 超小尺寸控件圆角(组件使用) */ - --o-radius_control-m: 4px; + --o-radius_control-xs: 4px; /** * @name 小尺寸控件圆角 * @type size - * @group radius + * @group radius_control * @description 小尺寸控件圆角(组件使用) */ --o-radius_control-s: 4px; /** - * @name 超小尺寸控件圆角 + * @name 中尺寸控件圆角 * @type size - * @group radius - * @description 超小尺寸控件圆角(组件使用) + * @group radius_control + * @description 中尺寸控件圆角(组件使用) */ - --o-radius_control-xs: 4px; + --o-radius_control-m: 4px; + /** + * @name 大尺寸控件圆角 + * @type size + * @group radius_control + * @description 大尺寸控件圆角(组件使用) + */ + --o-radius_control-l: 4px; /** * @name 持续时间 * @type animation diff --git a/packages/portal-ak/src/ak/theme/k.media.token.css b/packages/portal-ak/src/ak/theme/k.media.token.css index 5fb73fb4f..0e9838094 100644 --- a/packages/portal-ak/src/ak/theme/k.media.token.css +++ b/packages/portal-ak/src/ak/theme/k.media.token.css @@ -1,28 +1,34 @@ -/* theme: dark */ -@media screen and (max-width: 1200px) { - [data-o-theme='k.dark'], - [data-o-theme='k.light'] { - --o-control_size-m: 28px; - } -} +@media (min-width: 1201px) and (max-width: 1440px) { -@media screen and (max-width: 1200px) and (min-width: 600px) { - [data-o-theme='k.dark'], - [data-o-theme='k.light'] { + [data-o-theme='k.light'], + [data-o-theme='k.dark'] { + /** + * @name 中尺寸 + * @type size + * @group control_size + * @description 尺寸 + */ + --o-control_size-m: 28px; + /** + * @name 大尺寸 + * @type size + * @group control_size + * @description 尺寸 + */ --o-control_size-l: 36px; } } -@media screen and (max-width: 1200px) { - [data-o-theme='k.dark'], - [data-o-theme='k.light'] { - --o-control_size-m: 28px; - } -} +@media (max-width: 1200px) { -@media screen and (max-width: 600px) { - [data-o-theme='k.dark'], - [data-o-theme='k.light'] { - --o-radius-xl: 8px; + [data-o-theme='k.light'], + [data-o-theme='k.dark'] { + /** + * @name 中尺寸 + * @type size + * @group control_size + * @description 尺寸 + */ + --o-control_size-m: 28px; } -} +} \ No newline at end of file diff --git a/packages/portal/src/assets/style/a.dark.token.css b/packages/portal/src/assets/style/a.dark.token.css index e819000b9..4157825ef 100644 --- a/packages/portal/src/assets/style/a.dark.token.css +++ b/packages/portal/src/assets/style/a.dark.token.css @@ -1592,35 +1592,35 @@ /** * @name 超小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超小尺寸控件图标(组件使用) */ --o-icon_size_control-xs: 16px; /** * @name 小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 小尺寸控件图标(组件使用) */ --o-icon_size_control-s: 20px; /** * @name 中尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 中尺寸控件图标(组件使用) */ --o-icon_size_control-m: 24px; /** * @name 大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 大尺寸控件图标(组件使用) */ --o-icon_size_control-l: 32px; /** * @name 超大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超大尺寸控件图标(组件使用) */ --o-icon_size_control-xl: 40px; @@ -1814,33 +1814,33 @@ */ --o-radius-xl: 24px; /** - * @name 大尺寸控件圆角 - * @type size - * @group radius - * @description 大尺寸控件圆角(组件使用) - */ - --o-radius_control-l: 16px; - /** - * @name 中尺寸控件圆角 + * @name 超小尺寸控件圆角 * @type size - * @group radius - * @description 中尺寸控件圆角(组件使用) + * @group radius_control + * @description 超小尺寸控件圆角(组件使用) */ - --o-radius_control-m: 12px; + --o-radius_control-xs: 4px; /** * @name 小尺寸控件圆角 * @type size - * @group radius + * @group radius_control * @description 小尺寸控件圆角(组件使用) */ --o-radius_control-s: 8px; /** - * @name 超小尺寸控件圆角 + * @name 中尺寸控件圆角 * @type size - * @group radius - * @description 超小尺寸控件圆角(组件使用) + * @group radius_control + * @description 中尺寸控件圆角(组件使用) */ - --o-radius_control-xs: 4px; + --o-radius_control-m: 12px; + /** + * @name 大尺寸控件圆角 + * @type size + * @group radius_control + * @description 大尺寸控件圆角(组件使用) + */ + --o-radius_control-l: 16px; /** * @name 持续时间 * @type animation diff --git a/packages/portal/src/assets/style/a.light.token.css b/packages/portal/src/assets/style/a.light.token.css index 5c9ccf9f3..cbbe66969 100644 --- a/packages/portal/src/assets/style/a.light.token.css +++ b/packages/portal/src/assets/style/a.light.token.css @@ -1592,35 +1592,35 @@ /** * @name 超小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超小尺寸控件图标(组件使用) */ --o-icon_size_control-xs: 16px; /** * @name 小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 小尺寸控件图标(组件使用) */ --o-icon_size_control-s: 20px; /** * @name 中尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 中尺寸控件图标(组件使用) */ --o-icon_size_control-m: 24px; /** * @name 大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 大尺寸控件图标(组件使用) */ --o-icon_size_control-l: 32px; /** * @name 超大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超大尺寸控件图标(组件使用) */ --o-icon_size_control-xl: 40px; @@ -1814,33 +1814,33 @@ */ --o-radius-xl: 24px; /** - * @name 大尺寸控件圆角 - * @type size - * @group radius - * @description 大尺寸控件圆角(组件使用) - */ - --o-radius_control-l: 16px; - /** - * @name 中尺寸控件圆角 + * @name 超小尺寸控件圆角 * @type size - * @group radius - * @description 中尺寸控件圆角(组件使用) + * @group radius_control + * @description 超小尺寸控件圆角(组件使用) */ - --o-radius_control-m: 12px; + --o-radius_control-xs: 4px; /** * @name 小尺寸控件圆角 * @type size - * @group radius + * @group radius_control * @description 小尺寸控件圆角(组件使用) */ --o-radius_control-s: 8px; /** - * @name 超小尺寸控件圆角 + * @name 中尺寸控件圆角 * @type size - * @group radius - * @description 超小尺寸控件圆角(组件使用) + * @group radius_control + * @description 中尺寸控件圆角(组件使用) */ - --o-radius_control-xs: 4px; + --o-radius_control-m: 12px; + /** + * @name 大尺寸控件圆角 + * @type size + * @group radius_control + * @description 大尺寸控件圆角(组件使用) + */ + --o-radius_control-l: 16px; /** * @name 持续时间 * @type animation diff --git a/packages/portal/src/assets/style/k.dark.token.css b/packages/portal/src/assets/style/k.dark.token.css index ffa810c33..122ab423c 100644 --- a/packages/portal/src/assets/style/k.dark.token.css +++ b/packages/portal/src/assets/style/k.dark.token.css @@ -1592,35 +1592,35 @@ /** * @name 超小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超小尺寸控件图标(组件使用) */ --o-icon_size_control-xs: 16px; /** * @name 小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 小尺寸控件图标(组件使用) */ --o-icon_size_control-s: 20px; /** * @name 中尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 中尺寸控件图标(组件使用) */ --o-icon_size_control-m: 24px; /** * @name 大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 大尺寸控件图标(组件使用) */ --o-icon_size_control-l: 32px; /** * @name 超大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超大尺寸控件图标(组件使用) */ --o-icon_size_control-xl: 40px; @@ -1814,33 +1814,33 @@ */ --o-radius-xl: 0px; /** - * @name 大尺寸控件圆角 - * @type size - * @group radius - * @description 大尺寸控件圆角(组件使用) - */ - --o-radius_control-l: 0px; - /** - * @name 中尺寸控件圆角 + * @name 超小尺寸控件圆角 * @type size - * @group radius - * @description 中尺寸控件圆角(组件使用) + * @group radius_control + * @description 超小尺寸控件圆角(组件使用) */ - --o-radius_control-m: 4px; + --o-radius_control-xs: 4px; /** * @name 小尺寸控件圆角 * @type size - * @group radius + * @group radius_control * @description 小尺寸控件圆角(组件使用) */ --o-radius_control-s: 4px; /** - * @name 超小尺寸控件圆角 + * @name 中尺寸控件圆角 * @type size - * @group radius - * @description 超小尺寸控件圆角(组件使用) + * @group radius_control + * @description 中尺寸控件圆角(组件使用) */ - --o-radius_control-xs: 4px; + --o-radius_control-m: 4px; + /** + * @name 大尺寸控件圆角 + * @type size + * @group radius_control + * @description 大尺寸控件圆角(组件使用) + */ + --o-radius_control-l: 4px; /** * @name 持续时间 * @type animation diff --git a/packages/portal/src/assets/style/k.light.token.css b/packages/portal/src/assets/style/k.light.token.css index 9e36e4bcf..30e2009bf 100644 --- a/packages/portal/src/assets/style/k.light.token.css +++ b/packages/portal/src/assets/style/k.light.token.css @@ -1592,35 +1592,35 @@ /** * @name 超小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超小尺寸控件图标(组件使用) */ --o-icon_size_control-xs: 16px; /** * @name 小尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 小尺寸控件图标(组件使用) */ --o-icon_size_control-s: 20px; /** * @name 中尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 中尺寸控件图标(组件使用) */ --o-icon_size_control-m: 24px; /** * @name 大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 大尺寸控件图标(组件使用) */ --o-icon_size_control-l: 32px; /** * @name 超大尺寸图标 * @type size - * @group icon_size + * @group icon_size_control * @description 超大尺寸控件图标(组件使用) */ --o-icon_size_control-xl: 40px; @@ -1814,33 +1814,33 @@ */ --o-radius-xl: 0px; /** - * @name 大尺寸控件圆角 - * @type size - * @group radius - * @description 大尺寸控件圆角(组件使用) - */ - --o-radius_control-l: 0px; - /** - * @name 中尺寸控件圆角 + * @name 超小尺寸控件圆角 * @type size - * @group radius - * @description 中尺寸控件圆角(组件使用) + * @group radius_control + * @description 超小尺寸控件圆角(组件使用) */ - --o-radius_control-m: 4px; + --o-radius_control-xs: 4px; /** * @name 小尺寸控件圆角 * @type size - * @group radius + * @group radius_control * @description 小尺寸控件圆角(组件使用) */ --o-radius_control-s: 4px; /** - * @name 超小尺寸控件圆角 + * @name 中尺寸控件圆角 * @type size - * @group radius - * @description 超小尺寸控件圆角(组件使用) + * @group radius_control + * @description 中尺寸控件圆角(组件使用) */ - --o-radius_control-xs: 4px; + --o-radius_control-m: 4px; + /** + * @name 大尺寸控件圆角 + * @type size + * @group radius_control + * @description 大尺寸控件圆角(组件使用) + */ + --o-radius_control-l: 4px; /** * @name 持续时间 * @type animation -- Gitee