test/amis
1
0
Fork 0
mirror of https://gitee.com/baidu/amis.git synced 2024-12-02 03:48:13 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

perf: 修改date-range移动端样式 (#3362)

Browse Source
This commit is contained in:
HongYang 2022-01-07 19:26:36 +08:00 committed by GitHub
parent 1d467ad580
commit 97ad91cf69
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 37 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
scss/components/form/_date-range.scss
View File

@ -148,3 +148,36 @@
background: var(--DatePicker-bg);
border-radius: var(--DatePicker-borderRadius);
}
// 移动端输入框样式
.#{$ns}DateRangePicker.is-mobile {
border: 0;
justify-content: flex-end;
span,
a {
&:focus {
outline: unset;
}
}
.#{$ns}DateRangePicker-value,
.#{$ns}DateRangePicker-clear {
display: inline-flex;
justify-content: flex-end;
padding: 0 0;
}
.#{$ns}DateRangePicker-value {
margin-right: var(--gap-xs);
}
.#{$ns}DateRangePicker-placeholder {
flex-grow: unset;
flex-basis: unset;
}
.#{$ns}DateRangePicker-toggler {
margin-top: -3px;
}
}

3
src/components/DateRangePicker.tsx
View File

@ -865,7 +865,8 @@ export class DateRangePicker extends React.Component<
{
'is-disabled': disabled,
'is-focused': isFocused,
[`${ns}DateRangePicker--border${ucFirst(borderMode)}`]: borderMode
[`${ns}DateRangePicker--border${ucFirst(borderMode)}`]: borderMode,
'is-mobile': useMobileUI && isMobile()
},
className
)}

3
src/components/MonthRangePicker.tsx
View File

@ -624,7 +624,8 @@ export class MonthRangePicker extends React.Component<
`${ns}DateRangePicker`,
{
'is-disabled': disabled,
'is-focused': isFocused
'is-focused': isFocused,
'is-mobile': useMobileUI && isMobile()
},
className
)}