diff --git a/public/font/icomoon.eot b/public/font/icomoon.eot index ea89aefc8..6b13799c9 100755 Binary files a/public/font/icomoon.eot and b/public/font/icomoon.eot differ diff --git a/public/font/icomoon.svg b/public/font/icomoon.svg index f606d1228..ecf19807f 100755 --- a/public/font/icomoon.svg +++ b/public/font/icomoon.svg @@ -44,7 +44,6 @@ - @@ -56,6 +55,33 @@ - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/public/font/icomoon.ttf b/public/font/icomoon.ttf index a51f9534f..73eb399a5 100755 Binary files a/public/font/icomoon.ttf and b/public/font/icomoon.ttf differ diff --git a/public/font/icomoon.woff b/public/font/icomoon.woff index 245368ecb..bafa16ab0 100755 Binary files a/public/font/icomoon.woff and b/public/font/icomoon.woff differ diff --git a/public/img/icon-activity.svg b/public/img/icon-activity.svg new file mode 100644 index 000000000..b24b17075 --- /dev/null +++ b/public/img/icon-activity.svg @@ -0,0 +1,12 @@ + + + + downloadbox + Created with Sketch. + + + + + + + \ No newline at end of file diff --git a/src/css/icons.css b/src/css/icons.css index 96c803836..0d14f1b6f 100644 --- a/src/css/icons.css +++ b/src/css/icons.css @@ -24,62 +24,133 @@ -moz-osx-font-smoothing: grayscale; } -.icon-sell-btc:before { - content: "\e632"; +.icon-activity:before { + content: "\e900"; } -.icon-buy-btc:before { +.icon-receive:before { + content: "\e901"; +} +.icon-sold .path1:before { content: "\e631"; + color: rgb(255, 255, 255); } -.icon-erase:before { - content: "\e628"; +.icon-sold .path2:before { + content: "\e632"; + margin-left: -1.0537109375em; + color: rgb(246, 166, 35); } -.icon-receive2:before { - content: "\e62f"; +.icon-sold .path3:before { + content: "\e633"; + margin-left: -1.0537109375em; + color: rgb(246, 166, 35); } -.icon-arrow-left:before { - content: "\e600"; +.icon-sold .path4:before { + content: "\e634"; + margin-left: -1.0537109375em; + color: rgb(44, 62, 80); } -.icon-arrow-down:before { - content: "\e601"; +.icon-sold .path5:before { + content: "\e635"; + margin-left: -1.0537109375em; + color: rgb(255, 255, 255); } -.icon-arrow-up:before { - content: "\e602"; +.icon-sold .path6:before { + content: "\e636"; + margin-left: -1.0537109375em; + color: rgb(255, 255, 255); } -.icon-arrow-right:before { - content: "\e603"; +.icon-bought .path1:before { + content: "\e637"; + color: rgb(255, 255, 255); } -.icon-arrow-left2:before { - content: "\e604"; +.icon-bought .path2:before { + content: "\e638"; + margin-left: -1.0537109375em; + color: rgb(26, 188, 156); } -.icon-arrow-down2:before { - content: "\e605"; +.icon-bought .path3:before { + content: "\e639"; + margin-left: -1.0537109375em; + color: rgb(26, 188, 156); } -.icon-arrow-up2:before { - content: "\e606"; +.icon-bought .path4:before { + content: "\e63a"; + margin-left: -1.0537109375em; + color: rgb(44, 62, 80); } -.icon-arrow-right2:before { - content: "\e607"; +.icon-bought .path5:before { + content: "\e63b"; + margin-left: -1.0537109375em; + color: rgb(255, 255, 255); } -.icon-arrow-left3:before { - content: "\e608"; +.icon-bought .path6:before { + content: "\e63c"; + margin-left: -1.0537109375em; + color: rgb(255, 255, 255); } -.icon-arrow-down3:before { - content: "\e609"; +.icon-sold-pending:before { + content: "\e63d"; } -.icon-arrow-up3:before { - content: "\e60a"; +.icon-bought-pending:before { + content: "\e63e"; } -.icon-arrow-right3:before { - content: "\e60b"; +.icon-sell-bitcoin .path1:before { + content: "\e63f"; + color: rgb(44, 62, 80); } -.icon-arrow-left4:before { - content: "\e60c"; +.icon-sell-bitcoin .path2:before { + content: "\e640"; + margin-left: -1.2119140625em; + color: rgb(44, 62, 80); } -.icon-arrow-down4:before { - content: "\e60d"; +.icon-sell-bitcoin .path3:before { + content: "\e641"; + margin-left: -1.2119140625em; + color: rgb(44, 62, 80); } -.icon-arrow-up4:before { - content: "\e60e"; +.icon-sell-bitcoin .path4:before { + content: "\e642"; + margin-left: -1.2119140625em; + color: rgb(246, 166, 35); +} +.icon-sell-bitcoin .path5:before { + content: "\e643"; + margin-left: -1.2119140625em; + color: rgb(255, 255, 255); +} +.icon-sell-bitcoin .path6:before { + content: "\e644"; + margin-left: -1.2119140625em; + color: rgb(255, 255, 255); +} +.icon-buy-bitcoin .path1:before { + content: "\e645"; + color: rgb(44, 62, 80); +} +.icon-buy-bitcoin .path2:before { + content: "\e646"; + margin-left: -1.2119140625em; + color: rgb(44, 62, 80); +} +.icon-buy-bitcoin .path3:before { + content: "\e647"; + margin-left: -1.2119140625em; + color: rgb(44, 62, 80); +} +.icon-buy-bitcoin .path4:before { + content: "\e648"; + margin-left: -1.2119140625em; + color: rgb(26, 188, 156); +} +.icon-buy-bitcoin .path5:before { + content: "\e649"; + margin-left: -1.2119140625em; + color: rgb(255, 255, 255); +} +.icon-buy-bitcoin .path6:before { + content: "\e64a"; + margin-left: -1.2119140625em; + color: rgb(255, 255, 255); } .icon-bank:before { content: "\e630"; @@ -102,11 +173,8 @@ .icon-circle-active:before { content: "\e627"; } -.icon-circle-active:before { - content: "\e627"; -} -.icon-scan:before { - content: "\e62a"; +.icon-send:before { + content: "\e902"; } .icon-trash:before { content: "\e626"; @@ -123,9 +191,6 @@ .icon-bell:before { content: "\e61c"; } -.icon-receive:before { - content: "\e625"; -} .icon-wrench:before { content: "\e61d"; } @@ -180,3 +245,60 @@ .icon-usd:before { content: "\e616"; } +.icon-scan:before { + content: "\e62a"; +} +.icon-scan:before { + content: "\e62a"; +} +.icon-erase:before { + content: "\e628"; +} +.icon-receive2:before { + content: "\e62f"; +} +.icon-arrow-left:before { + content: "\e600"; +} +.icon-arrow-down:before { + content: "\e601"; +} +.icon-arrow-up:before { + content: "\e602"; +} +.icon-arrow-right:before { + content: "\e603"; +} +.icon-arrow-left2:before { + content: "\e604"; +} +.icon-arrow-down2:before { + content: "\e605"; +} +.icon-arrow-up2:before { + content: "\e606"; +} +.icon-arrow-right2:before { + content: "\e607"; +} +.icon-arrow-left3:before { + content: "\e608"; +} +.icon-arrow-down3:before { + content: "\e609"; +} +.icon-arrow-up3:before { + content: "\e60a"; +} +.icon-arrow-right3:before { + content: "\e60b"; +} +.icon-arrow-left4:before { + content: "\e60c"; +} +.icon-arrow-down4:before { + content: "\e60d"; +} +.icon-arrow-up4:before { + content: "\e60e"; +} diff --git a/src/css/mobile.css b/src/css/mobile.css index 68c5635dd..5954c7804 100644 --- a/src/css/mobile.css +++ b/src/css/mobile.css @@ -173,8 +173,8 @@ _:-ms-fullscreen, :root .main { } .menu-activity { - background-image: linear-gradient(-180deg, #F1F3F5 0%, #FFFFFF 40%); - box-shadow: 0px -1px 0px 0px rgba(165,178,191,0.35); + background-image: linear-gradient(-180deg, #F1F3F5 0%, #FFFFFF 30%); + box-shadow: 0px -1px 0px 0px rgba(165,178,191,0.30); width: 100%; height: 8rem; position: absolute; @@ -188,7 +188,7 @@ _:-ms-fullscreen, :root .main { } .icon-activity { - font-size: 28px; + font-size: 30px; position: absolute; display: block; left: 0; diff --git a/src/js/controllers/index.js b/src/js/controllers/index.js index b895712d0..b76baf3b7 100644 --- a/src/js/controllers/index.js +++ b/src/js/controllers/index.js @@ -21,15 +21,15 @@ angular.module('copayApp.controllers').controller('indexController', function($r self.menu = [{ 'title': gettext('Receive'), - 'icon': 'icon-receive2', + 'icon': 'icon-receive', 'link': 'receive' }, { 'title': gettext('Home'), - 'icon': 'icon-home', + 'icon': 'icon-activity', 'link': 'walletHome' }, { 'title': gettext('Send'), - 'icon': 'icon-paperplane', + 'icon': 'icon-send', 'link': 'send' }];