Refine design with modern UI elements and typography
This commit is contained in:
@@ -9,20 +9,41 @@
|
||||
// Hier können alle Variablen notiert werden, die nur Auswirkungen auf dieses Theme haben
|
||||
// -------------------Beginn eigene Variablen----------------------------------
|
||||
|
||||
$footer-color: #FFFFFF !default;
|
||||
$footer-bg-color: #2E3740 !default;
|
||||
$header-color: #000000 !default;
|
||||
$header-bg-color: #FFFFFF !default;
|
||||
$copyright-bg-color: #2E3740 !default;
|
||||
//$headings-color: #FFFFFF !default;
|
||||
// --- Typografie (Modern & Elegant für ein Stoffgeschäft) ---
|
||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=Playfair+Display:ital,wght@0,400;0,600;0,700;1,400&display=swap');
|
||||
|
||||
$font-family-sans-serif: 'Inter', sans-serif !default;
|
||||
$headings-font-family: 'Playfair Display', serif !default;
|
||||
$headings-font-weight: 600 !default;
|
||||
|
||||
// --- Farben ---
|
||||
$primary: #2c8d2e !default; // Das gewünschte Grün für Kauf-Buttons
|
||||
$secondary: #d4a373 !default; // Ein warmer, erdiger Ton (passt zu Stoffen/Holz)
|
||||
$body-bg: #f9f8f6 !default; // Ein sehr sanftes Creme/Beige als Hintergrund ("Leinwand")
|
||||
$body-color: #333333 !default;
|
||||
|
||||
$footer-color: #FFFFFF !default;
|
||||
$footer-bg-color: #2E3740 !default;
|
||||
$header-color: #000000 !default;
|
||||
$header-bg-color: #FFFFFF !default;
|
||||
$copyright-bg-color: #1a2026 !default; // Etwas dunkler als der Footer für Tiefe
|
||||
|
||||
$white: #ffffff !default;
|
||||
$black: #000000 !default;
|
||||
|
||||
$transition-base-duration: .8s !default;
|
||||
$transition-base-timing: ease !default;
|
||||
// --- UI Elemente (Rundungen & Schatten für einen modernen Look) ---
|
||||
$enable-shadows: true !default;
|
||||
$border-radius: 12px !default;
|
||||
$border-radius-lg: 15px !default;
|
||||
$border-radius-sm: 8px !default;
|
||||
$box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !default;
|
||||
$box-shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.04) !default;
|
||||
|
||||
// --- Animationen ---
|
||||
$transition-base-duration: 0.3s !default;
|
||||
$transition-base-timing: ease-in-out !default;
|
||||
$transition-base: all $transition-base-duration $transition-base-timing !default;
|
||||
$transition-fade: opacity .35s linear !default;
|
||||
$transition-fade: opacity .3s linear !default;
|
||||
|
||||
// -------------------Ende eigene Variablen----------------------------------
|
||||
|
||||
|
||||
Reference in New Issue
Block a user