Add additional classes to alias label (add-on required) to hide by de…

…fault, move additional classes from main to dashboard
mozilla · Aug 30, 2021 · c2695f7 · c2695f7
1 parent 53fc45a
commit c2695f7
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 39 deletions.
diff --git a/static/scss/partials/dashboard.scss b/static/scss/partials/dashboard.scss
@@ -208,16 +208,12 @@
     flex-wrap: nowrap;
     max-width: 100%;
 
-    .additional-notes {
-        text-overflow: ellipsis;
-        flex-direction: row;
-        position: relative;
-        margin: auto auto 0 0;
-        max-width: $content-xs;
-    }
-
     .relay-address {
         display: none;
+
+        @media #{$mq-md} {
+            display: block;
+        }
     }
 
     .additional-notes.show-label + button {
@@ -246,25 +242,17 @@
         border: 0;
         margin: 0;
         list-style: inherit;
-    }
-
-    input[type="text"] {
-        max-width: $content-xs;
-        min-width: auto;
+        min-width: 100%;
     }
 
     @media screen and (max-width: $screen-sm) {
-        
+
         input {
             width: auto;
         }
     }
+
     @media #{$mq-md} {
-
-        .relay-address {
-            display: block;
-        }
-
         margin-left: 0;
     }
 }
@@ -412,3 +400,33 @@
     }
 
 }
+
+
+.show-label.additional-notes {
+    visibility: visible;
+    pointer-events: all;
+    display: flex;
+}
+
+.additional-notes {
+    display: none;
+    text-overflow: ellipsis;
+    flex-direction: row;
+    position: relative;
+    margin: auto auto 0 0;
+    max-width: $content-xs;
+
+    &::after {
+        content: "";
+        min-width: 16px;
+        min-height: 16px;
+        margin-left: -$spacing-lg;
+        display: inline-block;
+        background: url("/static/images/edit.svg");
+        background-repeat: no-repeat;
+        background-position: center center;
+        pointer-events: none;
+        background-size: contain;
+        opacity: .6;
+    }
+}
diff --git a/static/scss/partials/main.scss b/static/scss/partials/main.scss
@@ -751,26 +751,6 @@ input:focus::placeholder {
     opacity: 0;
 }
 
-.show-label.additional-notes {
-    visibility: visible;
-    pointer-events: all;
-    display: flex;
-}
-
-.additional-notes::after {
-    content: "";
-    min-width: 16px;
-    min-height: 16px;
-    margin-left: -24px;
-    display: inline-block;
-    background: url("/static/images/edit.svg");
-    background-repeat: no-repeat;
-    background-position: center center;
-    pointer-events: none;
-    background-size: contain;
-    opacity: .6;
-}
-
 .user-created-label::after {
     opacity: 0;
 }