diff options
author | Chi Kei Chan <chikeichan@gmail.com> | 2017-10-13 06:46:09 +0800 |
---|---|---|
committer | Chi Kei Chan <chikeichan@gmail.com> | 2017-10-13 06:46:18 +0800 |
commit | 57179d2b05a4efae06c2375e01e9a01a5519543b (patch) | |
tree | cc343761d9a1b550db5fcdd82c1c7992b7f49d32 /ui/app/css/itcss/components/network.scss | |
parent | 7ec77e0b4580c52bbf1723ed52d647c9d7516bd5 (diff) | |
download | tangerine-wallet-browser-57179d2b05a4efae06c2375e01e9a01a5519543b.tar.gz tangerine-wallet-browser-57179d2b05a4efae06c2375e01e9a01a5519543b.tar.zst tangerine-wallet-browser-57179d2b05a4efae06c2375e01e9a01a5519543b.zip |
Various styling fixes
Diffstat (limited to 'ui/app/css/itcss/components/network.scss')
-rw-r--r-- | ui/app/css/itcss/components/network.scss | 77 |
1 files changed, 63 insertions, 14 deletions
diff --git a/ui/app/css/itcss/components/network.scss b/ui/app/css/itcss/components/network.scss index 012b1faf6..bf699ac57 100644 --- a/ui/app/css/itcss/components/network.scss +++ b/ui/app/css/itcss/components/network.scss @@ -1,14 +1,65 @@ +.network-component.pointer { + border: 1px solid $shark; + border-radius: 82px; + padding: 6px; + + &.ethereum-network { + border-color: rgb(3, 135, 137); + + .menu-icon-circle div { + background-color: rgba(3, 135, 137, .7) !important; + } + } + + &.ropsten-test-network { + border-color: rgb(233, 21, 80); + + .menu-icon-circle div { + background-color: rgba(233, 21, 80, .7) !important; + } + } + + &.kovan-test-network { + border-color: rgb(105, 4, 150); + + .menu-icon-circle div { + background-color: rgba(105, 4, 150, .7) !important; + } + } + + &.rinkeby-test-network { + border-color: rgb(235, 179, 63); + + .menu-icon-circle div { + background-color: rgba(235, 179, 63, .7) !important; + } + } +} + +.dropdown-menu-item { + .menu-icon-circle, + .menu-icon-circle--active { + margin: 0 16px; + } +} + .network-indicator { display: flex; align-items: center; font-size: .6em; + + .fa-caret-down { + line-height: 15px; + font-size: 12px; + padding: 0 4px; + } } .network-name { - line-height: 12px; + line-height: 15px; padding: 0 4px; - font-family: 'DIN OT'; - font-size: 10px; + font-family: Roboto; + font-size: 12px; flex: 1 0 auto; } @@ -46,29 +97,27 @@ margin: 0; } -.menu-icon-circle, .menu-icon-circle--active { - height: 23px; - width: 23px; - margin: 9px; +.menu-icon-circle, +.menu-icon-circle--active { background: none; border-radius: 22px; display: flex; justify-content: center; align-items: center; border: 1px solid transparent; - background: none; + margin: 0 4px; } .menu-icon-circle--active { - border: 1px solid white; - background: rgba(100, 100, 100, 0.4); + border: 1px solid $white; + background: rgba(100, 100, 100, .4); } -.menu-icon-circle div, .menu-icon-circle--active div { +.menu-icon-circle div, +.menu-icon-circle--active div { height: 17px; width: 17px; border-radius: 17px; - opacity: 0.7; } .menu-icon-circle--active div { @@ -93,7 +142,7 @@ height: 25px; width: 75px; color: $white; - font-family: 'DIN OT'; + font-family: Roboto; font-size: 18px; line-height: 25px; text-align: center; @@ -103,7 +152,7 @@ height: 36px; width: 265px; color: $dusty-gray; - font-family: 'DIN OT'; + font-family: Roboto; font-size: 14px; line-height: 18px; } |