@unimatrix-01/create-borg-ui/dist/templates/vite-react-ts/src/index.css

Borg UI - A modern React component library

/* 1. Import Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;600;700&display=swap');

/* 2. Import Tailwind's styles */
@tailwind base;
@tailwind components;
@tailwind utilities;

/* 3. Define your CSS Custom Properties (Source of Truth) */
:root {
    font-family: 'Orbitron', system-ui, Avenir, Helvetica, Arial, sans-serif;
    font-weight: 700;
    line-height: 1.5;

    color-scheme: dark;

    /* Light theme variables */
    --background-default: #ffffff;
    --background-elevated: #f5f5f5;
    --border-default: #e0e0e0;
    --content-primary: #1a1a1a;
    --content-secondary: #666666;
    --interactive-accentfocus: #0066cc;
    --status-error: #dc2626;
    --status-info: #3b82f6;
    --status-warning: #f59e0b;
    --surface-default: #ffffff;
    --text-light: #ffffff;
    --text-background-default: #1a1a1a;
    --text-dark: #1a1a1a;

    /* Other global settings */
    font-synthesis: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

@media (prefers-color-scheme: dark) {
    :root {
        /* Dark theme variables */
        --background-default: #1a1a1a;
        --background-elevated: #2d2d2d;
        --border-default: #404040;
        --content-primary: #ffffff;
        --content-secondary: #a3a3a3;
        --interactive-accentfocus: #3b82f6;
        --status-error: #ef4444;
        --status-info: #60a5fa;
        --status-warning: #fbbf24;
        --surface-default: #1a1a1a;
        --text-light: #ffffff;
        --text-background-default: #ffffff;
        --text-dark: #1a1a1a;
    }
}

body {
    margin: 0;
    padding: 0;
    min-width: 320px;
    min-height: 100vh;
    background-color: var(--background-default);
    color: var(--content-primary);
    font-family: 'Orbitron', sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Orbitron', sans-serif;
    font-weight: 700;
    color: var(--content-primary);
}

section {
    margin-top: 1.5rem;
}

/* Custom Utilities */
.all-\[unset\] {
    all: unset;
}