Fix selector styling

styles/components/_selector.scss

@@ -14,7 +14,7 @@
     width: 100%;
     height: $input-height;
     margin: 0;
-    padding: $input-padding-vertical 0.7em;
+    padding: $input-padding-vertical ($gap*5) $input-padding-vertical 0.7em;
     line-height: $input-line-height;
     color: $color-base;
     font-size: $base-font-size;
@@ -42,6 +42,9 @@
 
           label {
             padding: 0;
+            dt {
+              font-weight: $font-bold;
+            }
           }
         }
       }

styles/sections/_member_edit.scss

@@ -3,23 +3,6 @@
   padding: $gap*2;
   justify-content: space-between;
 
-  dl {
-    margin: 0;
-
-    > div {
-      margin-bottom: $gap;
-    }
-  }
-
-  dt {
-    font-weight: normal;
-    color: $color-gray;
-  }
-
-  dd {
-    display: inline;
-  }
-
   .member-card__header {
     display: flex;
     flex-direction: column;
@@ -35,11 +18,13 @@
     margin: 0;
     display: flex;
     margin-top: $gap;
+    fieldset {
+      margin: 0;
+    }
 
-    label {
+    legend {
       flex: none;
       margin-top: $gap*1.5;
-      font-weight: $font-normal;
       margin-right: $gap*2;
     }
   }
@@ -51,5 +36,22 @@
     .icon-link {
       margin: 0 -$gap;
     }
+
+    dl {
+      margin: 0;
+
+      > div {
+        margin-bottom: $gap;
+      }
+    }
+
+    dt {
+      font-weight: normal;
+      color: $color-gray;
+    }
+
+    dd {
+      display: inline;
+    }
   }
-}
+}

templates/member_edit.html

@@ -14,7 +14,6 @@
       <h1 class='member-card__heading'>{{ member.user.full_name }}</h1>
 
         <div class="usa-input member-card__input">
-          <label for="filter-status">Workspace Role</label>
           {{ Selector(form.workspace_role) }}
         </div>