diff options
Diffstat (limited to 'ui/app/css/itcss')
| -rw-r--r-- | ui/app/css/itcss/components/token-list.scss | 13 | ||||
| -rw-r--r-- | ui/app/css/itcss/components/wallet-balance.scss | 10 |
2 files changed, 19 insertions, 4 deletions
diff --git a/ui/app/css/itcss/components/token-list.scss b/ui/app/css/itcss/components/token-list.scss index dd1d533c7..2195dc1b8 100644 --- a/ui/app/css/itcss/components/token-list.scss +++ b/ui/app/css/itcss/components/token-list.scss @@ -1,9 +1,22 @@ +$wallet-balance-breakpoint: 890px; +$wallet-balance-breakpoint-range: "screen and (min-width: #{$break-large}) and (max-width: #{$wallet-balance-breakpoint})"; + .token-list-item { display: flex; flex-flow: row nowrap; align-items: center; padding: 20px 24px; cursor: pointer; + transition: linear 200ms; + background-color: rgba($wallet-balance-bg, 0); + + @media #{$wallet-balance-breakpoint-range} { + padding: 10% 4%; + } + + &--active { + background-color: rgba($wallet-balance-bg, 1); + } &__identicon { margin-right: 15px; diff --git a/ui/app/css/itcss/components/wallet-balance.scss b/ui/app/css/itcss/components/wallet-balance.scss index 113380769..cd44f89bb 100644 --- a/ui/app/css/itcss/components/wallet-balance.scss +++ b/ui/app/css/itcss/components/wallet-balance.scss @@ -4,6 +4,12 @@ $wallet-balance-breakpoint-range: "screen and (min-width: #{$break-large}) and ( .wallet-balance-wrapper { flex: 0 0 auto; + transition: linear 200ms; + background: rgba($wallet-balance-bg, 0); + + &--active { + background: rgba($wallet-balance-bg, 1); + } } .wallet-balance { @@ -62,7 +68,3 @@ $wallet-balance-breakpoint-range: "screen and (min-width: #{$break-large}) and ( border: 1px solid $alto; } } - -.wallet-balance-wrapper-active { - background: $wallet-balance-bg; -} |