style: 边栏样式调整 & select clear icon (#5898)

* style: 边栏样式调整

* style: select clear icon fix

* 更新快照

* fix:更新快照

* style: 变量调整
This commit is contained in:
qinhaoyan 2022-12-14 15:34:05 +08:00 committed by GitHub
parent 52da216b90
commit b9f11fe7ae
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 16 additions and 12 deletions

View File

@ -790,7 +790,7 @@ $remFactor: 16px;
--Layout-aside--lg-width: #{px2rem(300px)}; --Layout-aside--lg-width: #{px2rem(300px)};
--Layout-aside--md-width: #{px2rem(250px)}; --Layout-aside--md-width: #{px2rem(250px)};
--Layout-aside--sm-width: #{px2rem(150px)}; --Layout-aside--sm-width: #{px2rem(150px)};
--Layout-aside-bg: var(--colors-brand-1); --Layout-aside-bg: var(--colors-neutral-fill-2);
--Layout-aside-color: #{desaturate(lighten($dark, 40%), 10%)}; --Layout-aside-color: #{desaturate(lighten($dark, 40%), 10%)};
--Layout-aside-onAcitve-bg: #{saturate(darken($dark, 5%), 2.5%)}; --Layout-aside-onAcitve-bg: #{saturate(darken($dark, 5%), 2.5%)};
--Layout-aside-onHover-bg: #{saturate(darken($dark, 3%), 2.5%)}; --Layout-aside-onHover-bg: #{saturate(darken($dark, 3%), 2.5%)};
@ -813,7 +813,7 @@ $remFactor: 16px;
--Layout-asideLink-onHover-iconColor: (--colors-brand-6); --Layout-asideLink-onHover-iconColor: (--colors-brand-6);
--Layout-asideLink-onHover-iconSize: var(--sizes-size-9); --Layout-asideLink-onHover-iconSize: var(--sizes-size-9);
--Layout-asideLink-onHover-arrowColor: var(--colors-neutral-text-11); --Layout-asideLink-onHover-arrowColor: var(--colors-neutral-text-11);
--Layout-brand-bg: var(--colors-brand-1); --Layout-brand-bg: var(--colors-neutral-fill-2);
--Layout-brand-color: var(--colors-neutral-text-11); --Layout-brand-color: var(--colors-neutral-text-11);
--Layout-brandBar-color: #{desaturate(lighten($dark, 40%), 10%)}; --Layout-brandBar-color: #{desaturate(lighten($dark, 40%), 10%)};
--Layout-header-bg: var(--colors-neutral-fill-10); --Layout-header-bg: var(--colors-neutral-fill-10);

View File

@ -424,9 +424,10 @@
z-index: 2; z-index: 2;
svg { svg {
fill: var(--Form-input-iconColor); fill: var(--Form-input-clearBtn-color);
width: px2rem(14px); color: var(--Form-input-clearBtn-color);
height: px2rem(14px); width: var(--Form-input-clearBtn-size);
height: var(--Form-input-clearBtn-size);
top: 0; top: 0;
&:hover > path { &:hover > path {

View File

@ -38,6 +38,7 @@
margin: 0; margin: 0;
padding: 0 12px; padding: 0 12px;
border-spacing: 0 8px; border-spacing: 0 8px;
border-collapse: inherit;
} }
.rdtMonths, .rdtMonths,

View File

@ -7,6 +7,8 @@
:root { :root {
--Layout-header-boxShadow: 0 0.125rem 0.125rem rgba(0, 0, 0, 0.05), --Layout-header-boxShadow: 0 0.125rem 0.125rem rgba(0, 0, 0, 0.05),
0 1px 0 rgba(0, 0, 0, 0.05); 0 1px 0 rgba(0, 0, 0, 0.05);
--Layout-aside-bg: var(--colors-brand-1);
--Layout-brand-bg: var(--colors-brand-1);
--Layout-asideLink-color: #b4b6bd; --Layout-asideLink-color: #b4b6bd;
--Layout-asideLink-onHover-color: #fff; --Layout-asideLink-onHover-color: #fff;
--Layout-asideLink-onHover-iconColor: #fff; --Layout-asideLink-onHover-iconColor: #fff;

View File

@ -1302,7 +1302,7 @@ export class Select extends React.Component<SelectProps, SelectState> {
? value.length ? value.length
: value != null && value !== resetValue) ? ( : value != null && value !== resetValue) ? (
<a onClick={this.clearValue} className={cx('Select-clear')}> <a onClick={this.clearValue} className={cx('Select-clear')}>
<Icon icon="close-small" className="icon" /> <Icon icon="input-clear" className="icon" />
</a> </a>
) : null} ) : null}
{loading ? ( {loading ? (

View File

@ -88,8 +88,8 @@ exports[`Renderer:inputCity 1`] = `
class="cxd-Select-clear" class="cxd-Select-clear"
> >
<icon-mock <icon-mock
classname="icon icon-close-small" classname="icon icon-input-clear"
icon="close-small" icon="input-clear"
/> />
</a> </a>
<span <span
@ -122,8 +122,8 @@ exports[`Renderer:inputCity 1`] = `
class="cxd-Select-clear" class="cxd-Select-clear"
> >
<icon-mock <icon-mock
classname="icon icon-close-small" classname="icon icon-input-clear"
icon="close-small" icon="input-clear"
/> />
</a> </a>
<span <span
@ -156,8 +156,8 @@ exports[`Renderer:inputCity 1`] = `
class="cxd-Select-clear" class="cxd-Select-clear"
> >
<icon-mock <icon-mock
classname="icon icon-close-small" classname="icon icon-input-clear"
icon="close-small" icon="input-clear"
/> />
</a> </a>
<span <span