diff --git a/examples/routers/select.vue b/examples/routers/select.vue index d311f93..cb285c8 100644 --- a/examples/routers/select.vue +++ b/examples/routers/select.vue @@ -293,377 +293,447 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - diff --git a/src/styles/components/select.less b/src/styles/components/select.less index ceebe02..4e2f4d2 100644 --- a/src/styles/components/select.less +++ b/src/styles/components/select.less @@ -96,6 +96,24 @@ } } + &-multiple &-selection{ + padding: 0 24px 0 4px; + //min-height: @input-height-base; + + .@{select-prefix-cls}-placeholder{ + display: block; + height: @input-height-base - 2px; + line-height: @input-height-base - 2px; + color: @input-placeholder-color; + font-size: @font-size-small; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + padding-left: 4px; + padding-right: 22px; + } + } + &-large&-single &-selection{ height: @input-height-large; @@ -106,6 +124,16 @@ } } + &-large&-multiple &-selection{ + min-height: @input-height-large; + + .@{select-prefix-cls}-placeholder, .@{select-prefix-cls}-selected-value{ + min-height: @input-height-large - 2px; + line-height: @input-height-large - 2px; + font-size: @font-size-base; + } + } + &-small&-single &-selection{ height: @input-height-small; border-radius: @btn-border-radius-small; @@ -116,21 +144,14 @@ } } - &-multiple &-selection{ - padding: 0 24px 0 4px; - min-height: @input-height-base; + &-small&-multiple &-selection{ + min-height: @input-height-small; + border-radius: @btn-border-radius-small; - .@{select-prefix-cls}-placeholder{ - display: block; - height: @input-height-base - 2px; - line-height: @input-height-base - 2px; - color: @input-placeholder-color; - font-size: @font-size-small; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - padding-left: 4px; - padding-right: 22px; + .@{select-prefix-cls}-placeholder, .@{select-prefix-cls}-selected-value{ + height: auto; + min-height: @input-height-small - 2px; + line-height: @input-height-small - 2px; } } @@ -189,6 +210,22 @@ } &-multiple .@{css-prefix}tag{ + height: 24px; + line-height: 22px; + margin: 3px 4px 3px 0; + } + + &-large&-multiple .@{css-prefix}tag{ + height: 28px; + line-height: 26px; + font-size: @font-size-base; + } + + &-small&-multiple .@{css-prefix}tag{ + height: 17px; + line-height: 15px; + font-size: @font-size-small; + padding: 0 6px; margin: 3px 4px 2px 0; } -- libgit2 0.21.4