formated project with prettier
This commit is contained in:
PxlLoewe
@@ -1,27 +1,27 @@
|
||||
import { NextPage } from 'next';
|
||||
import { ReactNode } from 'react';
|
||||
import { NextPage } from "next";
|
||||
import { ReactNode } from "react";
|
||||
|
||||
const AuthLayout: NextPage<
|
||||
Readonly<{
|
||||
children: React.ReactNode;
|
||||
}>
|
||||
Readonly<{
|
||||
children: React.ReactNode;
|
||||
}>
|
||||
> = ({ children }) => (
|
||||
<div
|
||||
className="hero min-h-screen"
|
||||
style={{
|
||||
backgroundImage:
|
||||
'url(https://img.daisyui.com/images/stock/photo-1507358522600-9f71e620c44e.webp)',
|
||||
}}
|
||||
>
|
||||
<div className="hero-overlay bg-opacity-60"></div>
|
||||
<div className="hero-content text-neutral-content text-center ">
|
||||
<div className="max-w-lg">
|
||||
<div className="card bg-base-100 w-full min-w-[500px] shadow-2xl max-md:min-w-[400px]">
|
||||
{children}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="hero min-h-screen"
|
||||
style={{
|
||||
backgroundImage:
|
||||
"url(https://img.daisyui.com/images/stock/photo-1507358522600-9f71e620c44e.webp)",
|
||||
}}
|
||||
>
|
||||
<div className="hero-overlay bg-opacity-60"></div>
|
||||
<div className="hero-content text-neutral-content text-center ">
|
||||
<div className="max-w-lg">
|
||||
<div className="card bg-base-100 w-full min-w-[500px] shadow-2xl max-md:min-w-[400px]">
|
||||
{children}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
export default AuthLayout;
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
import { Login } from './_components/Login';
|
||||
import { Login } from "./_components/Login";
|
||||
|
||||
export default async () => {
|
||||
return (
|
||||
<>
|
||||
<Login />
|
||||
</>
|
||||
);
|
||||
return (
|
||||
<>
|
||||
<Login />
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -1,16 +1,16 @@
|
||||
'use client';
|
||||
import { signOut } from 'next-auth/react';
|
||||
import { useEffect } from 'react';
|
||||
"use client";
|
||||
import { signOut } from "next-auth/react";
|
||||
import { useEffect } from "react";
|
||||
|
||||
export default () => {
|
||||
useEffect(() => {
|
||||
signOut({
|
||||
callbackUrl: '/login',
|
||||
});
|
||||
}, []);
|
||||
return (
|
||||
<div className="card-body">
|
||||
<h1 className="text-5xl">logging out...</h1>
|
||||
</div>
|
||||
);
|
||||
useEffect(() => {
|
||||
signOut({
|
||||
callbackUrl: "/login",
|
||||
});
|
||||
}, []);
|
||||
return (
|
||||
<div className="card-body">
|
||||
<h1 className="text-5xl">logging out...</h1>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -1,26 +1,26 @@
|
||||
import { Authorize } from './_components/Authorize';
|
||||
import { Authorize } from "./_components/Authorize";
|
||||
|
||||
export const services = [
|
||||
{
|
||||
id: '123456',
|
||||
service: 'dispatch',
|
||||
name: 'Leitstellendisposition',
|
||||
approvedUrls: ['http://localhost:3001'],
|
||||
},
|
||||
{
|
||||
id: "123456",
|
||||
service: "dispatch",
|
||||
name: "Leitstellendisposition",
|
||||
approvedUrls: ["http://localhost:3001"],
|
||||
},
|
||||
];
|
||||
export type Service = (typeof services)[number];
|
||||
|
||||
export default async ({
|
||||
searchParams,
|
||||
searchParams,
|
||||
}: {
|
||||
searchParams: Promise<{ [key: string]: string | string[] | undefined }>;
|
||||
searchParams: Promise<{ [key: string]: string | string[] | undefined }>;
|
||||
}) => {
|
||||
const { service: serviceId } = await searchParams;
|
||||
const service = services.find((service) => service.id === serviceId);
|
||||
const { service: serviceId } = await searchParams;
|
||||
const service = services.find((service) => service.id === serviceId);
|
||||
|
||||
if (!service) {
|
||||
return <div>Service not found</div>;
|
||||
}
|
||||
if (!service) {
|
||||
return <div>Service not found</div>;
|
||||
}
|
||||
|
||||
return <Authorize service={service} />;
|
||||
return <Authorize service={service} />;
|
||||
};
|
||||
|
||||
@@ -1,31 +1,35 @@
|
||||
"use client";
|
||||
|
||||
export const ChangeRufgruppe = () => {
|
||||
return (
|
||||
<>
|
||||
<details className="dropdown">
|
||||
<summary className="dropdown flex items-center gap-1">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className="h-5 w-5"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth="2"
|
||||
d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"
|
||||
/>
|
||||
</svg>
|
||||
<div className="badge badge-soft badge-success">1</div>
|
||||
</summary>
|
||||
<ul className="menu dropdown-content bg-base-100 rounded-box z-1 w-52 p-2 shadow-sm">
|
||||
<li><a>Rufgruppe 1</a></li>
|
||||
<li><a>Rufgruppe 2</a></li>
|
||||
</ul>
|
||||
</details>
|
||||
</>
|
||||
);
|
||||
return (
|
||||
<>
|
||||
<details className="dropdown">
|
||||
<summary className="dropdown flex items-center gap-1">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className="h-5 w-5"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth="2"
|
||||
d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"
|
||||
/>
|
||||
</svg>
|
||||
<div className="badge badge-soft badge-success">1</div>
|
||||
</summary>
|
||||
<ul className="menu dropdown-content bg-base-100 rounded-box z-1 w-52 p-2 shadow-sm">
|
||||
<li>
|
||||
<a>Rufgruppe 1</a>
|
||||
</li>
|
||||
<li>
|
||||
<a>Rufgruppe 2</a>
|
||||
</li>
|
||||
</ul>
|
||||
</details>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -1,28 +1,28 @@
|
||||
'use client';
|
||||
import { useEffect, useRef } from 'react';
|
||||
"use client";
|
||||
import { useEffect, useRef } from "react";
|
||||
|
||||
import L from 'leaflet';
|
||||
import 'leaflet/dist/leaflet.css';
|
||||
import L from "leaflet";
|
||||
import "leaflet/dist/leaflet.css";
|
||||
|
||||
export default () => {
|
||||
const mapRef = useRef<HTMLDivElement>(null);
|
||||
const mapRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
useEffect(() => {
|
||||
if (!mapRef.current) return;
|
||||
useEffect(() => {
|
||||
if (!mapRef.current) return;
|
||||
|
||||
// Initialisiere die Leaflet-Karte
|
||||
const map = L.map(mapRef.current).setView([51.1657, 10.4515], 6); // Deutschland
|
||||
// Initialisiere die Leaflet-Karte
|
||||
const map = L.map(mapRef.current).setView([51.1657, 10.4515], 6); // Deutschland
|
||||
|
||||
// OpenStreetMap Tile Layer hinzufügen
|
||||
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
||||
attribution:
|
||||
'© <a href="https://www.openstreetmap.org/copyright">OSM</a> contributors',
|
||||
}).addTo(map);
|
||||
// OpenStreetMap Tile Layer hinzufügen
|
||||
L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
|
||||
attribution:
|
||||
'© <a href="https://www.openstreetmap.org/copyright">OSM</a> contributors',
|
||||
}).addTo(map);
|
||||
|
||||
return () => {
|
||||
map.remove(); // Karte beim Unmounten bereinigen
|
||||
};
|
||||
}, []);
|
||||
return () => {
|
||||
map.remove(); // Karte beim Unmounten bereinigen
|
||||
};
|
||||
}, []);
|
||||
|
||||
return <div ref={mapRef} className="w-full h-full rounded-lg shadow-lg" />;
|
||||
return <div ref={mapRef} className="w-full h-full rounded-lg shadow-lg" />;
|
||||
};
|
||||
|
||||
@@ -1,73 +1,73 @@
|
||||
'use client';
|
||||
import { ToggleTalkButton } from '../_components/ToggleTalkButton';
|
||||
import { ChangeRufgruppe } from '../_components/ChangeRufgruppe';
|
||||
import { Notifications } from '../_components/Notifications';
|
||||
import Link from 'next/link';
|
||||
"use client";
|
||||
import { ToggleTalkButton } from "../_components/ToggleTalkButton";
|
||||
import { ChangeRufgruppe } from "../_components/ChangeRufgruppe";
|
||||
import { Notifications } from "../_components/Notifications";
|
||||
import Link from "next/link";
|
||||
|
||||
export default function Navbar() {
|
||||
return (
|
||||
<div className="navbar bg-base-100 shadow-sm">
|
||||
<div className="flex-1">
|
||||
<a className="btn btn-ghost text-xl">VAR Leitstelle V2</a>
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
<ul className="menu menu-horizontal bg-base-200 rounded-box">
|
||||
<li>
|
||||
<ToggleTalkButton />
|
||||
</li>
|
||||
<li>
|
||||
<ChangeRufgruppe />
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
<Notifications />
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
<label className="swap swap-rotate">
|
||||
{/* this hidden checkbox controls the state */}
|
||||
<input type="checkbox" className="theme-controller" value="dark" />
|
||||
return (
|
||||
<div className="navbar bg-base-100 shadow-sm">
|
||||
<div className="flex-1">
|
||||
<a className="btn btn-ghost text-xl">VAR Leitstelle V2</a>
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
<ul className="menu menu-horizontal bg-base-200 rounded-box">
|
||||
<li>
|
||||
<ToggleTalkButton />
|
||||
</li>
|
||||
<li>
|
||||
<ChangeRufgruppe />
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
<Notifications />
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
<label className="swap swap-rotate">
|
||||
{/* this hidden checkbox controls the state */}
|
||||
<input type="checkbox" className="theme-controller" value="dark" />
|
||||
|
||||
{/* sun icon */}
|
||||
<svg
|
||||
className="swap-off h-10 w-10 fill-current"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path d="M5.64,17l-.71.71a1,1,0,0,0,0,1.41,1,1,0,0,0,1.41,0l.71-.71A1,1,0,0,0,5.64,17ZM5,12a1,1,0,0,0-1-1H3a1,1,0,0,0,0,2H4A1,1,0,0,0,5,12Zm7-7a1,1,0,0,0,1-1V3a1,1,0,0,0-2,0V4A1,1,0,0,0,12,5ZM5.64,7.05a1,1,0,0,0,.7.29,1,1,0,0,0,.71-.29,1,1,0,0,0,0-1.41l-.71-.71A1,1,0,0,0,4.93,6.34Zm12,.29a1,1,0,0,0,.7-.29l.71-.71a1,1,0,1,0-1.41-1.41L17,5.64a1,1,0,0,0,0,1.41A1,1,0,0,0,17.66,7.34ZM21,11H20a1,1,0,0,0,0,2h1a1,1,0,0,0,0-2Zm-9,8a1,1,0,0,0-1,1v1a1,1,0,0,0,2,0V20A1,1,0,0,0,12,19ZM18.36,17A1,1,0,0,0,17,18.36l.71.71a1,1,0,0,0,1.41,0,1,1,0,0,0,0-1.41ZM12,6.5A5.5,5.5,0,1,0,17.5,12,5.51,5.51,0,0,0,12,6.5Zm0,9A3.5,3.5,0,1,1,15.5,12,3.5,3.5,0,0,1,12,15.5Z" />
|
||||
</svg>
|
||||
{/* sun icon */}
|
||||
<svg
|
||||
className="swap-off h-10 w-10 fill-current"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path d="M5.64,17l-.71.71a1,1,0,0,0,0,1.41,1,1,0,0,0,1.41,0l.71-.71A1,1,0,0,0,5.64,17ZM5,12a1,1,0,0,0-1-1H3a1,1,0,0,0,0,2H4A1,1,0,0,0,5,12Zm7-7a1,1,0,0,0,1-1V3a1,1,0,0,0-2,0V4A1,1,0,0,0,12,5ZM5.64,7.05a1,1,0,0,0,.7.29,1,1,0,0,0,.71-.29,1,1,0,0,0,0-1.41l-.71-.71A1,1,0,0,0,4.93,6.34Zm12,.29a1,1,0,0,0,.7-.29l.71-.71a1,1,0,1,0-1.41-1.41L17,5.64a1,1,0,0,0,0,1.41A1,1,0,0,0,17.66,7.34ZM21,11H20a1,1,0,0,0,0,2h1a1,1,0,0,0,0-2Zm-9,8a1,1,0,0,0-1,1v1a1,1,0,0,0,2,0V20A1,1,0,0,0,12,19ZM18.36,17A1,1,0,0,0,17,18.36l.71.71a1,1,0,0,0,1.41,0,1,1,0,0,0,0-1.41ZM12,6.5A5.5,5.5,0,1,0,17.5,12,5.51,5.51,0,0,0,12,6.5Zm0,9A3.5,3.5,0,1,1,15.5,12,3.5,3.5,0,0,1,12,15.5Z" />
|
||||
</svg>
|
||||
|
||||
{/* moon icon */}
|
||||
<svg
|
||||
className="swap-on h-10 w-10 fill-current"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path d="M21.64,13a1,1,0,0,0-1.05-.14,8.05,8.05,0,0,1-3.37.73A8.15,8.15,0,0,1,9.08,5.49a8.59,8.59,0,0,1,.25-2A1,1,0,0,0,8,2.36,10.14,10.14,0,1,0,22,14.05,1,1,0,0,0,21.64,13Zm-9.5,6.69A8.14,8.14,0,0,1,7.08,5.22v.27A10.15,10.15,0,0,0,17.22,15.63a9.79,9.79,0,0,0,2.1-.22A8.11,8.11,0,0,1,12.14,19.73Z" />
|
||||
</svg>
|
||||
</label>
|
||||
<div className="dropdown dropdown-end">
|
||||
<div tabIndex={0} role="button" className="btn btn-ghost">
|
||||
...
|
||||
</div>
|
||||
<ul
|
||||
tabIndex={0}
|
||||
className="menu menu-sm dropdown-content bg-base-100 box z-1 mt-3 w-52 p-2 shadow"
|
||||
>
|
||||
<li>
|
||||
<a className="justify-between">Profil</a>
|
||||
</li>
|
||||
<li>
|
||||
<a>Einstellungen</a>
|
||||
</li>
|
||||
<li>
|
||||
<Link href={'/logout'}>
|
||||
<p>Logout</p>
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
{/* moon icon */}
|
||||
<svg
|
||||
className="swap-on h-10 w-10 fill-current"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path d="M21.64,13a1,1,0,0,0-1.05-.14,8.05,8.05,0,0,1-3.37.73A8.15,8.15,0,0,1,9.08,5.49a8.59,8.59,0,0,1,.25-2A1,1,0,0,0,8,2.36,10.14,10.14,0,1,0,22,14.05,1,1,0,0,0,21.64,13Zm-9.5,6.69A8.14,8.14,0,0,1,7.08,5.22v.27A10.15,10.15,0,0,0,17.22,15.63a9.79,9.79,0,0,0,2.1-.22A8.11,8.11,0,0,1,12.14,19.73Z" />
|
||||
</svg>
|
||||
</label>
|
||||
<div className="dropdown dropdown-end">
|
||||
<div tabIndex={0} role="button" className="btn btn-ghost">
|
||||
...
|
||||
</div>
|
||||
<ul
|
||||
tabIndex={0}
|
||||
className="menu menu-sm dropdown-content bg-base-100 box z-1 mt-3 w-52 p-2 shadow"
|
||||
>
|
||||
<li>
|
||||
<a className="justify-between">Profil</a>
|
||||
</li>
|
||||
<li>
|
||||
<a>Einstellungen</a>
|
||||
</li>
|
||||
<li>
|
||||
<Link href={"/logout"}>
|
||||
<p>Logout</p>
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,28 +1,42 @@
|
||||
"use client";
|
||||
"use client";
|
||||
|
||||
export const Notifications = () => {
|
||||
return (
|
||||
<>
|
||||
<details className="dropdown">
|
||||
<summary className="btn btn-ghost dropdown flex items-center gap-1">
|
||||
<div className="badge badge-sm badge-secondary">+99</div>
|
||||
</summary>
|
||||
<ul className="menu dropdown-content bg-base-100 rounded-box z-1 w-52 p-2 shadow-sm">
|
||||
<li><a>Testbenachrichtigung 1</a></li>
|
||||
<li className="divider"></li>
|
||||
<li><a>Testbenachrichtigung 2</a></li>
|
||||
<li className="divider"></li>
|
||||
<li><a>Testbenachrichtigung 3</a></li>
|
||||
<li className="divider"></li>
|
||||
<li><a>Testbenachrichtigung 4</a></li>
|
||||
<li className="divider"></li>
|
||||
<li><a>Testbenachrichtigung 5</a></li>
|
||||
<li className="divider"></li>
|
||||
<li><a>Testbenachrichtigung 6</a></li>
|
||||
<li className="divider"></li>
|
||||
<li><a>Testbenachrichtigung 7</a></li>
|
||||
</ul>
|
||||
</details>
|
||||
</>
|
||||
);
|
||||
};
|
||||
return (
|
||||
<>
|
||||
<details className="dropdown">
|
||||
<summary className="btn btn-ghost dropdown flex items-center gap-1">
|
||||
<div className="badge badge-sm badge-secondary">+99</div>
|
||||
</summary>
|
||||
<ul className="menu dropdown-content bg-base-100 rounded-box z-1 w-52 p-2 shadow-sm">
|
||||
<li>
|
||||
<a>Testbenachrichtigung 1</a>
|
||||
</li>
|
||||
<li className="divider"></li>
|
||||
<li>
|
||||
<a>Testbenachrichtigung 2</a>
|
||||
</li>
|
||||
<li className="divider"></li>
|
||||
<li>
|
||||
<a>Testbenachrichtigung 3</a>
|
||||
</li>
|
||||
<li className="divider"></li>
|
||||
<li>
|
||||
<a>Testbenachrichtigung 4</a>
|
||||
</li>
|
||||
<li className="divider"></li>
|
||||
<li>
|
||||
<a>Testbenachrichtigung 5</a>
|
||||
</li>
|
||||
<li className="divider"></li>
|
||||
<li>
|
||||
<a>Testbenachrichtigung 6</a>
|
||||
</li>
|
||||
<li className="divider"></li>
|
||||
<li>
|
||||
<a>Testbenachrichtigung 7</a>
|
||||
</li>
|
||||
</ul>
|
||||
</details>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -1,32 +1,32 @@
|
||||
'use client';
|
||||
import { useTalkStore } from '../../_store/useTalkStore';
|
||||
"use client";
|
||||
import { useTalkStore } from "../../_store/useTalkStore";
|
||||
|
||||
export const ToggleTalkButton = () => {
|
||||
const { isTalking, toggleTalking } = useTalkStore();
|
||||
const { isTalking, toggleTalking } = useTalkStore();
|
||||
|
||||
return (
|
||||
<button
|
||||
onClick={toggleTalking}
|
||||
className={`${
|
||||
isTalking
|
||||
? 'bg-red-500 hover:bg-red-600'
|
||||
: 'bg-transparent hover:bg-neutral-300'
|
||||
}`}
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className="h-5 w-5"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth="2"
|
||||
d="M12 18.75a6 6 0 0 0 6-6v-1.5m-6 7.5a6 6 0 0 1-6-6v-1.5m6 7.5v3.75m-3.75 0h7.5M12 15.75a3 3 0 0 1-3-3V4.5a3 3 0 1 1 6 0v8.25a3 3 0 0 1-3 3Z"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
);
|
||||
return (
|
||||
<button
|
||||
onClick={toggleTalking}
|
||||
className={`${
|
||||
isTalking
|
||||
? "bg-red-500 hover:bg-red-600"
|
||||
: "bg-transparent hover:bg-neutral-300"
|
||||
}`}
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className="h-5 w-5"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth="2"
|
||||
d="M12 18.75a6 6 0 0 0 6-6v-1.5m-6 7.5a6 6 0 0 1-6-6v-1.5m6 7.5v3.75m-3.75 0h7.5M12 15.75a3 3 0 0 1-3-3V4.5a3 3 0 1 1 6 0v8.25a3 3 0 0 1-3 3Z"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -1,27 +1,27 @@
|
||||
import type { Metadata } from 'next';
|
||||
import Navbar from './_components/Navbar';
|
||||
import { useSession } from 'next-auth/react';
|
||||
import { redirect } from 'next/navigation';
|
||||
import { getServerSession } from '../api/auth/[...nextauth]/auth';
|
||||
import type { Metadata } from "next";
|
||||
import Navbar from "./_components/Navbar";
|
||||
import { useSession } from "next-auth/react";
|
||||
import { redirect } from "next/navigation";
|
||||
import { getServerSession } from "../api/auth/[...nextauth]/auth";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: 'VAR Leitstelle v2',
|
||||
description: 'Die neue VAR Leitstelle.',
|
||||
title: "VAR Leitstelle v2",
|
||||
description: "Die neue VAR Leitstelle.",
|
||||
};
|
||||
|
||||
export default async function RootLayout({
|
||||
children,
|
||||
children,
|
||||
}: Readonly<{
|
||||
children: React.ReactNode;
|
||||
children: React.ReactNode;
|
||||
}>) {
|
||||
const session = await getServerSession();
|
||||
if (!session) {
|
||||
redirect('/login');
|
||||
}
|
||||
return (
|
||||
<>
|
||||
<Navbar />
|
||||
{children}
|
||||
</>
|
||||
);
|
||||
const session = await getServerSession();
|
||||
if (!session) {
|
||||
redirect("/login");
|
||||
}
|
||||
return (
|
||||
<>
|
||||
<Navbar />
|
||||
{children}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,11 +1,11 @@
|
||||
'use client';
|
||||
import dynamic from 'next/dynamic';
|
||||
const Map = dynamic(() => import('./_components/Map'), { ssr: false });
|
||||
"use client";
|
||||
import dynamic from "next/dynamic";
|
||||
const Map = dynamic(() => import("./_components/Map"), { ssr: false });
|
||||
|
||||
export default () => {
|
||||
return (
|
||||
<div className="relative flex-1">
|
||||
<Map />
|
||||
</div>
|
||||
);
|
||||
return (
|
||||
<div className="relative flex-1">
|
||||
<Map />
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
'use client';
|
||||
"use client";
|
||||
|
||||
import { SessionProvider } from 'next-auth/react';
|
||||
import { Session } from 'next-auth';
|
||||
import { SessionProvider } from "next-auth/react";
|
||||
import { Session } from "next-auth";
|
||||
|
||||
export const NextAuthSessionProvider = ({
|
||||
children,
|
||||
session,
|
||||
children,
|
||||
session,
|
||||
}: {
|
||||
children: React.ReactNode;
|
||||
session: Session | null;
|
||||
children: React.ReactNode;
|
||||
session: Session | null;
|
||||
}) => <SessionProvider session={session}>{children}</SessionProvider>;
|
||||
|
||||
@@ -1,11 +1,11 @@
|
||||
import { create } from "zustand";
|
||||
|
||||
type TalkState = {
|
||||
isTalking: boolean;
|
||||
toggleTalking: () => void;
|
||||
isTalking: boolean;
|
||||
toggleTalking: () => void;
|
||||
};
|
||||
|
||||
export const useTalkStore = create<TalkState>((set) => ({
|
||||
isTalking: false,
|
||||
toggleTalking: () => set((state) => ({ isTalking: !state.isTalking })),
|
||||
}));
|
||||
isTalking: false,
|
||||
toggleTalking: () => set((state) => ({ isTalking: !state.isTalking })),
|
||||
}));
|
||||
|
||||
@@ -1,38 +1,38 @@
|
||||
import type { Metadata } from 'next';
|
||||
import localFont from 'next/font/local';
|
||||
import './globals.css';
|
||||
import { NextAuthSessionProvider } from './_components/AuthSessionProvider';
|
||||
import { getServerSession } from './api/auth/[...nextauth]/auth';
|
||||
import type { Metadata } from "next";
|
||||
import localFont from "next/font/local";
|
||||
import "./globals.css";
|
||||
import { NextAuthSessionProvider } from "./_components/AuthSessionProvider";
|
||||
import { getServerSession } from "./api/auth/[...nextauth]/auth";
|
||||
|
||||
const geistSans = localFont({
|
||||
src: './fonts/GeistVF.woff',
|
||||
variable: '--font-geist-sans',
|
||||
src: "./fonts/GeistVF.woff",
|
||||
variable: "--font-geist-sans",
|
||||
});
|
||||
const geistMono = localFont({
|
||||
src: './fonts/GeistMonoVF.woff',
|
||||
variable: '--font-geist-mono',
|
||||
src: "./fonts/GeistMonoVF.woff",
|
||||
variable: "--font-geist-mono",
|
||||
});
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: 'VAR Leitstelle v2',
|
||||
description: 'Die neue VAR Leitstelle.',
|
||||
title: "VAR Leitstelle v2",
|
||||
description: "Die neue VAR Leitstelle.",
|
||||
};
|
||||
|
||||
export default async function RootLayout({
|
||||
children,
|
||||
children,
|
||||
}: Readonly<{
|
||||
children: React.ReactNode;
|
||||
children: React.ReactNode;
|
||||
}>) {
|
||||
const session = await getServerSession();
|
||||
return (
|
||||
<html lang="de" data-theme="dark">
|
||||
<body
|
||||
className={`${geistSans.variable} ${geistMono.variable} h-screen flex flex-col`}
|
||||
>
|
||||
<NextAuthSessionProvider session={session}>
|
||||
{children}
|
||||
</NextAuthSessionProvider>
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
const session = await getServerSession();
|
||||
return (
|
||||
<html lang="de" data-theme="dark">
|
||||
<body
|
||||
className={`${geistSans.variable} ${geistMono.variable} h-screen flex flex-col`}
|
||||
>
|
||||
<NextAuthSessionProvider session={session}>
|
||||
{children}
|
||||
</NextAuthSessionProvider>
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,188 +1,194 @@
|
||||
.page {
|
||||
--gray-rgb: 0, 0, 0;
|
||||
--gray-alpha-200: rgba(var(--gray-rgb), 0.08);
|
||||
--gray-alpha-100: rgba(var(--gray-rgb), 0.05);
|
||||
--gray-rgb: 0, 0, 0;
|
||||
--gray-alpha-200: rgba(var(--gray-rgb), 0.08);
|
||||
--gray-alpha-100: rgba(var(--gray-rgb), 0.05);
|
||||
|
||||
--button-primary-hover: #383838;
|
||||
--button-secondary-hover: #f2f2f2;
|
||||
--button-primary-hover: #383838;
|
||||
--button-secondary-hover: #f2f2f2;
|
||||
|
||||
display: grid;
|
||||
grid-template-rows: 20px 1fr 20px;
|
||||
align-items: center;
|
||||
justify-items: center;
|
||||
min-height: 100svh;
|
||||
padding: 80px;
|
||||
gap: 64px;
|
||||
font-synthesis: none;
|
||||
display: grid;
|
||||
grid-template-rows: 20px 1fr 20px;
|
||||
align-items: center;
|
||||
justify-items: center;
|
||||
min-height: 100svh;
|
||||
padding: 80px;
|
||||
gap: 64px;
|
||||
font-synthesis: none;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.page {
|
||||
--gray-rgb: 255, 255, 255;
|
||||
--gray-alpha-200: rgba(var(--gray-rgb), 0.145);
|
||||
--gray-alpha-100: rgba(var(--gray-rgb), 0.06);
|
||||
.page {
|
||||
--gray-rgb: 255, 255, 255;
|
||||
--gray-alpha-200: rgba(var(--gray-rgb), 0.145);
|
||||
--gray-alpha-100: rgba(var(--gray-rgb), 0.06);
|
||||
|
||||
--button-primary-hover: #ccc;
|
||||
--button-secondary-hover: #1a1a1a;
|
||||
}
|
||||
--button-primary-hover: #ccc;
|
||||
--button-secondary-hover: #1a1a1a;
|
||||
}
|
||||
}
|
||||
|
||||
.main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 32px;
|
||||
grid-row-start: 2;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 32px;
|
||||
grid-row-start: 2;
|
||||
}
|
||||
|
||||
.main ol {
|
||||
font-family: var(--font-geist-mono);
|
||||
padding-left: 0;
|
||||
margin: 0;
|
||||
font-size: 14px;
|
||||
line-height: 24px;
|
||||
letter-spacing: -0.01em;
|
||||
list-style-position: inside;
|
||||
font-family: var(--font-geist-mono);
|
||||
padding-left: 0;
|
||||
margin: 0;
|
||||
font-size: 14px;
|
||||
line-height: 24px;
|
||||
letter-spacing: -0.01em;
|
||||
list-style-position: inside;
|
||||
}
|
||||
|
||||
.main li:not(:last-of-type) {
|
||||
margin-bottom: 8px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.main code {
|
||||
font-family: inherit;
|
||||
background: var(--gray-alpha-100);
|
||||
padding: 2px 4px;
|
||||
border-radius: 4px;
|
||||
font-weight: 600;
|
||||
font-family: inherit;
|
||||
background: var(--gray-alpha-100);
|
||||
padding: 2px 4px;
|
||||
border-radius: 4px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.ctas {
|
||||
display: flex;
|
||||
gap: 16px;
|
||||
display: flex;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.ctas a {
|
||||
appearance: none;
|
||||
border-radius: 128px;
|
||||
height: 48px;
|
||||
padding: 0 20px;
|
||||
border: none;
|
||||
font-family: var(--font-geist-sans);
|
||||
border: 1px solid transparent;
|
||||
transition: background 0.2s, color 0.2s, border-color 0.2s;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 16px;
|
||||
line-height: 20px;
|
||||
font-weight: 500;
|
||||
appearance: none;
|
||||
border-radius: 128px;
|
||||
height: 48px;
|
||||
padding: 0 20px;
|
||||
border: none;
|
||||
font-family: var(--font-geist-sans);
|
||||
border: 1px solid transparent;
|
||||
transition:
|
||||
background 0.2s,
|
||||
color 0.2s,
|
||||
border-color 0.2s;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 16px;
|
||||
line-height: 20px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
a.primary {
|
||||
background: var(--foreground);
|
||||
color: var(--background);
|
||||
gap: 8px;
|
||||
background: var(--foreground);
|
||||
color: var(--background);
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
a.secondary {
|
||||
border-color: var(--gray-alpha-200);
|
||||
min-width: 180px;
|
||||
border-color: var(--gray-alpha-200);
|
||||
min-width: 180px;
|
||||
}
|
||||
|
||||
button.secondary {
|
||||
appearance: none;
|
||||
border-radius: 128px;
|
||||
height: 48px;
|
||||
padding: 0 20px;
|
||||
border: none;
|
||||
font-family: var(--font-geist-sans);
|
||||
border: 1px solid transparent;
|
||||
transition: background 0.2s, color 0.2s, border-color 0.2s;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 16px;
|
||||
line-height: 20px;
|
||||
font-weight: 500;
|
||||
background: transparent;
|
||||
border-color: var(--gray-alpha-200);
|
||||
min-width: 180px;
|
||||
appearance: none;
|
||||
border-radius: 128px;
|
||||
height: 48px;
|
||||
padding: 0 20px;
|
||||
border: none;
|
||||
font-family: var(--font-geist-sans);
|
||||
border: 1px solid transparent;
|
||||
transition:
|
||||
background 0.2s,
|
||||
color 0.2s,
|
||||
border-color 0.2s;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 16px;
|
||||
line-height: 20px;
|
||||
font-weight: 500;
|
||||
background: transparent;
|
||||
border-color: var(--gray-alpha-200);
|
||||
min-width: 180px;
|
||||
}
|
||||
|
||||
.footer {
|
||||
font-family: var(--font-geist-sans);
|
||||
grid-row-start: 3;
|
||||
display: flex;
|
||||
gap: 24px;
|
||||
font-family: var(--font-geist-sans);
|
||||
grid-row-start: 3;
|
||||
display: flex;
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
.footer a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.footer img {
|
||||
flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* Enable hover only on non-touch devices */
|
||||
@media (hover: hover) and (pointer: fine) {
|
||||
a.primary:hover {
|
||||
background: var(--button-primary-hover);
|
||||
border-color: transparent;
|
||||
}
|
||||
a.primary:hover {
|
||||
background: var(--button-primary-hover);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
a.secondary:hover {
|
||||
background: var(--button-secondary-hover);
|
||||
border-color: transparent;
|
||||
}
|
||||
a.secondary:hover {
|
||||
background: var(--button-secondary-hover);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.footer a:hover {
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 4px;
|
||||
}
|
||||
.footer a:hover {
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.page {
|
||||
padding: 32px;
|
||||
padding-bottom: 80px;
|
||||
}
|
||||
.page {
|
||||
padding: 32px;
|
||||
padding-bottom: 80px;
|
||||
}
|
||||
|
||||
.main {
|
||||
align-items: center;
|
||||
}
|
||||
.main {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.main ol {
|
||||
text-align: center;
|
||||
}
|
||||
.main ol {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.ctas {
|
||||
flex-direction: column;
|
||||
}
|
||||
.ctas {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.ctas a {
|
||||
font-size: 14px;
|
||||
height: 40px;
|
||||
padding: 0 16px;
|
||||
}
|
||||
.ctas a {
|
||||
font-size: 14px;
|
||||
height: 40px;
|
||||
padding: 0 16px;
|
||||
}
|
||||
|
||||
a.secondary {
|
||||
min-width: auto;
|
||||
}
|
||||
a.secondary {
|
||||
min-width: auto;
|
||||
}
|
||||
|
||||
.footer {
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.footer {
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.logo {
|
||||
filter: invert();
|
||||
}
|
||||
.logo {
|
||||
filter: invert();
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user