From f2bad6d9944be1214b025e3c02961d9f119e5ddb Mon Sep 17 00:00:00 2001
From: JDonadio <tanojaja@gmail.com>
Date: Fri, 27 Oct 2017 17:05:46 -0300
Subject: [PATCH] styles - homogenized app components

---
 .gitignore                                    |  2 +-
 .../sass/{overrides.scss => _overrides.scss}  |  6 ++-
 .../sass/{overrides.scss => _overrides.scss}  |  4 +-
 src/app/app.module.ts                         |  8 ++-
 .../add/import-wallet/import-wallet.html      |  4 +-
 src/theme/variables.scss                      | 50 ++++++++++++++++++-
 6 files changed, 66 insertions(+), 8 deletions(-)
 rename app-template/bitpay/sass/{overrides.scss => _overrides.scss} (85%)
 rename app-template/copay/sass/{overrides.scss => _overrides.scss} (89%)

diff --git a/.gitignore b/.gitignore
index 000866d94..d139ebd1c 100644
--- a/.gitignore
+++ b/.gitignore
@@ -28,7 +28,7 @@ src/assets/externalServices.json
 src/assets/img/app
 src/index.html
 src/manifest.json
-src/theme/overrides.scss
+src/theme/_overrides.scss
 
 .sourcemaps/
 .idea/
diff --git a/app-template/bitpay/sass/overrides.scss b/app-template/bitpay/sass/_overrides.scss
similarity index 85%
rename from app-template/bitpay/sass/overrides.scss
rename to app-template/bitpay/sass/_overrides.scss
index 41240bd9a..345a082be 100644
--- a/app-template/bitpay/sass/overrides.scss
+++ b/app-template/bitpay/sass/_overrides.scss
@@ -13,9 +13,11 @@
 $colors: (
   primary:    #1e3186,
   secondary:  #111b49,
-  danger:     #ffa500,
+  accent:     #647ce8,
+  warning:    #EBA133,
+  danger:     #bb331a,
   light:      #f4f4f4,
-  dark:       #222
+  dark:       #222,
 );
 
 $text-color: #1e3186;
diff --git a/app-template/copay/sass/overrides.scss b/app-template/copay/sass/_overrides.scss
similarity index 89%
rename from app-template/copay/sass/overrides.scss
rename to app-template/copay/sass/_overrides.scss
index b9451dc08..b3d1f71e5 100644
--- a/app-template/copay/sass/overrides.scss
+++ b/app-template/copay/sass/_overrides.scss
@@ -13,9 +13,11 @@
 $colors: (
   primary:    #192c3a,
   secondary:  #31465b,
+  accent:     #1abb9b,
+  warning:    #EBA133,
   danger:     #bb331a,
   light:      #f4f4f4,
-  dark:       #222
+  dark:       #222,
 );
 
 $text-color: #192c3a;
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 052d1b84e..404fc41c1 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -178,7 +178,13 @@ export function providersComponents() {
 @NgModule({
   declarations: declarationsComponents(),
   imports: [
-    IonicModule.forRoot(CopayApp, { tabsHideOnSubPages: true }),
+    IonicModule.forRoot(CopayApp, { 
+      tabsHideOnSubPages: true,
+      modalEnter: 'modal-slide-in',
+      modalLeave: 'modal-slide-out',
+      tabsPlacement: 'bottom',
+      pageTransition: 'ios-transition'
+    }),
     BrowserModule,
     HttpModule,
     NgLoggerModule.forRoot(Level.LOG),
diff --git a/src/pages/add/import-wallet/import-wallet.html b/src/pages/add/import-wallet/import-wallet.html
index 95892246f..eb322c135 100644
--- a/src/pages/add/import-wallet/import-wallet.html
+++ b/src/pages/add/import-wallet/import-wallet.html
@@ -5,7 +5,7 @@
 </ion-header>
 
 <ion-content>
-  <ion-segment [(ngModel)]="selectedTab" color="primary" (ionChange)="selectTab(selectedTab)">
+  <ion-segment [(ngModel)]="selectedTab" color="accent" (ionChange)="selectTab(selectedTab)">
     <ion-segment-button value="words" translate>
       Words
     </ion-segment-button>
@@ -53,7 +53,7 @@
 
         <ion-item>
           <ion-label stacked>Testnet</ion-label>
-          <ion-toggle [(ngModel)]="formData.testnet" formControlName="testnet" (ionChange)="setDerivationPath()"></ion-toggle>
+          <ion-toggle [(ngModel)]="formData.testnet" color="accent" formControlName="testnet" (ionChange)="setDerivationPath()"></ion-toggle>
         </ion-item>
       </div>
 
diff --git a/src/theme/variables.scss b/src/theme/variables.scss
index 9c764f53a..486c8deff 100644
--- a/src/theme/variables.scss
+++ b/src/theme/variables.scss
@@ -19,8 +19,56 @@ $app-direction: ltr;
 // To view all the possible Ionic variables, see:
 // http://ionicframework.com/docs/theming/overriding-ionic-variables/
 
-// TODO: Custom variables (backward compatibilities). Will be REMOVED
 
+// Override - Homogenized ionic component styles
+@import 'overrides';
+
+/* filled button */
+$button-ios-background-color: color($colors, accent);
+$button-md-background-color: color($colors, accent);
+$button-wp-background-color: color($colors, accent);
+
+/* outline button */
+$button-ios-outline-text-color: color($colors, accent) !important;
+$button-md-outline-text-color: color($colors, accent) !important;
+$button-wp-outline-text-color: color($colors, accent) !important;
+
+/* pagination bullets */
+.swiper-pagination-bullet-active {
+  background: color($colors, accent) !important;
+}
+
+/* checkbox */
+$checkbox-ios-icon-border-color-off: color($colors, accent);
+$checkbox-md-icon-border-color-off: color($colors, accent);
+$checkbox-wp-icon-border-color-off: color($colors, accent);
+
+$checkbox-ios-icon-border-color-on: color($colors, accent);
+$checkbox-md-icon-border-color-on: color($colors, accent);
+$checkbox-wp-icon-border-color-on: color($colors, accent);
+
+$checkbox-ios-background-color-on: color($colors, accent);
+$checkbox-md-icon-background-color-on: color($colors, accent);
+$checkbox-wp-icon-background-color-on: color($colors, accent);
+
+$checkbox-md-icon-border-radius: 50%;
+$checkbox-wp-icon-border-radius: 50%;
+
+$checkbox-md-icon-size: 21px;
+$checkbox-wp-icon-size: 21px;
+
+$checkbox-md-item-start-margin-end: 20px;
+
+.checkbox-md, .checkbox-wp {
+  .checkbox-checked .checkbox-inner {
+    margin-top: 2px;
+    margin-left: 2px;
+  }
+}
+
+/* alert buttons */
+$alert-ios-button-text-color: color($colors, accent);
+$alert-md-button-text-color: color($colors, accent);
 
 // App iOS Variables
 // --------------------------------------------------