From 2c3bf07d39cf8930104e6744bd6fa396edbfef4b Mon Sep 17 00:00:00 2001 From: afc163 Date: Tue, 8 Dec 2015 22:08:21 +0800 Subject: [PATCH] improve selected item style, close #467 --- style/components/dropdown.less | 6 ++-- style/components/pagination.less | 1 - style/components/select.less | 43 +++++++------------------ style/components/table.less | 5 ++- style/components/timepicker/Select.less | 11 +++---- 5 files changed, 21 insertions(+), 45 deletions(-) diff --git a/style/components/dropdown.less b/style/components/dropdown.less index d03e6e51d9..3aab30681a 100644 --- a/style/components/dropdown.less +++ b/style/components/dropdown.less @@ -54,7 +54,7 @@ } & > &-item { - padding: 7px 16px; + padding: 7px 15px; clear: both; font-size: 12px; font-weight: normal; @@ -66,8 +66,8 @@ > a { color: #666; display: block; - padding: 7px 16px; - margin: -7px -16px; + padding: 7px 15px; + margin: -7px -15px; } &:hover { diff --git a/style/components/pagination.less b/style/components/pagination.less index f3c5e3fb3f..6dc31110cb 100644 --- a/style/components/pagination.less +++ b/style/components/pagination.less @@ -181,7 +181,6 @@ margin-left: 15px; &-size-changer { float: left; - width: 90px; margin-right: 10px; } diff --git a/style/components/select.less b/style/components/select.less index 48d49243db..66ba49bf38 100644 --- a/style/components/select.less +++ b/style/components/select.less @@ -10,23 +10,6 @@ font-weight: bold; } -.selected_icon() { - position: relative; - &:after { - .iconfont-size-under-12px(9px); - display: inline-block; - content: '\e62e'; - font-family: 'anticon'; - font-weight: bold; - position: absolute; - top: 7px; - right: -1px; - padding-right: 14px; - color: @primary-color; - transform: scale(0.75); - } -} - .@{select-prefix-cls} { box-sizing: border-box; display: inline-block; @@ -356,18 +339,6 @@ animation-name: antSlideDownOut; } - &-menu-item { - transition: background 0.3s ease; - } - - &--single &-menu-item-selected { - .selected_icon(); - } - - &--multiple &-menu-item-selected { - .selected_icon(); - } - &-hidden { display: none; } @@ -405,18 +376,19 @@ &-item-group-title { color: #999; line-height: 1.5; - padding: 8px 16px; + padding: 8px 15px; } &-item { position: relative; display: block; - padding: 7px 33px 7px 16px; + padding: 7px 15px; font-weight: normal; color: #666; white-space: nowrap; cursor: pointer; overflow: hidden; + transition: background 0.3s ease; &:first-child { border-top-left-radius: 4px; @@ -428,7 +400,14 @@ } &:hover, &-active { - background-color: tint(@primary-color, 90%) !important; + background-color: tint(@primary-color, 90%); + } + + &-selected { + background-color: tint(@primary-color, 80%); + &:hover { + background-color: tint(@primary-color, 80%); + } } &-disabled { diff --git a/style/components/table.less b/style/components/table.less index 19d0f17c65..937fa03747 100644 --- a/style/components/table.less +++ b/style/components/table.less @@ -218,14 +218,13 @@ } .@{table-prefix-cls}-filter-dropdown { - min-width: 88px; + min-width: 96px; margin-left: -8px; .ant-dropdown-menu-item { overflow: hidden; - padding: 7px 8px; } - a&-link { + .ant-dropdown-menu-item a&-link { color: @link-color; &:hover { color: @link-hover-color; diff --git a/style/components/timepicker/Select.less b/style/components/timepicker/Select.less index 819e8d29ea..09593de8fc 100644 --- a/style/components/timepicker/Select.less +++ b/style/components/timepicker/Select.less @@ -41,15 +41,14 @@ text-align: left; cursor: pointer; user-select: none; - - &.@{timepicker-prefix-cls}-panel-select-option-selected { - background: tint(@primary-color, 90%); - color: @link-color; - } + transition: background 0.3s ease; &:hover { background: tint(@primary-color, 90%); - transition: background 0.3s ease; + } + + &.@{timepicker-prefix-cls}-panel-select-option-selected { + background: tint(@primary-color, 80%); } } }