fix: 🐛 messages added on individual pages

icssc · Feb 20, 2024 · 62a202f · 62a202f
1 parent bd3aa7c
commit 62a202f
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 9 deletions.
diff --git a/src/lib/components/Selector.svelte b/src/lib/components/Selector.svelte
@@ -54,7 +54,6 @@
     <ChevronsUpDown size="16" />
   </div>
   <span class="sr-only">Open Popover</span>
-  <noscript class="no-js">MUST ENABLE JAVASCRIPT</noscript>
 </button>
 
 {#if $open}
@@ -103,12 +102,4 @@
     border: 1px solid var(--gray100);
     background-color: var(--background);
   }
-
-  .no-js {
-    color: red;
-    padding-left: 34px;
-    font-weight: bold;
-    font-size: 20px;
-    letter-spacing: 6px;
-  }
 </style>
diff --git a/src/routes/(auth)/signin/+page.svelte b/src/routes/(auth)/signin/+page.svelte
@@ -1 +1,11 @@
 <a href="/signin/google">Sign in with Google</a>
+<noscript>This Application Requires JS to Work</noscript>
+
+<style>
+  noscript {
+    color: red;
+    padding-left: 34px;
+    font-weight: bold;
+    font-size: 20px;
+  }
+</style>
diff --git a/src/routes/(nav)/[[selectedMember]]/Table.svelte b/src/routes/(nav)/[[selectedMember]]/Table.svelte
@@ -168,6 +168,11 @@
         {/each}
       </tr>
     {/each}
+    <noscript>
+      <tr>
+        <td class="no-js"> This Application Requires JS to Work </td>
+      </tr>
+    </noscript>
     <LineTableRow loading={$contactsQuery.isLoading} />
   </thead>
   <tbody>
@@ -242,6 +247,13 @@
       }
     }
 
+    .no-js {
+      color: red;
+      padding-left: 16px;
+      font-weight: bold;
+      font-size: 20px;
+    }
+
     td {
       $border: 0.75px solid var(--gray100);
       border-left: $border;

diff --git a/src/routes/(nav)/dashboard/+page.svelte b/src/routes/(nav)/dashboard/+page.svelte
@@ -35,6 +35,7 @@
 
 <main>
   <h1>Hello, {data.name}</h1>
+  <noscript>This Application Requires JS to Work </noscript>
   <div class="header">
     <h2>Members</h2>
     <div class="counts">
@@ -162,4 +163,11 @@
     margin: 12px 16px;
     gap: 12px;
   }
+
+  noscript {
+    color: red;
+    padding-left: 16px;
+    font-weight: bold;
+    font-size: 20px;
+  }
 </style>