From 0c4b966b521daddb57cfb4dbb1131fa1a69b9208 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C2=B0=29=29=29=29=E5=BD=A1?= Date: Thu, 11 Apr 2019 14:43:32 +0800 Subject: [PATCH] feat(module: styles): styles in sync with antd mobile of react (#376) * feat(module: styles): styles in sync with antd mobile of react --- components/accordion/style/addon.less | 6 +- components/accordion/style/index.less | 4 - components/action-sheet/style/index.less | 22 ++++- .../activity-indicator/style/index.less | 4 +- components/button/style/index.less | 3 + components/calendar/style/index.less | 1 - components/carousel/style/addon.less | 25 ++++++ components/carousel/style/carousel-slide.less | 20 ----- components/carousel/style/index.less | 4 - components/components.less | 4 +- components/flex/style/index.less | 16 ++-- components/grid/style/index.less | 24 +++--- components/icon/style/index.less | 2 +- components/image-picker/style/index.less | 2 +- components/input-item/style/addon.less | 48 +++++++++++ .../input-item/style/custom-keyboard.less | 4 +- components/input-item/style/index.less | 15 +++- components/input-item/style/input-item.less | 47 ----------- components/list/style/index.less | 4 +- components/menu/style/addon.less | 13 +++ components/menu/style/index.less | 6 +- components/modal/style/Dialog.less | 2 + components/modal/style/index.less | 2 - components/notice-bar/style/addon.less | 83 +++++++++++++++++++ components/notice-bar/style/index.less | 13 ++- components/notice-bar/style/notice-bar.less | 82 ------------------ components/pagination/style/index.less | 1 + components/picker/style/index.less | 7 +- components/popover/style/addon.less | 3 + components/popover/style/index.less | 7 +- components/pull-to-refresh/style/index.less | 4 +- components/range/style/index.less | 1 - components/search-bar/style/index.less | 3 + components/slider/style/index.less | 2 +- components/stepper/style/index.less | 2 +- components/steps/style/custom-icon.less | 6 +- components/steps/style/index.less | 14 ++-- components/steps/style/label-placement.less | 4 +- components/steps/style/small.less | 4 +- components/steps/style/vertical.less | 2 +- components/style/mixins/icon.less | 24 +++--- components/textarea-item/style/index.less | 12 ++- components/toast/style/index.less | 3 +- 43 files changed, 303 insertions(+), 252 deletions(-) delete mode 100644 components/carousel/style/carousel-slide.less delete mode 100644 components/input-item/style/input-item.less delete mode 100644 components/notice-bar/style/notice-bar.less create mode 100644 components/popover/style/addon.less diff --git a/components/accordion/style/addon.less b/components/accordion/style/addon.less index f2f4eb47..11dc698e 100644 --- a/components/accordion/style/addon.less +++ b/components/accordion/style/addon.less @@ -2,4 +2,8 @@ .@{accordionPrefixCls} { display: block; -} \ No newline at end of file +} + +accordionpanel { + display: block; +} diff --git a/components/accordion/style/index.less b/components/accordion/style/index.less index 60b0aa02..f1212b00 100755 --- a/components/accordion/style/index.less +++ b/components/accordion/style/index.less @@ -3,10 +3,6 @@ @accordionPrefixCls: am-accordion; -accordionpanel { - display: block; -} - .@{accordionPrefixCls} { position: relative; .hairline('top'); diff --git a/components/action-sheet/style/index.less b/components/action-sheet/style/index.less index 43bdf620..16454dbe 100644 --- a/components/action-sheet/style/index.less +++ b/components/action-sheet/style/index.less @@ -43,19 +43,35 @@ height: @actionsheet-item-height; line-height: @actionsheet-item-height; box-sizing: border-box; + white-space: nowrap; + text-overflow: ellipsis; .hairline('top'); &&-active { background-color: @fill-tap; } } - + &-badge { + display: flex; + align-items: center; + justify-content: center; + .am-badge { + margin-left: 8 * @hd; + flex-shrink: 0; + } + } + &-item-content { + display: inline-block; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } .@{ActionSheetPrefixCls}-cancel-button { - margin-top: @v-spacing-sm; + padding-top: @v-spacing-sm; position: relative; &-mask { position: absolute; - top: -@v-spacing-sm; + top: 0; left: 0; width: 100%; height: @v-spacing-sm; diff --git a/components/activity-indicator/style/index.less b/components/activity-indicator/style/index.less index 01e8fde0..f2bb41aa 100644 --- a/components/activity-indicator/style/index.less +++ b/components/activity-indicator/style/index.less @@ -1,5 +1,5 @@ -@import '../../style/mixins'; @import '../../style/themes/default'; +@import '../../style/mixins'; @activityIndicatorPrefixCls: am-activity-indicator; @@ -74,4 +74,4 @@ transform: rotate(360deg); } } -} \ No newline at end of file +} diff --git a/components/button/style/index.less b/components/button/style/index.less index 23f81305..039606d1 100755 --- a/components/button/style/index.less +++ b/components/button/style/index.less @@ -89,6 +89,9 @@ &-inline { display: inline-block; padding: 0 @h-spacing-lg; + &.@{buttonPrefixCls}-icon { + display: inline-flex; + } } &-small { diff --git a/components/calendar/style/index.less b/components/calendar/style/index.less index 19e08911..c58aea31 100644 --- a/components/calendar/style/index.less +++ b/components/calendar/style/index.less @@ -1,6 +1,5 @@ @import '../../style/mixins'; @import '../../style/themes/default'; -//@import './common/index'; @prefixClass: am-calendar; // Animation diff --git a/components/carousel/style/addon.less b/components/carousel/style/addon.less index 22902117..3ebbc6c2 100644 --- a/components/carousel/style/addon.less +++ b/components/carousel/style/addon.less @@ -2,6 +2,10 @@ dotindicator{ display: block; } +carouselslide { + display: block; +} + .carousel { position: relative; display: block; @@ -29,3 +33,24 @@ dotindicator{ transform: translate3d(0px, 0px, 0px); box-sizing: border-box; } + +.carousel-container { + position: absolute; + display: inline-block; + list-style-type: none; + vertical-align: top; + height: auto; + box-sizing: border-box; +} + +.carousel-slide { + background: white; +} + +.dot-indicator { + position: absolute; + bottom: 0; + left: 0; + width: 100%; + text-align: center; +} diff --git a/components/carousel/style/carousel-slide.less b/components/carousel/style/carousel-slide.less deleted file mode 100644 index 03cb26bc..00000000 --- a/components/carousel/style/carousel-slide.less +++ /dev/null @@ -1,20 +0,0 @@ -.carousel-container { - position: absolute; - display: inline-block; - list-style-type: none; - vertical-align: top; - height: auto; - box-sizing: border-box; -} - -.carousel-slide { - background: white; -} - -.dot-indicator { - position: absolute; - bottom: 0; - left: 0; - width: 100%; - text-align: center; -} diff --git a/components/carousel/style/index.less b/components/carousel/style/index.less index aff5525a..4aa02a30 100644 --- a/components/carousel/style/index.less +++ b/components/carousel/style/index.less @@ -1,10 +1,6 @@ @import '../../style/mixins'; @import '../../style/themes/default'; -carouselslide { - display: block; -} - .am-carousel { position: relative; diff --git a/components/components.less b/components/components.less index 058ce06a..6470d9b0 100644 --- a/components/components.less +++ b/components/components.less @@ -12,7 +12,6 @@ @import "./calendar/style/addon.less"; @import "./card/style/index.less"; @import "./card/style/addon.less"; -@import "./carousel/style/carousel-slide.less"; @import "./carousel/style/index.less"; @import "./carousel/style/addon.less"; @import "./checkbox/style/index.less"; @@ -29,7 +28,6 @@ @import "./image-picker/style/addon.less"; @import "./input-item/style/custom-keyboard.less"; @import "./input-item/style/index.less"; -@import "./input-item/style/input-item.less"; @import "./input-item/style/addon.less"; @import "./list/style/index.less"; @import "./list/style/addon.less"; @@ -41,7 +39,6 @@ @import "./modal/style/addon.less"; @import "./nav-bar/style/index.less"; @import "./notice-bar/style/index.less"; -@import "./notice-bar/style/notice-bar.less"; @import "./notice-bar/style/addon.less"; @import "./pagination/style/index.less"; @import "./pagination/style/addon.less"; @@ -52,6 +49,7 @@ @import "./picker-view/style/addon.less"; @import "./popover/style/base.less"; @import "./popover/style/index.less"; +@import "./popover/style/addon.less"; @import "./progress/style/index.less"; @import "./progress/style/addon.less"; @import "./pull-to-refresh/style/index.less"; diff --git a/components/flex/style/index.less b/components/flex/style/index.less index 055e7772..6169fb02 100755 --- a/components/flex/style/index.less +++ b/components/flex/style/index.less @@ -19,10 +19,16 @@ &&-dir-column { flex-direction: column; + .@{flexPrefixCls}-item { + margin-left: 0; + } } &&-dir-column-reverse { flex-direction: column-reverse; + .@{flexPrefixCls}-item { + margin-left: 0; + } } &&-nowrap { @@ -82,23 +88,23 @@ } &&-align-content-end { - align-items: flex-end; + align-content: flex-end; } &&-align-content-center { - align-items: center; + align-content: center; } &&-align-content-between { - align-items: stretch; + align-content: space-between; } &&-align-content-around { - align-items: baseline; + align-content: space-around; } &&-align-content-stretch { - align-items: baseline; + align-content: stretch; } & &-item { diff --git a/components/grid/style/index.less b/components/grid/style/index.less index d21fa0ee..3cbc79ea 100755 --- a/components/grid/style/index.less +++ b/components/grid/style/index.less @@ -27,7 +27,6 @@ width: 100%; height: 100%; padding: @v-spacing-lg 0; - box-sizing: content-box; .@{gridPrefixCls}-item-inner-content { display: flex; @@ -38,16 +37,12 @@ .@{gridPrefixCls}-icon { max-width: 100%; } - .error { - color: red; - font-size: 24px; - } + .@{gridPrefixCls}-text { margin-top: @v-spacing-md; font-size: @font-size-caption-sm; color: @color-text-base; text-align: center; - line-height: 1; } &.column-num-3 { @@ -80,19 +75,20 @@ .@{flexPrefixCls}-item { position: relative; - // &:first-child { - // .hairline('left'); - // } + &:first-child { + .hairline('left'); + } &:not(:last-child) { .hairline('right'); } } } - } - &.@{gridPrefixCls}-carousel { - .@{gridPrefixCls}-carousel-page { - .hairline('top'); - .hairline('right'); + + &.@{gridPrefixCls}-carousel { + .@{gridPrefixCls}-carousel-page { + .hairline('top'); + .hairline('right'); + } } } diff --git a/components/icon/style/index.less b/components/icon/style/index.less index 53834487..1b66c9bb 100755 --- a/components/icon/style/index.less +++ b/components/icon/style/index.less @@ -1,5 +1,5 @@ -@import '../../style/mixins'; @import '../../style/themes/default'; +@import '../../style/mixins'; .am-icon { fill: currentColor; diff --git a/components/image-picker/style/index.less b/components/image-picker/style/index.less index 93ae5836..f6df42ea 100644 --- a/components/image-picker/style/index.less +++ b/components/image-picker/style/index.less @@ -1,5 +1,5 @@ -@import '../../style/mixins'; @import '../../style/themes/default'; +@import '../../style/mixins'; @imagePickerPrefixCls: am-image-picker; diff --git a/components/input-item/style/addon.less b/components/input-item/style/addon.less index ee7cdc50..eb6b97e6 100644 --- a/components/input-item/style/addon.less +++ b/components/input-item/style/addon.less @@ -9,3 +9,51 @@ customKeyboard, customInput { display: block; } + +.am-list-item.am-list-item-middle .am-list-line { + -webkit-box-align: center; + -webkit-align-items: center; + -ms-flex-align: center; + align-items: center; +} + +.am-list-item .am-list-line { + position: relative; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-box-flex: 1; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + -webkit-align-self: stretch; + -ms-flex-item-align: stretch; + align-self: stretch; + padding-right: 15px; + overflow: hidden; +} + +.am-list-item.am-input-item { + height: 44px; + padding-left: 15px; +} + +.am-list-item { + position: relative; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + padding-left: 15px; + min-height: 44px; + background-color: #fff; + vertical-align: middle; + overflow: hidden; + -webkit-transition: background-color 200ms; + transition: background-color 200ms; + -webkit-box-align: center; + -webkit-align-items: center; + -ms-flex-align: center; + align-items: center; +} diff --git a/components/input-item/style/custom-keyboard.less b/components/input-item/style/custom-keyboard.less index 93a64b58..b4ae5b3f 100644 --- a/components/input-item/style/custom-keyboard.less +++ b/components/input-item/style/custom-keyboard.less @@ -1,7 +1,6 @@ @import '../../style/themes/default'; @import '../../style/mixins'; - @listPrefixCls: am-list; @inputPrefixCls: am-input; @keyboardPrefixCls: am-number-keyboard; @@ -80,7 +79,6 @@ left: 0; right: 0; width: 100%; - height: 200 * @hd; z-index: 10000; font-family: 'PingFang SC'; background-color: #f6f6f7; @@ -163,4 +161,4 @@ to { opacity: 1; } -} \ No newline at end of file +} diff --git a/components/input-item/style/index.less b/components/input-item/style/index.less index 8a049390..c444d252 100755 --- a/components/input-item/style/index.less +++ b/components/input-item/style/index.less @@ -2,7 +2,6 @@ @import '../../style/mixins'; @import './custom-keyboard'; -@import './input-item'; @listPrefixCls: am-list; @inputPrefixCls: am-input; @@ -141,4 +140,16 @@ color: @color-text-disabled; } } -} \ No newline at end of file +} + +.sr-only { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + white-space: nowrap; + border: 0; +} diff --git a/components/input-item/style/input-item.less b/components/input-item/style/input-item.less deleted file mode 100644 index df300c86..00000000 --- a/components/input-item/style/input-item.less +++ /dev/null @@ -1,47 +0,0 @@ -.am-list-item.am-list-item-middle .am-list-line { - -webkit-box-align: center; - -webkit-align-items: center; - -ms-flex-align: center; - align-items: center; -} - -.am-list-item .am-list-line { - position: relative; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-flex: 1; - -webkit-flex: 1; - -ms-flex: 1; - flex: 1; - -webkit-align-self: stretch; - -ms-flex-item-align: stretch; - align-self: stretch; - padding-right: 15px; - overflow: hidden; -} - -.am-list-item.am-input-item { - height: 44px; - padding-left: 15px; -} - -.am-list-item { - position: relative; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - padding-left: 15px; - min-height: 44px; - background-color: #fff; - vertical-align: middle; - overflow: hidden; - -webkit-transition: background-color 200ms; - transition: background-color 200ms; - -webkit-box-align: center; - -webkit-align-items: center; - -ms-flex-align: center; - align-items: center; -} diff --git a/components/list/style/index.less b/components/list/style/index.less index f874f9e8..28ab4759 100644 --- a/components/list/style/index.less +++ b/components/list/style/index.less @@ -24,7 +24,7 @@ .hairline('top'); .hairline('bottom'); - :not(:last-child) { + div:not(:last-child) { .@{listPrefixCls}-line { .hairline('bottom'); } @@ -96,7 +96,7 @@ } &.@{listPrefixCls}-item-active { - background-color: @fill-tap!important; + background-color: @fill-tap; } &&-disabled { diff --git a/components/menu/style/addon.less b/components/menu/style/addon.less index 8697a837..54384baf 100644 --- a/components/menu/style/addon.less +++ b/components/menu/style/addon.less @@ -1,3 +1,16 @@ +@menuPrefixCls: am-menu; +@MenuSelectContanerPrefixCls: am-menu-select-container; + menu,nzm-menu { display: block; } + +submenu { + display: block; +} + +.@{menuPrefixCls} { + .@{MenuSelectContanerPrefixCls} { + flex: 1 + } +} \ No newline at end of file diff --git a/components/menu/style/index.less b/components/menu/style/index.less index 104eba0d..f7f428bf 100755 --- a/components/menu/style/index.less +++ b/components/menu/style/index.less @@ -1,9 +1,6 @@ @import '../../style/mixins'; @import '../../style/themes/default'; -submenu { - display: block; -} @menuPrefixCls: am-menu; @subMenuPrefixCls: am-sub-menu; @MenuSelectContanerPrefixCls: am-menu-select-container; @@ -17,7 +14,8 @@ submenu { background-color: @fill-body; .@{MenuSelectContanerPrefixCls} { - flex:1; + flex-grow: 2; + .@{MenuSelectContanerPrefixCls}-submenu { align-self: stretch; } diff --git a/components/modal/style/Dialog.less b/components/modal/style/Dialog.less index 6c4f6e05..134b1b44 100755 --- a/components/modal/style/Dialog.less +++ b/components/modal/style/Dialog.less @@ -34,6 +34,8 @@ display: flex; align-items: center; justify-content: center; + // fixed a layer issue with animated Tabs in the x5 kernel browser + transform: translateZ(1px); &-popup { display: block; } diff --git a/components/modal/style/index.less b/components/modal/style/index.less index 62341b78..fcade450 100755 --- a/components/modal/style/index.less +++ b/components/modal/style/index.less @@ -4,7 +4,6 @@ @modalPrefixClass: am-modal; @import './Dialog.less'; -@import './addon.less'; .@{modalPrefixClass} { .button-common() { @@ -73,7 +72,6 @@ height: 34 * @hd; top: 1PX; box-sizing: border-box; // maybe not need it ? - color: initial; margin: 0; &::placeholder { diff --git a/components/notice-bar/style/addon.less b/components/notice-bar/style/addon.less index fefd1021..9814cbe0 100644 --- a/components/notice-bar/style/addon.less +++ b/components/notice-bar/style/addon.less @@ -1,3 +1,5 @@ +@import '../../style/themes/default'; + noticebar { display: block; } @@ -9,3 +11,84 @@ noticebar { noticebar icon { display: flex; } +.notice-bar-card { + top: 0; + left: 0; + right: 0; + width: 100%; + z-index: 989; + display: block; + backface-visibility: hidden; + transform: translate3d(0, 0, 0); + -webkit-overflow-scrolling: touch; + +} + +.marquee-tips { + text-align: left; + width: 100%; + margin: 0 auto; + overflow: hidden; + white-space: nowrap; + box-sizing: border-box; +} + +.nz-yellow-bar-bg { + width: 100%; + height: 30px; + background: transparent; +} + +.close { + // position: fixed; + // top: 0; + right: 0; + z-index: 990; + font-size: 15px; + color: #999999; + background: #fff9ec; + padding: 4.5px; +} + +.marquee { + height: 30px; + // font-size: 14px; + overflow: hidden; + display: block; + line-height: 30px; + top: 0; + left: 0; + right: 0; + z-index: 899; + color: @notice-bar-color; + overflow-x: auto; + touch-action: none; + +} + +.marquee div { + display: block; + position: absolute; + overflow: hidden; +} + +.marquee div.scrolling { + // animation: 15s noticebarmarquee 2s linear infinite; + // animation-iteration-count: infinite; + animation-name: noticebarmarquee; + animation-delay: 2s; + animation-timing-function: linear; + animation-duration: 15s; + animation-fill-mode: forwards; +} + +.marquee div.scrolling-stop { + animation: 15s noticebarmarquee 2s linear infinite; + animation-play-state: paused; +} + +.marquee span { + float: left; + width: 50%; + white-space: nowrap; +} diff --git a/components/notice-bar/style/index.less b/components/notice-bar/style/index.less index 2a6795f7..354028a4 100755 --- a/components/notice-bar/style/index.less +++ b/components/notice-bar/style/index.less @@ -1,9 +1,9 @@ -@import '../../style/mixins'; @import '../../style/themes/default'; +@import '../../style/mixins/util'; + @noticeBarPrefixCls: am-notice-bar; -@import './notice-bar.less'; -@icon-trips: 'trips'; +@icon-trips: 'trips'; .@{noticeBarPrefixCls} { background-color: @notice-bar-fill; @@ -22,11 +22,10 @@ } &-icon { - padding-left: @h-spacing-lg; + margin-left: @h-spacing-lg; display: flex; align-items: center; - background-color: @notice-bar-fill; - z-index: 1; + .@{noticeBarPrefixCls}-trips { .encoded-svg-background-i(@icon-trips); } @@ -39,8 +38,6 @@ &-operation { display: flex; align-items: center; - background-color: @notice-bar-fill; - z-index: 1; padding-right: @h-spacing-md; } } diff --git a/components/notice-bar/style/notice-bar.less b/components/notice-bar/style/notice-bar.less deleted file mode 100644 index 9a71aa8a..00000000 --- a/components/notice-bar/style/notice-bar.less +++ /dev/null @@ -1,82 +0,0 @@ -@import '../../style/themes/default'; -.notice-bar-card { - top: 0; - left: 0; - right: 0; - width: 100%; - z-index: 989; - display: block; - backface-visibility: hidden; - transform: translate3d(0, 0, 0); - -webkit-overflow-scrolling: touch; - -} - -.marquee-tips { - text-align: left; - width: 100%; - margin: 0 auto; - overflow: hidden; - white-space: nowrap; - box-sizing: border-box; -} - -.nz-yellow-bar-bg { - width: 100%; - height: 30px; - background: transparent; -} - -.close { - // position: fixed; - // top: 0; - right: 0; - z-index: 990; - font-size: 15px; - color: #999999; - background: #fff9ec; - padding: 4.5px; -} - -.marquee { - height: 30px; - // font-size: 14px; - overflow: hidden; - display: block; - line-height: 30px; - top: 0; - left: 0; - right: 0; - z-index: 899; - color: @notice-bar-color; - overflow-x: auto; - touch-action: none; - -} - -.marquee div { - display: block; - position: absolute; - overflow: hidden; -} - -.marquee div.scrolling { - // animation: 15s noticebarmarquee 2s linear infinite; - // animation-iteration-count: infinite; - animation-name: noticebarmarquee; - animation-delay: 2s; - animation-timing-function: linear; - animation-duration: 15s; - animation-fill-mode: forwards; -} - -.marquee div.scrolling-stop { - animation: 15s noticebarmarquee 2s linear infinite; - animation-play-state: paused; -} - -.marquee span { - float: left; - width: 50%; - white-space: nowrap; -} diff --git a/components/pagination/style/index.less b/components/pagination/style/index.less index c9fcd01b..c6e41875 100644 --- a/components/pagination/style/index.less +++ b/components/pagination/style/index.less @@ -1,4 +1,5 @@ @import '../../style/themes/default'; + @paginationPrefixCls: am-pagination; .@{paginationPrefixCls} { diff --git a/components/picker/style/index.less b/components/picker/style/index.less index 15081bc3..c3a41f8b 100644 --- a/components/picker/style/index.less +++ b/components/picker/style/index.less @@ -10,19 +10,19 @@ position: fixed; width: 100%; background-color: @fill-base; - -webkit-transform: translateZ(1px); - transform: translateZ(1px); + padding-bottom: env(safe-area-inset-bottom); &-wrap { position: fixed; overflow: auto; - // top: 0; + top: 0; right: 0; bottom: 0; left: 0; z-index: @picker-zindex; -webkit-overflow-scrolling: touch; outline: 0; + transform: translateZ(1px); } &-mask { @@ -34,6 +34,7 @@ background-color: @fill-mask; height: 100%; z-index: @picker-zindex; + transform: translateZ(1px); &-hidden { display: none; diff --git a/components/popover/style/addon.less b/components/popover/style/addon.less new file mode 100644 index 00000000..ea6497b3 --- /dev/null +++ b/components/popover/style/addon.less @@ -0,0 +1,3 @@ +popoveritem { + display: block; +} \ No newline at end of file diff --git a/components/popover/style/index.less b/components/popover/style/index.less index fe508368..4f14b5ff 100755 --- a/components/popover/style/index.less +++ b/components/popover/style/index.less @@ -1,11 +1,10 @@ +@import '../../style/themes/default'; +@import '../../style/mixins'; + @popoverPrefixCls: am-popover; @import './base'; -popoveritem { - display: block; -} - .@{popoverPrefixCls}-inner { font-size: @font-size-subhead; color: @color-text-base; diff --git a/components/pull-to-refresh/style/index.less b/components/pull-to-refresh/style/index.less index a6562ecc..9f62681d 100644 --- a/components/pull-to-refresh/style/index.less +++ b/components/pull-to-refresh/style/index.less @@ -1,4 +1,3 @@ - @import '../../style/themes/default'; @pull-to-refresh: am-pull-to-refresh; @@ -18,7 +17,6 @@ color: grey; text-align: center; height: 25 * @hd; - line-height: 25 * @hd; } &-down .@{pull-to-refresh}-header-indicator { @@ -28,4 +26,4 @@ &-up .@{pull-to-refresh}-footer-indicator { margin-bottom: -25 * @hd; } -} \ No newline at end of file +} diff --git a/components/range/style/index.less b/components/range/style/index.less index dbe469af..0ad5fb63 100644 --- a/components/range/style/index.less +++ b/components/range/style/index.less @@ -1,2 +1 @@ @import '../../slider/style/index.less'; - diff --git a/components/search-bar/style/index.less b/components/search-bar/style/index.less index d7f28484..355b7bff 100644 --- a/components/search-bar/style/index.less +++ b/components/search-bar/style/index.less @@ -31,6 +31,7 @@ } .@{searchPrefixCls}-synthetic-ph { + box-sizing: content-box; z-index: 1; height: @search-bar-input-height; line-height: @search-bar-input-height; @@ -83,6 +84,7 @@ } .@{searchPrefixCls}-clear { + box-sizing: content-box; position: absolute; display: none; z-index: 3; @@ -140,6 +142,7 @@ color: transparent; } } + .@{searchPrefixCls}-synthetic-ph { padding-left: @h-spacing-lg; width: auto; diff --git a/components/slider/style/index.less b/components/slider/style/index.less index b4ba0de3..578f0457 100755 --- a/components/slider/style/index.less +++ b/components/slider/style/index.less @@ -68,7 +68,7 @@ &-step { position: absolute; width: 100%; - height: 2 * @hd; + height: 4 * @hd; background: transparent; } diff --git a/components/stepper/style/index.less b/components/stepper/style/index.less index 7ba99c4a..c08ac027 100644 --- a/components/stepper/style/index.less +++ b/components/stepper/style/index.less @@ -1,5 +1,5 @@ -@import '../../style/mixins'; @import '../../style/themes/default'; +@import '../../style/mixins'; @stepperPrefixCls: am-stepper; diff --git a/components/steps/style/custom-icon.less b/components/steps/style/custom-icon.less index e526db88..512d9364 100644 --- a/components/steps/style/custom-icon.less +++ b/components/steps/style/custom-icon.less @@ -1,8 +1,8 @@ -@import './variables'; +@import 'variables'; .@{stepsPrefixCls}-item-custom { .@{stepsPrefixCls}-item-icon { - background: none !important; + background: none; border: 0; width: auto; height: auto; @@ -18,4 +18,4 @@ color: @brand-primary; } } -} \ No newline at end of file +} diff --git a/components/steps/style/index.less b/components/steps/style/index.less index e13f8510..ad935f18 100644 --- a/components/steps/style/index.less +++ b/components/steps/style/index.less @@ -1,6 +1,6 @@ @import '../../style/mixins'; @import '../../style/themes/default'; -@import './variables'; +@import 'variables'; @stepsPrefixCls: am-steps; @@ -108,11 +108,11 @@ .step-item-status(finish); .step-item-status(error); - & .@{stepsPrefixCls}-next-error .@{stepsPrefixCls}-item-title:after { + &.@{stepsPrefixCls}-next-error .@{stepsPrefixCls}-item-title:after { background: @brand-error; } - & .@{errorTailCls} .@{stepsPrefixCls}-item-tail:after { + &.@{errorTailCls} .@{stepsPrefixCls}-item-tail:after { background-color: @brand-error; } } @@ -161,7 +161,7 @@ } } -@import './custom-icon'; -@import './vertical'; -@import './small'; -@import './label-placement'; \ No newline at end of file +@import 'custom-icon'; +@import 'small'; +@import 'vertical'; +@import 'label-placement'; diff --git a/components/steps/style/label-placement.less b/components/steps/style/label-placement.less index 40be05d0..9384e1b2 100644 --- a/components/steps/style/label-placement.less +++ b/components/steps/style/label-placement.less @@ -1,10 +1,10 @@ -@import './variables'; +@import 'variables'; .@{stepsPrefixCls}-label-vertical { .@{stepsPrefixCls}-item { overflow: visible; &-tail { - padding: 0 24 * @hd !important; + padding: 0 24 * @hd; margin-left: 48 * @hd; } &-content { diff --git a/components/steps/style/small.less b/components/steps/style/small.less index 382186aa..e0c753cb 100644 --- a/components/steps/style/small.less +++ b/components/steps/style/small.less @@ -1,4 +1,4 @@ -@import './variables'; +@import 'variables'; .@{stepsPrefixCls}-small { .@{stepsPrefixCls}-item-icon { @@ -26,7 +26,7 @@ } .@{stepsPrefixCls}-item-description { font-size: @font-size-caption-sm; - color: @color-text-placeholder!important; + color: @color-text-placeholder; } .@{stepsPrefixCls}-item-tail { top: 8 * @hd; diff --git a/components/steps/style/vertical.less b/components/steps/style/vertical.less index 8c50b782..4ab5afc0 100644 --- a/components/steps/style/vertical.less +++ b/components/steps/style/vertical.less @@ -1,4 +1,4 @@ -@import './variables'; +@import 'variables'; .@{stepsPrefixCls}-vertical { display: block; diff --git a/components/style/mixins/icon.less b/components/style/mixins/icon.less index bffc79d0..6607156c 100644 --- a/components/style/mixins/icon.less +++ b/components/style/mixins/icon.less @@ -3,61 +3,61 @@ @svg-bg-img: ''; .encoded-svg-background(@svg) when (@svg = 'image_picker_delete') { - @svg-bg-img: ""; + @svg-bg-img: ""; .encoded-svg-background-i(@svg-bg-img); } .encoded-svg-background(@svg) when (@svg = 'input_item_delete') { - @svg-bg-img: ""; + @svg-bg-img: ""; .encoded-svg-background-i(@svg-bg-img); } .encoded-svg-background(@svg) when (@svg = 'input_item_kb_backspace') { - @svg-bg-img: ''; + @svg-bg-img: ''; .encoded-svg-background-i(@svg-bg-img); } .encoded-svg-background(@svg) when (@svg = 'input_item_kb_hide') { - @svg-bg-img: ''; + @svg-bg-img: ''; .encoded-svg-background-i(@svg-bg-img); } .encoded-svg-background(@svg) when (@svg = 'modal_delete') { - @svg-bg-img: " "; + @svg-bg-img: " "; .encoded-svg-background-i(@svg-bg-img); } .encoded-svg-background(@svg) when (@svg = 'textarea_item_delete') { - @svg-bg-img: ""; + @svg-bg-img: ""; .encoded-svg-background-i(@svg-bg-img); } .encoded-svg-background(@svg) when (@svg = 'right') { - @svg-bg-img: ''; + @svg-bg-img: ''; .encoded-svg-background-i(@svg-bg-img); } .encoded-svg-background(@svg) when (@svg = 'error') { - @svg-bg-img: ""; + @svg-bg-img: ""; .encoded-svg-background-i(@svg-bg-img); } .encoded-svg-background(@svg) when (@svg = 'loading') { - @svg-bg-img: ''; + @svg-bg-img: ''; .encoded-svg-background-i(@svg-bg-img); } .encoded-svg-background(@svg) when (@svg = 'search_bar_search') { - @svg-bg-img: ""; + @svg-bg-img: ""; .encoded-svg-background-i(@svg-bg-img); } .encoded-svg-background(@svg) when (@svg = 'search_bar_clear') { - @svg-bg-img: ""; + @svg-bg-img: ""; .encoded-svg-background-i(@svg-bg-img); } .encoded-svg-background(@svg) when (@svg = 'search_bar_clear_active') { - @svg-bg-img: ""; + @svg-bg-img: ""; .encoded-svg-background-i(@svg-bg-img); } diff --git a/components/textarea-item/style/index.less b/components/textarea-item/style/index.less index b553e19a..ac2a48c6 100644 --- a/components/textarea-item/style/index.less +++ b/components/textarea-item/style/index.less @@ -97,7 +97,7 @@ overflow: visible; display: block; resize: none; - word-break: break-all; + word-break: break-word; word-wrap: break-word; &::placeholder { @@ -175,4 +175,12 @@ } } - +.@{listPrefixCls} { + &-body { + .@{listPrefixCls}-item { + &:last-child { + .hairline-remove('bottom'); + } + } + } +} diff --git a/components/toast/style/index.less b/components/toast/style/index.less index 5aa8b213..03958a05 100755 --- a/components/toast/style/index.less +++ b/components/toast/style/index.less @@ -21,6 +21,7 @@ align-items: center; left: 0; top: 0; + transform: translateZ(1px); } &&-nomask { @@ -29,7 +30,7 @@ width: auto; left: 50%; top: 50%; - + transform: translateZ(1px); .@{toastPrefixCls}-notice { transform: translateX(-50%) translateY(-50%); }