Merge pull request #17 from icssc/no-js-view

fix: 🐛 fixed No JS View
icssc · Feb 20, 2024 · cc4100c · cc4100c
2 parents 298bcd9 + 62a202f
commit cc4100c
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 0 deletions.
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>