ImmoSystem24 DS

Ergänzungen

Toggle / Toggle Group
shadcn/ui · toggle + toggle-group
Toggle
Gruppe

Import

import { ToggleGroup, ToggleGroupItem } from "@/components/ui/toggle-group"

Verwendung

  • Ansichts- und Formatumschaltung.
  • Aktiv = Auswahlfläche #EFF6FF.
Kbd
shadcn/ui · kbd
Beispiele
⌘KSuche öffnenEscschließen

Import

import { Kbd, KbdGroup } from "@/components/ui/kbd"

Verwendung

  • Tastenkürzel in Menüs und Hilfe.
Input OTP
shadcn/ui · input-otp

Demo – kein Versand.

Import

import { InputOTP, InputOTPSlot } from "@/components/ui/input-otp"

Verwendung

  • Für Bestätigungscodes; Einfügen wird unterstützt.
Scroll Area
shadcn/ui · scroll-area
  • 01.10.2026 – Zahlungseingang WE 01
  • 02.10.2026 – Zahlungseingang WE 02
  • 03.10.2026 – Zahlungseingang WE 03
  • 04.10.2026 – Zahlungseingang WE 04
  • 05.10.2026 – Zahlungseingang WE 05
  • 06.10.2026 – Zahlungseingang WE 06
  • 07.10.2026 – Zahlungseingang WE 07
  • 08.10.2026 – Zahlungseingang WE 08
  • 09.10.2026 – Zahlungseingang WE 09
  • 10.10.2026 – Zahlungseingang WE 10
  • 11.10.2026 – Zahlungseingang WE 11
  • 12.10.2026 – Zahlungseingang WE 12
  • 13.10.2026 – Zahlungseingang WE 01
  • 14.10.2026 – Zahlungseingang WE 02
  • 15.10.2026 – Zahlungseingang WE 03
  • 16.10.2026 – Zahlungseingang WE 04
  • 17.10.2026 – Zahlungseingang WE 05
  • 18.10.2026 – Zahlungseingang WE 06
  • 19.10.2026 – Zahlungseingang WE 07
  • 20.10.2026 – Zahlungseingang WE 08
  • 21.10.2026 – Zahlungseingang WE 09
  • 22.10.2026 – Zahlungseingang WE 10
  • 23.10.2026 – Zahlungseingang WE 11
  • 24.10.2026 – Zahlungseingang WE 12

Import

import { ScrollArea } from "@/components/ui/scroll-area"

Verwendung

  • Für begrenzte Listen in Karten/Panels.
  • Nicht für die ganze Seite.
Resizable
shadcn/ui · resizable (react-resizable-panels v4)
Objektliste
Details

Import

import { ResizablePanelGroup, ResizablePanel, ResizableHandle } from "@/components/ui/resizable"

Verwendung

  • Liste/Detail-Ansichten am Desktop.
  • Griff per Tastatur (Pfeiltasten) bedienbar.
Aspect Ratio / Carousel
shadcn/ui · aspect-ratio + carousel (embla)
Außenansicht (Platzhalter)
Treppenhaus (Platzhalter)
Wohnzimmer WE 03 (Platzhalter)

Import

import { AspectRatio } … import { Carousel } …

Verwendung

  • Objektfotos in festem Seitenverhältnis 4:3.
  • Carousel mit Pfeiltasten und Buttons.
Made by Loui Augst