Clearer labeling on the sponsor edit form.

cmu-sei · Oct 13, 2023 · f38e6f0 · f38e6f0
1 parent 9a8a9d7
commit f38e6f0
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 4 deletions.
diff --git a/...meboard-ui/src/app/sponsors/components/sponsor-edit-form/sponsor-edit-form.component.html b/...meboard-ui/src/app/sponsors/components/sponsor-edit-form/sponsor-edit-form.component.html
@@ -6,14 +6,16 @@
             </div>
         </app-dropzone>
     </div>
-    <div class="form-group m-0 p-0 flex-grow-1">
-        <input type="text" class="form-control" id="name" placeholder="Sponsor name" required maxlength="200"
+    <div class="form-group input-with-label p-0 flex-grow-1">
+        <label for="name">Name</label>
+        <input type="text" class="form-control" id="name" placeholder="Enter a sponsor name" required maxlength="200"
             [(ngModel)]="upsertSponsorRequest.name">
     </div>
 
-    <div class="form-group px-0 mx-2 mt-2">
+    <div class="form-group px-0 mx-2 input-with-label">
+        <label for="parentSponsorId">Parent Sponsor</label>
         <select name="parentSponsorId" class="form-control" [(ngModel)]="upsertSponsorRequest.parentSponsorId">
-            <option [ngValue]="undefined">[no parent sponsor]</option>
+            <option [ngValue]="undefined">--</option>
             <option *ngFor="let eligibleParent of eligibleParentSponsors" [value]="eligibleParent.id">
                 {{eligibleParent.name}}
             </option>

diff --git a/...meboard-ui/src/app/sponsors/components/sponsor-edit-form/sponsor-edit-form.component.scss b/...meboard-ui/src/app/sponsors/components/sponsor-edit-form/sponsor-edit-form.component.scss
@@ -24,3 +24,7 @@ img, .dropzone-target {
     font-size: 4rem;
     margin-bottom: 8px;
 }
+
+.input-with-label {
+    margin-bottom: 30px;
+}