anders/Wallet
1
0
Fork 0
Code Issues Projects Releases Packages Wiki Activity

feat(design): polish address book

Browse source 
Closes #420, closes #376
This commit is contained in:
Jason Dreyzehner 2016-10-13 00:02:06 -04:00
commit 08d49001f1
10 changed files with 116 additions and 126 deletions
Download patch file Download diff file Expand all files Collapse all files

16
src/sass/directives/gravatar.scss
View file

@ -1,18 +1,4 @@
.gravatar {
border-radius: 50%;
}
.gravatar-content {
position: relative;
height: 70px;
border-color: #172565;
background-color: #1e3186;
background-image: linear-gradient(0deg, #172565, #172565 0%, transparent 0%);
color: #fff;
margin-bottom: 50px;
.gravatar {
position: absolute;
bottom: -30px;
left: 41%;
}
display: inline-block;
}

18
src/sass/ionic.scss
View file

@ -15,19 +15,6 @@ ion-tabs.ion-tabs-transparent {
background: none transparent;
}
// Some overrides for the card class which can't be set by variable
.card, .list {
.icon {
color: $light-gray;
}
& > .item-heading {
font-weight: 700;
.icon {
color: $mid-gray;
}
}
}
// .placeholder-icon padding cannot be modified by a variable
$placeholder-icon-padding: 10px;
.placeholder-icon {
@ -38,3 +25,8 @@ $placeholder-icon-padding: 10px;
padding-left: $placeholder-icon-padding;
}
}
// .item-input-wrapper background cannot be modified by a variable
.item-input-wrapper {
background: none transparent;
}

37
src/sass/variables.scss
View file

@ -2,7 +2,7 @@
$royal: #1e3186;
$soft-blue: #647ce8;
$fill-blue: #D5DFFF;
$subtle-gray: #f7f7f7;
$subtle-gray: darken(#fff, 5%);
$roboto: "Roboto", sans-serif;
$roboto-light: "Roboto-Light", sans-serif-light;
$success-green: #17ae8c;
@ -18,21 +18,34 @@ $unmistakable-radius: 12px;
/* Set ionic variables */
$positive: $soft-blue;
$positive: $soft-blue;
$font-size-base: 16px;
$font-size-small: 12px;
$font-family-sans-serif: $roboto;
$font-family-light-sans-serif: $roboto-light;
$font-size-base: 16px;
$font-size-small: 12px;
$font-family-sans-serif: $roboto;
$font-family-light-sans-serif: $roboto-light;
$button-border-radius: $visible-radius;
$button-height: 52px;
$button-padding: 16px;
$button-border-radius: $visible-radius;
$button-height: 52px;
$button-padding: 16px;
$base-background-color: $subtle-gray;
$base-background-color: $subtle-gray;
$item-default-active-bg: $subtle-gray;
$item-icon-font-size: 24px;
$item-default-active-bg: $subtle-gray;
$item-icon-font-size: 24px;
$input-color: $dark-gray;
$input-border: $light-gray;
$input-label-color: $mid-gray;
$input-color-placeholder: lighten($dark-gray, 40%);
$item-default-bg: #ffffff;
$item-default-border: $subtle-gray;
$item-default-text: $dark-gray;
$item-default-active-bg: darken(#ffffff, 7%);
$item-default-active-border: darken($subtle-gray, 7%);
$bar-default-border: $subtle-gray;
$tabs-icon-size: 22px;

45
src/sass/views/address-book.scss
View file

@ -1,22 +1,15 @@
#add-address{
.list{
background: #ffffff;
#add-address {
.zero-state-cta {
padding-bottom: 3vh;
}
.list {
background-color: #fff;
}
}
#view-address-book {
.scroll{
.scroll {
height:100%;
}
#add-contact{
min-width: 300px;
img{
width: 10rem;
display: inline-block;
}
a{
text-decoration: none;
}
}
.list {
.item {
color: #444;
@ -67,4 +60,26 @@
}
}
}
}
}
#address-book-view {
.bar.bar-royal {
border: 0 transparent;
}
.gravatar-content {
position: relative;
height: 70px;
border-color: $royal;
background-color: $royal;
padding-top: 20px;
margin-bottom: 50px;
text-align: center;
}
.address-book-field-label {
text-transform: uppercase;
font-weight: bold;
font-size: 12px;
display: block;
color: $mid-gray;
}
}

14
src/sass/views/tabs.scss
View file

@ -35,3 +35,17 @@
}
}
}
#tab-home, #tab-send {
.card, .list {
.icon {
color: $light-gray;
}
& > .item-heading {
font-weight: 700;
.icon {
color: $mid-gray;
}
}
}
}

1
src/sass/views/views.scss
View file

@ -14,7 +14,6 @@
@import "bitpayCard";
@import "address-book";
@import "wallet-backup-phrase";
@import "address-book";
@import "zero-state";
@import "onboarding/onboarding";
@import "includes/walletActivity";