Fix Buttons in Settings

MyEtherWallet · Feb 14, 2019 · 0fbb49a · 0fbb49a · mew-bot · Feb 14, 2019
1 parent 19aebe2
commit 0fbb49a
Show file tree

Hide file tree

Showing 5 changed files with 28 additions and 25 deletions.
diff --git a/src/components/Buttons/StandardButton/StandardButton.scss b/src/components/Buttons/StandardButton/StandardButton.scss
@@ -137,6 +137,13 @@ button[disabled] {
   &.full-width {
     display: block;
   }
+
+  &.mobile-full-width {
+    // Mobile
+    @media all and (max-width: $mobile-width) {
+      width: 100%;
+    }
+  }
 }
 
 //=======================================================================

diff --git a/src/components/Buttons/StandardButton/StandardButton.vue b/src/components/Buttons/StandardButton/StandardButton.vue
@@ -2,6 +2,7 @@
   <div
     :class="{
       'full-width': options.fullWidth,
+      'mobile-full-width': options.mobileFullWidth,
       'hide-mobile-button': onBottomOfPage && options.isThisMobileBottomButton
     }"
     class="standard-button"

diff --git a/src/components/SettingsModal/SettingsModal.scss b/src/components/SettingsModal/SettingsModal.scss
@@ -103,6 +103,9 @@ $mobile-width: 530px;
       width: 100%;
       text-align: center;
 
+      .filename {
+        margin-bottom: 10px;
+      }
       .upload-file-button {
         margin-top: 10px;
       }
@@ -111,7 +114,7 @@ $mobile-width: 530px;
 
   .button-block {
     text-align: center;
-    margin-top: 40px;
+    margin-top: 10px;
     @media all and (max-width: $mobile-width) {
       margin-top: 10px;
     }
@@ -127,22 +130,4 @@ $mobile-width: 530px;
     margin-top: 40px;
   }
 
-  .export-button {
-    background-color: $mew-green;
-    border: 1px solid $mew-green;
-    border-radius: 4px;
-    color: #fff;
-    cursor: pointer;
-    display: inline-block;
-    font-size: 14px;
-    font-weight: 500;
-    padding: 18px 45px;
-    position: relative;
-    width: 250px;
-
-    &:hover {
-      transition: opacity 0.3s ease;
-      text-decoration: none;
-    }
-  }
 }
diff --git a/src/components/SettingsModal/SettingsModal.vue b/src/components/SettingsModal/SettingsModal.vue
@@ -90,7 +90,9 @@
               file from your local computer.
             </p>
             <div class="import-button-block">
-              <standard-input :options="inputFileName" />
+              <div class="filename">
+                <standard-input :options="inputFileName" />
+              </div>
               <input
                 ref="uploadInput"
                 type="file"
@@ -121,8 +123,8 @@
             </p>
             <div class="button-block">
               <a :href="file" :download="fileName" class="export-button"
-                >Export</a
-              >
+                ><standard-button :options="buttonExport"
+              /></a>
             </div>
           </full-width-dropdown>
         </div>
@@ -159,7 +161,14 @@ export default {
         buttonStyle: 'green',
         rightArrow: false,
         leftArrow: false,
-        fullWidth: false
+        mobileFullWidth: true
+      },
+      buttonExport: {
+        title: 'Export',
+        buttonStyle: 'green',
+        rightArrow: false,
+        leftArrow: false,
+        mobileFullWidth: true
       },
       buttonUploadFile: {
         title: 'Upload File...',
@@ -187,7 +196,8 @@ export default {
         topTextInfo: '',
         popover: '',
         placeHolder: '',
-        rightInputText: ''
+        rightInputText: '',
+        readOnly: true
       },
       selectedGasType: 'regular',
       customGas: 0,

diff --git a/src/darklist/address-darklist.json b/src/darklist/address-darklist.json