add hint text for people

CVHS-student-sites · Aug 9, 2024 · 4998107 · 4998107
1 parent 29367e2
commit 4998107
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 4 deletions.
diff --git a/src/routes/(admin)/admin/edit/Editmodal.svelte b/src/routes/(admin)/admin/edit/Editmodal.svelte
@@ -34,7 +34,7 @@
             userData.permissions = null;
         }
 
-        if(userData.LockerLockerNumber === '') userData.LockerLockerNumber = null;
+        if (userData.LockerLockerNumber === '') userData.LockerLockerNumber = null;
 
         let response = await updateUserEditData(data, userData);
 
@@ -225,10 +225,25 @@
         margin-top: 10px;
     }
 
+    .hint-text{
+        color: var(--text);
+        font-size: 12px;
+        font-family: 'Montserrat', sans-serif;
+        margin-bottom: 5px;
+    }
+
     .action-btn {
         cursor: pointer;
     }
 
+    .action-btn-cont {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        flex-direction: column;
+        gap: 4px;
+    }
+
     .input-row {
         display: flex;
         align-items: center;
@@ -237,7 +252,7 @@
         gap: 8px;
     }
 
-    .material-symbols-outlined{
+    .material-symbols-outlined {
         user-select: none;
     }
 </style>
@@ -326,8 +341,14 @@
 
 
                 <div class="action-cont">
-                    <div class="action-btn material-symbols-outlined" on:click={deleteUser}>delete</div>
-                    <div class="action-btn material-symbols-outlined" on:click={removeLocker}>person_remove</div>
+                    <div class="action-btn-cont">
+                        <div class="action-btn material-symbols-outlined" on:click={deleteUser}>delete</div>
+                        <div class="hint-text">Delete User</div>
+                    </div>
+                    <div class="action-btn-cont">
+                        <div class="action-btn material-symbols-outlined" on:click={removeLocker}>person_remove</div>
+                        <div class="hint-text">Clear Locker</div>
+                    </div>
                 </div>
             </div>
         {/if}

diff --git a/src/routes/(admin)/admin/manage/UploadData.svelte b/src/routes/(admin)/admin/manage/UploadData.svelte
@@ -65,6 +65,20 @@
         /* padding: 6px; */
         cursor: pointer;
         box-sizing: border-box;
+
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            gap: 5px;
+
+    }
+
+    .hint-text{
+        color: var(--text);
+        font-size: 12px;
+        font-family: 'Montserrat', sans-serif;
+        margin-bottom: 5px;
     }
 
     .material-symbols-outlined {
@@ -103,6 +117,7 @@
             <input accept=".csv" class="input" id="locker" name="locker" type="file" bind:files={file1} />
 
             <div class="material-symbols-outlined filled-icons">upload_file</div>
+            <div class="hint-text">Click icon to select file</div>
         </label>
         <button class="submit" on:click={submitLocker}>Upload locker</button>
     </div>
@@ -112,6 +127,7 @@
             <input accept=".csv" class="input" id="locker" name="locker" type="file" bind:files={file2} />
 
             <div class="material-symbols-outlined filled-icons">upload_file</div>
+            <div class="hint-text">Click icon to select file</div>
         </label>
         <button class="submit" on:click={submitUser}>Upload user</button>
     </div>