Skip to content

feat(button): [button] Adapting to the SMB theme #2148

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 7 commits into from
Sep 20, 2024
Merged

feat(button): [button] Adapting to the SMB theme #2148

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
bd16ad4
feat(button): [button] Adapting to the SMB theme
Youyou-smiles Sep 12, 2024
8883774
Merge branch 'dev' of github.com:You-Hw-Y/tiny-vue into lty/feat-button
Youyou-smiles Sep 12, 2024
7044414
feat(button): [button] Adapting to the SMB theme
Youyou-smiles Sep 12, 2024
73aef10
feat(button): [button] Adapting to the SMB theme
Youyou-smiles Sep 12, 2024
af7f382
feat(button): [button] Adapting to the SMB theme
Youyou-smiles Sep 13, 2024
bfc401f
Merge branch 'dev' of github.com:You-Hw-Y/tiny-vue into lty/feat-button
Youyou-smiles Sep 19, 2024
ae13d16
feat(button): [button]Adapting to the SMB theme
Youyou-smiles Sep 19, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 4 additions & 7 deletions packages/theme/src/button/index.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,6 @@
color: var(--ti-button-normal-text-color);
fill: var(--ti-button-normal-text-color);
font-size: var(--ti-button-font-size);
min-width: var(--ti-button-size-normal-min-width);
white-space: nowrap;
text-overflow: ellipsis;
cursor: pointer;
Expand Down Expand Up @@ -61,10 +60,8 @@

&.is-only-icon {
width: var(--ti-button-only-icon-width);
min-width: var(--ti-button-only-icon-min-width);
padding: 0 var(--ti-button-only-icon-padding-horizontal);
padding: 0;
border-radius: var(--ti-button-only-icon-border-radius);
border-color: var(--ti-button-only-icon-border-color);

&:hover {
border-color: var(--ti-button-only-icon-hover-border-color);
Expand All @@ -78,6 +75,9 @@
}
}
}
&.is-only-icon.is-circle {
width: unset;
}

&::-moz-focus-inner {
border: 0;
Expand Down Expand Up @@ -157,9 +157,6 @@
);
}

& + & {
margin-left: 8px;
}

&.is-loading {
position: relative;
Expand Down
10 changes: 2 additions & 8 deletions packages/theme/src/button/vars.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,8 +25,6 @@
--ti-button-loading-bg-color: rgba(255, 255, 255, 0.5);
--ti-button-loading-font-size: var(--ti-common-font-size-1);

// 默认按钮最小宽度
--ti-button-size-normal-min-width: var(--ti-common-size-24x);
// 默认按钮最大宽度
--ti-button-size-normal-max-width: var(--ti-common-size-width-medium, 120px);
// 默认按钮的高度
Expand Down Expand Up @@ -436,15 +434,11 @@
// 纯图标按钮最小宽度
--ti-button-icon-font-size: var(--ti-common-font-size-2);
// 纯图标/文字按钮宽度
--ti-button-only-icon-width: var(--ti-common-size-8x);
--ti-button-only-icon-min-width: unset;
--ti-button-only-icon-width: 32px;
--ti-button-only-icon-text-width: var(--ti-common-size-6x);
// 纯图标按钮水平内边距
--ti-button-only-icon-padding-horizontal: 7px;

// 纯图标按钮边框圆角
--ti-button-only-icon-border-radius: var(--ti-common-border-radius-3);
// 纯图标按钮边框颜色
--ti-button-only-icon-border-color: #c2c2c2;
// 纯图标按钮悬浮时边框颜色
--ti-button-only-icon-hover-border-color: #191919;
// 纯图标按钮禁用时边框颜色
Expand Down
4 changes: 0 additions & 4 deletions packages/theme/src/mixins/button.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -203,8 +203,4 @@
width: @svg-width;
height: @svg-height;
}

&.is-only-icon {
min-width: unset;
}
}