Add BRAK IdP spike related markup

app/routes/_index.tsx

@@ -7,12 +7,26 @@ export const meta: MetaFunction = () => {
   ];
 };
 
+const onBeaLoginClick = () => {
+  alert("beA Login with BRAK IdP");
+};
+
 export default function Index() {
   return (
-    <main className={"flex flex-col items-center m-40"}>
-      <h1 className={"ds-heading-01-reg mb-40"}>
-        Hello Kommunikationsplattform!
+    <main className={"m-40 flex flex-col items-center"}>
+      <h1 className={"ds-heading-01-bold mb-40 break-all"}>
+        Kommunikationsplattform
       </h1>
+      <h2 className={"ds-heading-03-reg break-word"}>
+        Willkommen auf der Pilotplattform für den digitalen Austausch zwischen
+        Gerichten und Verfahrensbeteiligten in Zivilprozessen vor Amtsgerichten
+      </h2>
+      <div className={"m-40 text-center"}>
+        <p className={"pb-20"}>Bitte wählen Sie Ihre Loginmethode:</p>
+        <button onClick={onBeaLoginClick} className={"ds-button"}>
+          beA-Portal
+        </button>
+      </div>
     </main>
   );
 }

tests/e2e/example.spec.ts

@@ -6,10 +6,8 @@ test.describe("basic example test", () => {
     await expect(page).toHaveTitle("Kommunikationsplattform");
   });
 
-  test("shows hello message", async ({ page }) => {
+  test("shows Kommunikationsplattform text", async ({ page }) => {
     await page.goto("/");
-    await expect(
-      page.locator("text=Hello Kommunikationsplattform!"),
-    ).toBeVisible();
+    await expect(page.locator("text=Kommunikationsplattform")).toBeVisible();
   });
 });