OZG-6719 Demo Orgaliste-HTML

alfa-client/apps/demo/src/app/app.component.html

@@ -11,6 +11,67 @@
       <nav>NAV</nav>
     </div>
     <main class="flex-auto bg-background-50 p-6">
+      <div class="my-12">
+        <h1 class="mb-6 text-2xl font-semibold text-text">Organisationseinheiten</h1>
+        <ods-button text="Organisationseinheit hinzufügen" />
+        <ul class="mt-6 divide-y divide-gray-300 rounded-md bg-background-50 text-text shadow-sm ring-1 ring-gray-300">
+          <li>
+            <a
+              href="#"
+              class="flex flex-col items-start justify-between gap-2 rounded-t-md border-primary-600/50 px-6 py-4 hover:bg-background-150 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus lg:flex-row lg:gap-6"
+            >
+              <div class="flex-1 basis-5/6">
+                <div class="flex flex-wrap items-center gap-x-3">
+                  <h3 class="text-md font-semibold">
+                    Amt für Digitalisierung, Breitband und Vermessung Nürnberg Außenstelle Hersbruck
+                  </h3>
+                </div>
+              </div>
+
+              <dl class="flex-1 basis-1/6">
+                <dt class="sr-only">Organisations-ID:</dt>
+                <dd>2348328-0</dd>
+              </dl>
+            </a>
+          </li>
+          <li>
+            <a
+              href="#"
+              class="flex flex-col items-start justify-between gap-2 rounded-t-md border-primary-600/50 px-6 py-4 hover:bg-background-150 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus lg:flex-row lg:gap-6"
+            >
+              <div class="flex-1 basis-5/6">
+                <div class="flex flex-wrap items-center gap-x-3">
+                  <h3 class="text-md font-semibold">Amt für Planwirtschaft</h3>
+                </div>
+              </div>
+
+              <dl class="flex-1 basis-1/6">
+                <dt class="sr-only">Organisations-ID:</dt>
+                <dd>2348328-0</dd>
+              </dl>
+            </a>
+          </li>
+          <li>
+            <a
+              href="#"
+              class="flex flex-col items-start justify-between gap-2 rounded-t-md border-primary-600/50 px-6 py-4 hover:bg-background-150 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus lg:flex-row lg:gap-6"
+            >
+              <div class="flex-1 basis-5/6">
+                <div class="flex flex-wrap items-center gap-x-3">
+                  <h3 class="text-md font-semibold">
+                    Landeshauptstadt Kiel - Umweltschutzamt, Untere Naturschutzbehörde (uNB), Arten- und Biotopschutz
+                  </h3>
+                </div>
+              </div>
+
+              <dl class="flex-1 basis-1/6">
+                <dt class="sr-only">Organisations-ID:</dt>
+                <dd>1238328-0</dd>
+              </dl>
+            </a>
+          </li>
+        </ul>
+      </div>
       <div class="my-4">
         <h1 class="mb-6 text-2xl font-semibold text-text">Benutzer & Rollen</h1>
         <ods-button text="Benutzer hinzufügen" />