Skip to content

layout system

the layout system the Casoon UI Library bietet a umfassendes Rahmenwerk for the Erstellung responsiver, konsistenter and anpassungsfahiger layouts for moderne Webanwendungen.

Overview

the layout system umfasst several leistungsstarke Technologien and Ansatze:

  • Grid system: Flexibles and responsives CSS-Grid system
  • Flexbox system: Fortschrittliches Flexbox-layout for eindimensionale Anordnungen
  • containers system: Einheitliche containers for konsistente Content-areas
  • Responsive layout: Strategien for the Anpassung on verschiedene Bildschirmgrossen
  • Spacing: Konsistentes Spacing-system for Abstande and Rander

Prinzipien

the layout system basiert on folgenden Prinzipien:

  1. Responsivitat: Nahtlose Anpassung on verschiedene Gerate and Bildschirmgrossen
  2. Consistency: Einheitliche Abstande and Proportionen
  3. Flexibility: Anpassbar on unterschiedliche Anforderungen
  4. Accessibility: Berucksichtigung from Accessibility
  5. containers Queries: Usage moderner CSS-Techniken for kontextabhangige layouts

Usage

the layout system kann as Teil des Core-Imports or einzeln eingebunden become:

css
/* as Teil des Core-Imports */
@import '@casoon/ui-lib/core.css';

/* or individuell */
@import '@casoon/ui-lib/layout.css';

Further Topics