612 lines
27 KiB
PHP
612 lines
27 KiB
PHP
<html lang="de" dir="ltr" class="fi">
|
|
|
|
<head>
|
|
|
|
|
|
<meta charset="utf-8">
|
|
<meta name="csrf-token" content="Vc1BYBrbgKmVAES1sHttXJ2sKIGBOYPDvJAOpJOj">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
|
<link rel="icon" href="http://nutzwerte_fi4.test/images/favicon.svg">
|
|
|
|
|
|
<title>
|
|
Anmelden - Nutzwerte
|
|
</title>
|
|
|
|
|
|
|
|
<style>
|
|
[x-cloak=''],
|
|
[x-cloak='x-cloak'],
|
|
[x-cloak='1'] {
|
|
display: none !important;
|
|
}
|
|
|
|
[x-cloak='inline-flex'] {
|
|
display: inline-flex !important;
|
|
}
|
|
|
|
@media (max-width: 1023px) {
|
|
[x-cloak='-lg'] {
|
|
display: none !important;
|
|
}
|
|
}
|
|
|
|
@media (min-width: 1024px) {
|
|
[x-cloak='lg'] {
|
|
display: none !important;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<link href="http://nutzwerte_fi4.test/css/swisnl/filament-backgrounds/filament-backgrounds-styles.css?v=2.0.0.0"
|
|
rel="stylesheet" data-navigate-track="">
|
|
<link href="http://nutzwerte_fi4.test/fonts/filament/filament/inter/index.css?v=4.0.8.0" rel="stylesheet"
|
|
data-navigate-track="">
|
|
|
|
<style>
|
|
:root {
|
|
--filament-backgrounds-image: url("http://nutzwerte_fi4.test/images/backgrounds/bg1.jpg");
|
|
--danger-50: oklch(0.971 0.013 17.38);
|
|
--danger-100: oklch(0.936 0.032 17.717);
|
|
--danger-200: oklch(0.885 0.062 18.334);
|
|
--danger-300: oklch(0.808 0.114 19.571);
|
|
--danger-400: oklch(0.704 0.191 22.216);
|
|
--danger-500: oklch(0.637 0.237 25.331);
|
|
--danger-600: oklch(0.577 0.245 27.325);
|
|
--danger-700: oklch(0.505 0.213 27.518);
|
|
--danger-800: oklch(0.444 0.177 26.899);
|
|
--danger-900: oklch(0.396 0.141 25.723);
|
|
--danger-950: oklch(0.258 0.092 26.042);
|
|
--gray-50: oklch(0.985 0 0);
|
|
--gray-100: oklch(0.967 0.001 286.375);
|
|
--gray-200: oklch(0.92 0.004 286.32);
|
|
--gray-300: oklch(0.871 0.006 286.286);
|
|
--gray-400: oklch(0.705 0.015 286.067);
|
|
--gray-500: oklch(0.552 0.016 285.938);
|
|
--gray-600: oklch(0.442 0.017 285.786);
|
|
--gray-700: oklch(0.37 0.013 285.805);
|
|
--gray-800: oklch(0.274 0.006 286.033);
|
|
--gray-900: oklch(0.21 0.006 285.885);
|
|
--gray-950: oklch(0.141 0.005 285.823);
|
|
--info-50: oklch(0.97 0.014 254.604);
|
|
--info-100: oklch(0.932 0.032 255.585);
|
|
--info-200: oklch(0.882 0.059 254.128);
|
|
--info-300: oklch(0.809 0.105 251.813);
|
|
--info-400: oklch(0.707 0.165 254.624);
|
|
--info-500: oklch(0.623 0.214 259.815);
|
|
--info-600: oklch(0.546 0.245 262.881);
|
|
--info-700: oklch(0.488 0.243 264.376);
|
|
--info-800: oklch(0.424 0.199 265.638);
|
|
--info-900: oklch(0.379 0.146 265.522);
|
|
--info-950: oklch(0.282 0.091 267.935);
|
|
--amber-50: oklch(0.985 0.002 247.839);
|
|
--amber-100: oklch(0.967 0.003 264.542);
|
|
--amber-200: oklch(0.928 0.006 264.531);
|
|
--amber-300: oklch(0.872 0.01 258.338);
|
|
--amber-400: oklch(0.707 0.022 261.325);
|
|
--amber-500: oklch(0.551 0.027 264.364);
|
|
--amber-600: oklch(0.446 0.03 256.802);
|
|
--amber-700: oklch(0.373 0.034 259.733);
|
|
--amber-800: oklch(0.278 0.033 256.848);
|
|
--amber-900: oklch(0.21 0.034 264.665);
|
|
--amber-950: oklch(0.13 0.028 261.692);
|
|
--success-50: oklch(0.982 0.018 155.826);
|
|
--success-100: oklch(0.962 0.044 156.743);
|
|
--success-200: oklch(0.925 0.084 155.995);
|
|
--success-300: oklch(0.871 0.15 154.449);
|
|
--success-400: oklch(0.792 0.209 151.711);
|
|
--success-500: oklch(0.723 0.219 149.579);
|
|
--success-600: oklch(0.627 0.194 149.214);
|
|
--success-700: oklch(0.527 0.154 150.069);
|
|
--success-800: oklch(0.448 0.119 151.328);
|
|
--success-900: oklch(0.393 0.095 152.535);
|
|
--success-950: oklch(0.266 0.065 152.934);
|
|
--warning-50: oklch(0.987 0.022 95.277);
|
|
--warning-100: oklch(0.962 0.059 95.617);
|
|
--warning-200: oklch(0.924 0.12 95.746);
|
|
--warning-300: oklch(0.879 0.169 91.605);
|
|
--warning-400: oklch(0.828 0.189 84.429);
|
|
--warning-500: oklch(0.769 0.188 70.08);
|
|
--warning-600: oklch(0.666 0.179 58.318);
|
|
--warning-700: oklch(0.555 0.163 48.998);
|
|
--warning-800: oklch(0.473 0.137 46.201);
|
|
--warning-900: oklch(0.414 0.112 45.904);
|
|
--warning-950: oklch(0.279 0.077 45.635);
|
|
--secondary-50: oklch(0.962 0.018 272.314);
|
|
--secondary-100: oklch(0.93 0.034 272.788);
|
|
--secondary-200: oklch(0.87 0.065 274.039);
|
|
--secondary-300: oklch(0.785 0.115 274.713);
|
|
--secondary-400: oklch(0.673 0.182 276.935);
|
|
--secondary-500: oklch(0.585 0.233 277.117);
|
|
--secondary-600: oklch(0.511 0.262 276.966);
|
|
--secondary-700: oklch(0.457 0.24 277.023);
|
|
--secondary-800: oklch(0.398 0.195 277.366);
|
|
--secondary-900: oklch(0.359 0.144 278.697);
|
|
--secondary-950: oklch(0.257 0.09 281.288);
|
|
}
|
|
|
|
.fi-color-secondary {
|
|
--color-50: var(--secondary-50);
|
|
--color-100: var(--secondary-100);
|
|
--color-200: var(--secondary-200);
|
|
--color-300: var(--secondary-300);
|
|
--color-400: var(--secondary-400);
|
|
--color-500: var(--secondary-500);
|
|
--color-600: var(--secondary-600);
|
|
--color-700: var(--secondary-700);
|
|
--color-800: var(--secondary-800);
|
|
--color-900: var(--secondary-900);
|
|
--color-950: var(--secondary-950);
|
|
}
|
|
</style>
|
|
|
|
<link rel="stylesheet" href="http://[::1]:5173/resources/css/filament/admin/theme.css" data-navigate-track="reload">
|
|
|
|
|
|
|
|
|
|
<style>
|
|
:root {
|
|
--font-family: 'Inter Variable';
|
|
--mono-font-family: 'ui-monospace';
|
|
--serif-font-family: 'ui-serif';
|
|
--sidebar-width: 20rem;
|
|
--collapsed-sidebar-width: 4.5rem;
|
|
--default-theme-mode: system;
|
|
}
|
|
</style>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
const loadDarkMode = () => {
|
|
window.theme = localStorage.getItem('theme') ?? 'system'
|
|
if (
|
|
window.theme === 'dark' ||
|
|
(window.theme === 'system' &&
|
|
window.matchMedia('(prefers-color-scheme: dark)')
|
|
.matches)
|
|
) {
|
|
document.documentElement.classList.add('dark')
|
|
}
|
|
}
|
|
|
|
loadDarkMode()
|
|
|
|
document.addEventListener('livewire:navigated', loadDarkMode)
|
|
</script>
|
|
|
|
|
|
<!-- Livewire Styles -->
|
|
<style>
|
|
[wire\:loading][wire\:loading],
|
|
[wire\:loading\.delay][wire\:loading\.delay],
|
|
[wire\:loading\.inline-block][wire\:loading\.inline-block],
|
|
[wire\:loading\.inline][wire\:loading\.inline],
|
|
[wire\:loading\.block][wire\:loading\.block],
|
|
[wire\:loading\.flex][wire\:loading\.flex],
|
|
[wire\:loading\.table][wire\:loading\.table],
|
|
[wire\:loading\.grid][wire\:loading\.grid],
|
|
[wire\:loading\.inline-flex][wire\:loading\.inline-flex] {
|
|
display: none;
|
|
}
|
|
|
|
[wire\:loading\.delay\.none][wire\:loading\.delay\.none],
|
|
[wire\:loading\.delay\.shortest][wire\:loading\.delay\.shortest],
|
|
[wire\:loading\.delay\.shorter][wire\:loading\.delay\.shorter],
|
|
[wire\:loading\.delay\.short][wire\:loading\.delay\.short],
|
|
[wire\:loading\.delay\.default][wire\:loading\.delay\.default],
|
|
[wire\:loading\.delay\.long][wire\:loading\.delay\.long],
|
|
[wire\:loading\.delay\.longer][wire\:loading\.delay\.longer],
|
|
[wire\:loading\.delay\.longest][wire\:loading\.delay\.longest] {
|
|
display: none;
|
|
}
|
|
|
|
[wire\:offline][wire\:offline] {
|
|
display: none;
|
|
}
|
|
|
|
[wire\:dirty]:not(textarea):not(input):not(select) {
|
|
display: none;
|
|
}
|
|
|
|
:root {
|
|
--livewire-progress-bar-color: #2299dd;
|
|
}
|
|
|
|
[x-cloak] {
|
|
display: none !important;
|
|
}
|
|
|
|
[wire\:cloak] {
|
|
display: none !important;
|
|
}
|
|
</style>
|
|
<style>
|
|
/* Make clicks pass-through */
|
|
|
|
#nprogress {
|
|
pointer-events: none;
|
|
}
|
|
|
|
#nprogress .bar {
|
|
background: var(--livewire-progress-bar-color, #29d);
|
|
|
|
position: fixed;
|
|
z-index: 1031;
|
|
top: 0;
|
|
left: 0;
|
|
|
|
width: 100%;
|
|
height: 2px;
|
|
}
|
|
|
|
/* Fancy blur effect */
|
|
#nprogress .peg {
|
|
display: block;
|
|
position: absolute;
|
|
right: 0px;
|
|
width: 100px;
|
|
height: 100%;
|
|
box-shadow: 0 0 10px var(--livewire-progress-bar-color, #29d), 0 0 5px var(--livewire-progress-bar-color, #29d);
|
|
opacity: 1.0;
|
|
|
|
-webkit-transform: rotate(3deg) translate(0px, -4px);
|
|
-ms-transform: rotate(3deg) translate(0px, -4px);
|
|
transform: rotate(3deg) translate(0px, -4px);
|
|
}
|
|
|
|
/* Remove these to get rid of the spinner */
|
|
#nprogress .spinner {
|
|
display: block;
|
|
position: fixed;
|
|
z-index: 1031;
|
|
top: 15px;
|
|
right: 15px;
|
|
}
|
|
|
|
#nprogress .spinner-icon {
|
|
width: 18px;
|
|
height: 18px;
|
|
box-sizing: border-box;
|
|
|
|
border: solid 2px transparent;
|
|
border-top-color: var(--livewire-progress-bar-color, #29d);
|
|
border-left-color: var(--livewire-progress-bar-color, #29d);
|
|
border-radius: 50%;
|
|
|
|
-webkit-animation: nprogress-spinner 400ms linear infinite;
|
|
animation: nprogress-spinner 400ms linear infinite;
|
|
}
|
|
|
|
.nprogress-custom-parent {
|
|
overflow: hidden;
|
|
position: relative;
|
|
}
|
|
|
|
.nprogress-custom-parent #nprogress .spinner,
|
|
.nprogress-custom-parent #nprogress .bar {
|
|
position: absolute;
|
|
}
|
|
|
|
@-webkit-keyframes nprogress-spinner {
|
|
0% {
|
|
-webkit-transform: rotate(0deg);
|
|
}
|
|
|
|
100% {
|
|
-webkit-transform: rotate(360deg);
|
|
}
|
|
}
|
|
|
|
@keyframes nprogress-spinner {
|
|
0% {
|
|
transform: rotate(0deg);
|
|
}
|
|
|
|
100% {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body class="fi-body fi-panel-admin">
|
|
|
|
|
|
<div class="fi-simple-layout">
|
|
|
|
|
|
|
|
<div class="fi-simple-main-ctn">
|
|
<main class="fi-simple-main fi-width-2xl">
|
|
<div class="fi-simple-page-content">
|
|
<header class="fi-simple-header">
|
|
<div style="height: 2.6rem;" class="fi-logo">
|
|
<a class="flex gap-1 justify-center" href="/">
|
|
<div class="w-6 pt-0.5">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"
|
|
stroke="currentColor" stroke-width="2" stroke-linecap="round"
|
|
stroke-linejoin="round" class="lucide lucide-aperture-icon lucide-aperture">
|
|
<circle cx="12" cy="12" r="10"></circle>
|
|
<path d="m14.31 8 5.74 9.94"></path>
|
|
<path d="M9.69 8h11.48"></path>
|
|
<path d="m7.38 12 5.74-9.94"></path>
|
|
<path d="M9.69 16 3.95 6.06"></path>
|
|
<path d="M14.31 16H2.83"></path>
|
|
<path d="m16.62 12-5.74 9.94"></path>
|
|
</svg>
|
|
</div>
|
|
<div
|
|
class="text-2xl leading-none font-black tracking-tighter text-shadow-md dark:text-shadow-none">
|
|
nutzwerte.at
|
|
<div class="text-xs font-light">Software für Architekten</div>
|
|
</div>
|
|
</a>
|
|
|
|
</div>
|
|
|
|
</header>
|
|
<div class="text-center mx-auto fi-simple-header-heading x">
|
|
Die Nutzwertberechnung
|
|
</div>
|
|
<div class=" text-gray-700 dark:text-gray-200">
|
|
<p class="text-muted-foreground text-xl leading-7 indent-10">
|
|
oft auch als Parifizierung bezeichnet, ist ein Gutachten im
|
|
österreichischen
|
|
Wohnungseigentumsrecht, das das Verhältnis der einzelnen Eigentumsanteile innerhalb eines
|
|
Gebäudes
|
|
bestimmt.
|
|
</p>
|
|
<p class="leading-7 [&:not(:first-child)] indent-10">
|
|
Sie bildet die Grundlage für die Berechnung der Betriebs- und Instandhaltungskosten sowie
|
|
für das Stimmrecht der Miteigentümer und ist für die Begründung von Wohnungseigentum
|
|
notwendig.
|
|
</p>
|
|
<p class="leading-7 [&:not(:first-child)] indent-10">
|
|
Der Nutzwert wird aus der Nutzfläche ermittelt und durch Zu- oder Abschläge an die
|
|
individuellen
|
|
Wertmerkmale der einzelnen Wohnungen (z.B. Lage, Balkon) angepasst.
|
|
Was ist ein Nutzwertgutachten bzw. eine Parifizierung?
|
|
</p>
|
|
<h2
|
|
class="mt-10 scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight transition-colors first:mt-0">
|
|
Bestimmung der Eigentumsverhältnisse:
|
|
</h2>
|
|
<p class="leading-7 indent-10">
|
|
Die Parifizierung legt fest, wie sich ein Gebäude in seine einzelnen Eigentumsobjekte
|
|
(Wohnungen,
|
|
Geschäftsräumlichkeiten) aufteilt.
|
|
</p>
|
|
<h2
|
|
class="mt-10 scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight transition-colors first:mt-0">
|
|
Wie wird der Nutzwert berechnet?
|
|
</h2>
|
|
<h3 class="mt-8 scroll-m-20 text-2xl font-semibold tracking-tight">
|
|
Berechnung der Anteile:
|
|
</h3>
|
|
<p class="leading-7 indent-10">
|
|
Sie berechnet das Verhältnis der Größe einer einzelnen Wohnung zur Gesamtgröße des Objekts.
|
|
Diese
|
|
Anteile werden als "Mindestanteile" im Grundbuch eingetragen.
|
|
Grundlage für Kosten und Stimmrechte:
|
|
Auf Basis der Nutzwertanteile wird festgelegt, wer wie viele Betriebskosten und
|
|
Instandhaltungsbeiträge zahlen muss und wie viele Stimmrechte die einzelnen Eigentümer bei
|
|
Eigentümerversammlungen haben.
|
|
</p>
|
|
<p class="leading-7 indent-10">
|
|
Basis für Wohnungseigentumsverträge:
|
|
Die Parifizierung ist die Grundlage für die Wohnungseigentumsverträge, die alle Eigentümer
|
|
unterzeichnen müssen.
|
|
</p>
|
|
<h3 class="mt-8 scroll-m-20 text-2xl font-semibold tracking-tight">
|
|
1. Ermittlung der Nutzfläche:
|
|
</h3>
|
|
<p class="leading-7 indent-10">
|
|
Der erste Schritt ist die Ermittlung der Nutzfläche, die die gesamte Bodenfläche der Wohnung
|
|
abzüglich Wandstärken und ähnlichem umfasst.
|
|
</p>
|
|
<h3 class="mt-8 scroll-m-20 text-2xl font-semibold tracking-tight">
|
|
2. Bewertung von Zu- und Abschlägen:
|
|
</h3>
|
|
<p class="leading-7 indent-10">
|
|
Anschließend werden die Nutzfläche und der sogenannte "Richtnutzwert" (ein fester Wert für
|
|
die
|
|
Wohnung) durch Zu- oder Abschläge angepasst.
|
|
</p>
|
|
<h3 class="mt-8 scroll-m-20 text-2xl font-semibold tracking-tight">
|
|
3. Berücksichtigung wertrelevanter Faktoren:
|
|
</h3>
|
|
<p class="leading-7 indent-10">
|
|
Werterhöhend: Lage im Haus (mittlere Geschosse), Balkone, Terrassen, Grünflächen.
|
|
|
|
Wertmindernd: Erdgeschosswohnungen, ungünstige Lage (z.B. Nordlage), schlechte
|
|
Grundrissgestaltung.
|
|
</p>
|
|
|
|
<h3 class="mt-8 scroll-m-20 text-2xl font-semibold tracking-tight">
|
|
4. Professionelle Erstellung:
|
|
</h3>
|
|
<p class="leading-7 indent-10">
|
|
Die Erstellung eines Nutzwertgutachtens erfolgt durch einen befugten Ingenieurkonsulenten
|
|
für
|
|
Vermessungswesen (Zivilgeometer) und einen Sachverständigen für Hochbau.
|
|
</p>
|
|
|
|
<h2
|
|
class="mt-10 scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight transition-colors first:mt-0">
|
|
Wann wird eine Nutzwertberechnung benötigt?
|
|
</h2>
|
|
|
|
<h3 class="mt-8 scroll-m-20 text-2xl font-semibold tracking-tight">
|
|
Begründung von Wohnungseigentum:
|
|
</h3>
|
|
|
|
<p class="leading-7 indent-10">
|
|
Die Parifizierung ist notwendig, wenn ein Gebäude in einzelne Eigentumsobjekte aufgeteilt
|
|
und diese
|
|
als Wohnungseigentum begründet werden sollen.
|
|
</p>
|
|
|
|
<h3 class="mt-8 scroll-m-20 text-2xl font-semibold tracking-tight">
|
|
Analyse bestehender Immobilien:
|
|
</h3>
|
|
|
|
<p class="leading-7 indent-10">
|
|
Sie kann zur Analyse der Verteilung von Kosten und Stimmrechten in einer bestehenden
|
|
Eigentümergemeinschaft durchgeführt werden.
|
|
</p>
|
|
</div>
|
|
|
|
|
|
<div class="mt-5 flex justify-center gap-3">
|
|
<a href="/"
|
|
class="w-full text-center sm:w-40 px-4 py-3 rounded font-semibold text-md bg-slate-500 text-white border-2 border-slate-500">
|
|
Home
|
|
</a>
|
|
<a href="/app"
|
|
class="w-full text-center sm:w-40 px-4 py-3 rounded font-semibold text-md bg-amber-500 text-white border-2 border-amber-500">
|
|
Anmelden
|
|
</a>
|
|
<a href="/app/register"
|
|
class="w-full text-center sm:w-40 px-4 py-3 rounded font-semibold text-md bg-white text-amber-500 border border-slate-300">
|
|
Konto eröffnen
|
|
</a>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
|
|
@include('footer');
|
|
|
|
</div>
|
|
|
|
<div wire:snapshot="{"data":{"isFilamentNotificationsComponent":true,"notifications":[[],{"class":"Filament\\Notifications\\Collection","s":"wrbl"}]},"memo":{"id":"1dMHz2ukDU8QDfO3JmPZ","name":"filament.livewire.notifications","path":"app\/login","method":"GET","children":[],"scripts":[],"assets":[],"errors":[],"locale":"de"},"checksum":"a664db8a2c946b6eff2223314e480f389fa388ee0cab48f8af24bdda8ac520d0"}"
|
|
wire:effects="{"partials":[],"listeners":["notificationsSent","notificationSent","notificationClosed"]}"
|
|
wire:id="1dMHz2ukDU8QDfO3JmPZ">
|
|
<div class="fi-no fi-align-right fi-vertical-align-start" role="status">
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<script>
|
|
window.filamentData = []
|
|
</script>
|
|
|
|
|
|
<script src="http://nutzwerte_fi4.test/js/filament/actions/actions.js?v=4.0.8.0"></script>
|
|
|
|
|
|
<script src="http://nutzwerte_fi4.test/js/filament/notifications/notifications.js?v=4.0.8.0"></script>
|
|
|
|
|
|
<script src="http://nutzwerte_fi4.test/js/filament/schemas/schemas.js?v=4.0.8.0"></script>
|
|
|
|
|
|
<script src="http://nutzwerte_fi4.test/js/filament/support/support.js?v=4.0.8.0"></script>
|
|
|
|
|
|
<script src="http://nutzwerte_fi4.test/js/filament/tables/tables.js?v=4.0.8.0"></script>
|
|
|
|
|
|
<script src="http://nutzwerte_fi4.test/js/filament/filament/echo.js?v=4.0.8.0"></script>
|
|
|
|
|
|
<script src="http://nutzwerte_fi4.test/js/filament/filament/app.js?v=4.0.8.0"></script>
|
|
|
|
|
|
<style>
|
|
:root {}
|
|
</style>
|
|
|
|
|
|
<script>
|
|
loadDarkMode()
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<div class="fixed w-full flex p-4 z-40 auth-theme-switcher top-0 justify-center">
|
|
<div class="rounded-lg bg-gray-50 dark:bg-gray-950">
|
|
<div x-data="{
|
|
theme: null,
|
|
|
|
init: function() {
|
|
this.theme = localStorage.getItem('theme') || 'system'
|
|
|
|
$dispatch('theme-changed', theme)
|
|
|
|
$watch('theme', (theme) => {
|
|
$dispatch('theme-changed', theme)
|
|
})
|
|
},
|
|
}" class="fi-theme-switcher grid grid-flow-col gap-x-1">
|
|
<button aria-label="Light Mode einschalten" type="button"
|
|
x-bind:class="theme === 'light' ? 'bg-gray-50 text-amber-500 dark:bg-white/5 dark:text-amber-400' :
|
|
'text-gray-400 hover:text-gray-500 focus:text-gray-500 dark:text-gray-500 dark:hover:text-gray-400 dark:focus:text-gray-400'"
|
|
x-on:click="(theme = 'light')"
|
|
x-tooltip="{
|
|
content: 'Light Mode einschalten',
|
|
theme: $store.theme,
|
|
}"
|
|
class="flex justify-center rounded-lg p-2 outline-none transition duration-75 hover:bg-gray-50 focus:bg-gray-50 dark:hover:bg-white/5 dark:focus:bg-white/5 bg-gray-50 text-amber-500 dark:bg-white/5 dark:text-amber-400">
|
|
<svg class="fi-icon fi-size-md h-5 w-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"
|
|
fill="currentColor" aria-hidden="true" data-slot="icon">
|
|
<path
|
|
d="M10 2a.75.75 0 0 1 .75.75v1.5a.75.75 0 0 1-1.5 0v-1.5A.75.75 0 0 1 10 2ZM10 15a.75.75 0 0 1 .75.75v1.5a.75.75 0 0 1-1.5 0v-1.5A.75.75 0 0 1 10 15ZM10 7a3 3 0 1 0 0 6 3 3 0 0 0 0-6ZM15.657 5.404a.75.75 0 1 0-1.06-1.06l-1.061 1.06a.75.75 0 0 0 1.06 1.06l1.06-1.06ZM6.464 14.596a.75.75 0 1 0-1.06-1.06l-1.06 1.06a.75.75 0 0 0 1.06 1.06l1.06-1.06ZM18 10a.75.75 0 0 1-.75.75h-1.5a.75.75 0 0 1 0-1.5h1.5A.75.75 0 0 1 18 10ZM5 10a.75.75 0 0 1-.75.75h-1.5a.75.75 0 0 1 0-1.5h1.5A.75.75 0 0 1 5 10ZM14.596 15.657a.75.75 0 0 0 1.06-1.06l-1.06-1.061a.75.75 0 1 0-1.06 1.06l1.06 1.06ZM5.404 6.464a.75.75 0 0 0 1.06-1.06l-1.06-1.06a.75.75 0 1 0-1.061 1.06l1.06 1.06Z">
|
|
</path>
|
|
</svg>
|
|
</button>
|
|
|
|
<button aria-label="Dark Mode einschalten" type="button"
|
|
x-bind:class="theme === 'dark' ? 'bg-gray-50 text-amber-500 dark:bg-white/5 dark:text-amber-400' :
|
|
'text-gray-400 hover:text-gray-500 focus:text-gray-500 dark:text-gray-500 dark:hover:text-gray-400 dark:focus:text-gray-400'"
|
|
x-on:click="(theme = 'dark')"
|
|
x-tooltip="{
|
|
content: 'Dark Mode einschalten',
|
|
theme: $store.theme,
|
|
}"
|
|
class="flex justify-center rounded-lg p-2 outline-none transition duration-75 hover:bg-gray-50 focus:bg-gray-50 dark:hover:bg-white/5 dark:focus:bg-white/5 text-gray-400 hover:text-gray-500 focus:text-gray-500 dark:text-gray-500 dark:hover:text-gray-400 dark:focus:text-gray-400">
|
|
<svg class="fi-icon fi-size-md h-5 w-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"
|
|
fill="currentColor" aria-hidden="true" data-slot="icon">
|
|
<path fill-rule="evenodd"
|
|
d="M7.455 2.004a.75.75 0 0 1 .26.77 7 7 0 0 0 9.958 7.967.75.75 0 0 1 1.067.853A8.5 8.5 0 1 1 6.647 1.921a.75.75 0 0 1 .808.083Z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
</button>
|
|
|
|
<button aria-label="Systemthema benutzen" type="button"
|
|
x-bind:class="theme === 'system' ? 'bg-gray-50 text-amber-500 dark:bg-white/5 dark:text-amber-400' :
|
|
'text-gray-400 hover:text-gray-500 focus:text-gray-500 dark:text-gray-500 dark:hover:text-gray-400 dark:focus:text-gray-400'"
|
|
x-on:click="(theme = 'system')"
|
|
x-tooltip="{
|
|
content: 'Systemthema benutzen',
|
|
theme: $store.theme,
|
|
}"
|
|
class="flex justify-center rounded-lg p-2 outline-none transition duration-75 hover:bg-gray-50 focus:bg-gray-50 dark:hover:bg-white/5 dark:focus:bg-white/5 text-gray-400 hover:text-gray-500 focus:text-gray-500 dark:text-gray-500 dark:hover:text-gray-400 dark:focus:text-gray-400">
|
|
<svg class="fi-icon fi-size-md h-5 w-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"
|
|
fill="currentColor" aria-hidden="true" data-slot="icon">
|
|
<path fill-rule="evenodd"
|
|
d="M2 4.25A2.25 2.25 0 0 1 4.25 2h11.5A2.25 2.25 0 0 1 18 4.25v8.5A2.25 2.25 0 0 1 15.75 15h-3.105a3.501 3.501 0 0 0 1.1 1.677A.75.75 0 0 1 13.26 18H6.74a.75.75 0 0 1-.484-1.323A3.501 3.501 0 0 0 7.355 15H4.25A2.25 2.25 0 0 1 2 12.75v-8.5Zm1.5 0a.75.75 0 0 1 .75-.75h11.5a.75.75 0 0 1 .75.75v7.5a.75.75 0 0 1-.75.75H4.25a.75.75 0 0 1-.75-.75v-7.5Z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!-- Livewire Scripts -->
|
|
<script src="/livewire/livewire.js?id=df3a17f2" data-csrf="Vc1BYBrbgKmVAES1sHttXJ2sKIGBOYPDvJAOpJOj"
|
|
data-update-uri="/livewire/update" data-navigate-once="true"></script>
|
|
|
|
|
|
</body>
|
|
|
|
</html>
|