frontend-toegevoegd

agiledancers-fe/src/app/app.html

@@ -0,0 +1,46 @@
+<a class="skip-link" href="#main-content">Naar inhoud</a>
+<div class="app-layout">
+  <aside class="sidebar">
+    <a routerLink="/schools" class="brand" aria-label="Agile Dancers – alle dansscholen"
+      ><span class="brand-mark" aria-hidden="true">a<span>↗</span></span
+      ><span
+        >agile<span class="brand-light">dancers</span><small>IN BEWEGING, SAMEN.</small></span
+      ></a
+    >
+    <p class="nav-label">WERKRUIMTE</p>
+    <nav aria-label="Hoofdnavigatie">
+      <a class="nav-item selected" routerLink="/schools"
+        ><svg
+          viewBox="0 0 24 24"
+          fill="none"
+          stroke="currentColor"
+          stroke-width="1.6"
+          aria-hidden="true"
+        >
+          <path d="m3 10 9-7 9 7v10H3Z" />
+          <path d="M9 20v-7h6v7" /></svg
+        >Mijn dansscholen<span aria-hidden="true">→</span></a
+      >
+    </nav>
+    <div class="sidebar-note">
+      <span aria-hidden="true">✳</span>
+      <h3>Alles begint<br />met beweging.</h3>
+      <p>Jij zorgt voor de dans.<br />Wij houden het overzicht.</p>
+    </div>
+    <div class="sidebar-footer">
+      <span class="status-dot" aria-hidden="true"></span> Agile Dancers <span>1.0</span>
+    </div>
+  </aside>
+  <div class="main-column">
+    <header class="topbar">
+      <span>Dansschoolbeheer</span
+      ><span class="topbar-right"
+        ><span class="topbar-dot" aria-hidden="true"></span> Studio workspace</span
+      >
+    </header>
+    <main id="main-content" tabindex="-1"><router-outlet /></main>
+    <footer class="page-footer">
+      <span>Gemaakt voor de mensen achter de dans.</span><span>Agile Dancers</span>
+    </footer>
+  </div>
+</div>