refactor(demo/top-bar): new top-bar

MM25Zamanian · MM25Zamanian · commit b10cbfe2b241 · 2024-06-26T16:35:20.000+03:30
diff --git a/demo/top-bar/index.html b/demo/top-bar/index.html
@@ -1,5 +1,5 @@
 <!doctype html>
-<html lang="en" class="color-scheme-auto bg-background font-vazirmatn">
+<html lang="en" class="color-scheme-auto bg-background font-vazirmatn gecut-layout">
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
@@ -10,5 +10,5 @@
     <script type="module" src="../main/global.ts"></script>
     <script type="module" src="./scripts.ts"></script>
   </head>
-  <body class="bg-surface max-w-screen-sm mx-auto px-2 root"></body>
+  <body></body>
 </html>
diff --git a/demo/top-bar/scripts.ts b/demo/top-bar/scripts.ts
@@ -19,13 +19,11 @@ render(
       ],
       title: 'Gecut Top Bar',
     })}
-    <main role="main">
-      <div class="gecut-page scrollable">
-        ${map(
-          range(window.innerHeight / 10),
-          (i) => html`<p class="text-bodyMedium text-onSurfaceVariant">Random Content: ${i}</p>`,
-        )}
-      </div>
+    <main class="has-top-bar px-4">
+      ${map(
+        range(window.innerHeight / 10),
+        (i) => html`<p class="text-bodyMedium text-onSurfaceVariant">Random Content: ${i}</p>`,
+      )}
     </main>
   `,
   document.body,
