Implemented design review feedback:

* Required field (Name) now shows a red asterisk indicating its required * Made error messages less round.
thunderbird · Apr 22, 2024 · a48eb3e · a48eb3e
1 parent 9f2b88a
commit a48eb3e
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 2 deletions.
diff --git a/frontend/src/components/ScheduleCreation.vue b/frontend/src/components/ScheduleCreation.vue
@@ -13,7 +13,7 @@
       </alert-box>
 
       <div class="px-4">
-        <label for="scheduleName">
+        <label for="scheduleName" class="flex-column flex">
           <input
             id="scheduleName"
             type="text"
@@ -23,6 +23,7 @@
             class="place-holder w-full rounded-none border-0 border-b bg-transparent px-0 dark:bg-transparent"
             required
           />
+          <div v-if="!scheduleInput.name" class="content-center text-red-500">*</div>
         </label>
       </div>
       <!-- step 1 -->

diff --git a/frontend/src/elements/AlertBox.vue b/frontend/src/elements/AlertBox.vue
@@ -1,6 +1,6 @@
 <template>
 <div
-  class="flex items-center p-2 leading-none text-white shadow-md shadow-black/30 dark:shadow-lg lg:inline-flex lg:rounded-full"
+  class="flex items-center p-2 leading-none text-white shadow-md shadow-black/30 dark:shadow-lg lg:inline-flex lg:rounded-xl"
   role="alert"
   :class="{
     'bg-rose-600 dark:bg-rose-900': scheme === alertSchemes.error,