Tidy up mx_InviteDialog_dialPad style rules (#8762)

matrix-org · Jun 5, 2022 · 41ee47f · 41ee47f
1 parent 022535e
commit 41ee47f
Showing 1 changed file with 31 additions and 35 deletions.
diff --git a/res/css/views/dialogs/_InviteDialog.scss b/res/css/views/dialogs/_InviteDialog.scss
@@ -345,49 +345,45 @@ limitations under the License.
 
 .mx_InviteDialog_helpText {
     margin: 0;
-}
-
-.mx_InviteDialog_helpText .mx_AccessibleButton_kind_link {
-    padding: 0;
-}
 
-.mx_InviteDialog_dialPad .mx_InviteDialog_dialPadField {
-    border-top: 0;
-    border-left: 0;
-    border-right: 0;
-    border-radius: 0;
-    margin-top: 0;
-    border-color: $quaternary-content;
-
-    input {
-        font-size: 18px;
-        font-weight: 600;
-        padding-top: 0;
+    .mx_AccessibleButton_kind_link {
+        padding: 0;
     }
 }
 
-.mx_InviteDialog_dialPad .mx_InviteDialog_dialPadField:focus-within {
-    border-color: $accent;
-}
-
-.mx_InviteDialog_dialPadField .mx_Field_postfix {
-    /* Remove border separator between postfix and field content */
-    border-left: none;
-}
-
 .mx_InviteDialog_dialPad {
     width: 224px;
-    margin-top: 16px;
-    margin-left: auto;
-    margin-right: auto;
-}
+    margin-top: $spacing-16;
+    margin-inline: auto;
+
+    .mx_InviteDialog_dialPadField {
+        border-top: 0;
+        border-inline: 0;
+        border-radius: 0;
+        margin-top: 0;
+        border-color: $quaternary-content;
+
+        &:focus-within {
+            border-color: $accent;
+        }
 
-.mx_InviteDialog_dialPad .mx_DialPad {
-    row-gap: 16px;
-    column-gap: 48px;
+        input {
+            font-size: 18px;
+            font-weight: 600;
+            padding-top: 0;
+        }
 
-    margin-left: auto;
-    margin-right: auto;
+        .mx_Field_postfix {
+            /* Remove border separator between postfix and field content */
+            border-left: none;
+        }
+    }
+
+    .mx_DialPad {
+        row-gap: $spacing-16;
+        column-gap: 48px; // TODO: Use a spacing variable
+        margin-inline: auto;
+    }
 }
 
 .mx_InviteDialog_transferConsultConnect {