From 9984f9e922d7c1e3c72f7dc9ddec647a6abd4921 Mon Sep 17 00:00:00 2001 From: Yan Zhu Date: Fri, 15 Apr 2016 19:19:52 +0800 Subject: update chips code --- src/badges.less | 3 +-- src/chips.less | 43 +++++++++++++++++++++++++++++++------------ 2 files changed, 32 insertions(+), 14 deletions(-) (limited to 'src') diff --git a/src/badges.less b/src/badges.less index 265d29b..cd4a70d 100644 --- a/src/badges.less +++ b/src/badges.less @@ -1,8 +1,7 @@ // Badges .badge { position: relative; - - + &::after { content: attr(data-badge); color: #fff; diff --git a/src/chips.less b/src/chips.less index 9530264..9277071 100644 --- a/src/chips.less +++ b/src/chips.less @@ -1,46 +1,58 @@ // Chips .chip { display: flex; - padding: .5rem; + padding: .8rem; border-radius: .3rem; margin: 0; list-style: none; align-items: center; align-content: space-around; - &:hover, - &.selected { - background-color: lighten(@control-color, 20%); - } - .chip-list-icon { flex: 0 0 auto; } .chip-list-content { flex: 1 1 auto; padding: 0 1rem; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; + .text-ellipsis; } .chip-list-action { flex: 0 0 auto; + + .btn { + padding: .7rem .5rem; + border-color: transparent; + color: @control-color; + + &:hover, + &:focus { + color: @core-color; + border-color: transparent; + background-color: transparent; + } + &:active, + &.active { + color: darken(@core-color, 5%); + border-color: transparent; + background-color: transparent; + } + } } } // Small chips .chip-sm { display: inline-flex; - width: auto; + max-width: 100%; height: 2.4rem; padding: .3rem .6rem; border-radius: .3rem; font-size: 1.2rem; - vertical-align: middle; align-items: center; background-color: @core-border-color; border: .1rem solid darken(@core-border-color, 2%); text-decoration: none; + .text-ellipsis; &:hover, &:focus { @@ -76,7 +88,7 @@ line-height: 1.6rem; outline: 0; - .chip { + .chip-sm { margin-bottom: .3rem; } @@ -115,5 +127,12 @@ height: .5rem; border-top: .1rem solid @core-border-color; } + + .chip { + &:hover, + &.selected { + background-color: lighten(@control-color, 20%); + } + } } } \ No newline at end of file -- cgit v1.3.1-26-gb76a