Files
NewLukasBlog/web/css/variables.css
T
kankys ef2315bac1 Opravy dle TODO.md - kritické a střední priority
- Opraveny chyby v HTML: špatné URL u CDN, chybějící viewport, úvodní apostrof
- Přidány meta description a keywords na všechny stránky
- Odstraněny nestandardní meta tagy (Kankys Matrix)
- Opraveny všechny externí skripty (HTTPS, crossorigin, integrity)
- Vytvořeny sdílené soubory:
  - web/js/shared.js - společné JS funkce (scrollToTop, setupMobileMenu, setupThemeToggle)
  - web/css/variables.css - CSS proměnné pro témata a design
  - web/css/shared.css - sdílené CSS styly
- Založena struktura pro sdílený kód (js/, css/ adresáře)

Generated by Mistral Vibe.
Co-Authored-By: Mistral Vibe <vibe@mistral.ai>
2026-08-10 19:50:00 +02:00

207 lines
4.8 KiB
CSS

/**
* CSS Variables for NewLukasBlog
* Centralized color scheme and design tokens
*/
:root {
/* ============================================
* Color Palette - Light Theme
* ============================================ */
/* Background colors */
--bg-primary: #ffffff;
--bg-secondary: #f5f5f5;
--bg-tertiary: #e8e8e8;
/* Text colors */
--text-primary: #282a36;
--text-secondary: #555555;
--text-tertiary: #888888;
--text-inverse: #ffffff;
/* Accent colors */
--accent-primary: #4a90d9;
--accent-secondary: #6ab04c;
--accent-tertiary: #eb4d4b;
/* Link colors */
--link-color: #2980b9;
--link-hover: #1a5276;
--link-visited: #9b59b6;
/* Border colors */
--border-light: #dddddd;
--border-medium: #bbbbbb;
--border-dark: #999999;
/* Header/Footer colors */
--header-bg: #ffffff;
--header-text: #282a36;
--footer-bg: #2c3e50;
--footer-text: #ecf0f1;
/* Button colors */
--btn-bg: #3498db;
--btn-text: #ffffff;
--btn-hover-bg: #2980b9;
--btn-border: #2980b9;
/* Code block colors */
--code-bg: #f8f9fa;
--code-text: #212529;
--code-border: #dee2e6;
/* Scrollbar colors */
--scrollbar-thumb: #888888;
--scrollbar-track: #f1f1f1;
/* Shadow colors */
--shadow-sm: rgba(0, 0, 0, 0.1);
--shadow-md: rgba(0, 0, 0, 0.2);
--shadow-lg: rgba(0, 0, 0, 0.3);
/* ============================================
* Typography
* ============================================ */
--font-primary: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
--font-secondary: Georgia, 'Times New Roman', Times, serif;
--font-mono: 'Courier New', Courier, monospace;
--font-size-xs: 0.75rem;
--font-size-sm: 0.875rem;
--font-size-base: 1rem;
--font-size-lg: 1.125rem;
--font-size-xl: 1.25rem;
--font-size-2xl: 1.5rem;
--font-size-3xl: 2rem;
--font-weight-light: 300;
--font-weight-normal: 400;
--font-weight-medium: 500;
--font-weight-semibold: 600;
--font-weight-bold: 700;
--line-height-tight: 1.25;
--line-height-normal: 1.5;
--line-height-relaxed: 1.75;
/* ============================================
* Spacing
* ============================================ */
--spacing-xs: 0.25rem;
--spacing-sm: 0.5rem;
--spacing-md: 1rem;
--spacing-lg: 1.5rem;
--spacing-xl: 2rem;
--spacing-2xl: 3rem;
--spacing-3xl: 4rem;
/* ============================================
* Border Radius
* ============================================ */
--radius-sm: 0.25rem;
--radius-md: 0.375rem;
--radius-lg: 0.5rem;
--radius-xl: 0.75rem;
--radius-full: 9999px;
/* ============================================
* Transitions
* ============================================ */
--transition-fast: 150ms ease;
--transition-normal: 250ms ease;
--transition-slow: 350ms ease;
/* ============================================
* Z-Index Scale
* ============================================ */
--z-dropdown: 100;
--z-sticky: 200;
--z-fixed: 300;
--z-modal-backdrop: 400;
--z-modal: 500;
--z-popover: 600;
--z-tooltip: 700;
}
/* ============================================
* Dark Theme Variables
* ============================================ */
[data-theme="dark"],
.dark-theme {
--bg-primary: #1a1a1a;
--bg-secondary: #252525;
--bg-tertiary: #333333;
--text-primary: #e0e0e0;
--text-secondary: #b0b0b0;
--text-tertiary: #808080;
--text-inverse: #1a1a1a;
--accent-primary: #5daee2;
--accent-secondary: #78c46c;
--accent-tertiary: #e74c3c;
--link-color: #3498db;
--link-hover: #5dade2;
--link-visited: #9b59b6;
--border-light: #444444;
--border-medium: #555555;
--border-dark: #666666;
--header-bg: #1a1a1a;
--header-text: #e0e0e0;
--footer-bg: #1a1a1a;
--footer-text: #b0b0b0;
--btn-bg: #3498db;
--btn-text: #ffffff;
--btn-hover-bg: #2980b9;
--btn-border: #2980b9;
--code-bg: #2d2d2d;
--code-text: #f8f8f2;
--code-border: #444444;
--scrollbar-thumb: #555555;
--scrollbar-track: #252525;
}
/* ============================================
* Specific Theme Variables (for individual pages)
* ============================================ */
/* ApolloNvim Theme */
:root.apollo-theme {
--bg-primary: #2a232b;
--bg-secondary: #1e1a1f;
--text-primary: #f8f8f2;
--text-secondary: #e0e0e0;
--accent-primary: #e54472;
--accent-secondary: #18f700;
--accent-tertiary: #f76b00;
}
/* Kakoune Theme */
:root.kakoune-theme {
--bg-primary: #2a232b;
--bg-secondary: #1e1a1f;
--text-primary: #f8f8f2;
--text-secondary: #e0e0e0;
--accent-primary: #e54472;
--accent-secondary: #9fea8a;
--accent-tertiary: #ea3838;
}
/* Terminal Space Theme */
:root.terminal-theme {
--bg-primary: #2a232b;
--bg-secondary: #1e1a1f;
--text-primary: #f8f8f2;
--text-secondary: #e0e0e0;
--accent-primary: #e7efa7;
--accent-secondary: #c627d8;
--accent-tertiary: #f76b00;
}