stable-diffusion.cpp-rest/webui/app/globals.css

@import "tailwindcss";

/* Prevent horizontal scrolling */
html,
body {
    overflow-x: hidden;
    width: 100%;
}

/* Fix container padding to prevent scrolling */
.container {
    max-width: 100%;
    padding-left: 1rem;
    padding-right: 1rem;
}

@theme {
    /* Light mode colors */
    --color-background: #ffffff;
    --color-foreground: #09090b;
    --color-card: #ffffff;
    --color-card-foreground: #09090b;
    --color-popover: #ffffff;
    --color-popover-foreground: #09090b;
    --color-primary: #18181b;
    --color-primary-foreground: #fafafa;
    --color-secondary: #f4f4f5;
    --color-secondary-foreground: #18181b;
    --color-muted: #f4f4f5;
    --color-muted-foreground: #71717a;
    --color-accent: #f4f4f5;
    --color-accent-foreground: #18181b;
    --color-destructive: #ef4444;
    --color-destructive-foreground: #fafafa;
    --color-border: #e4e4e7;
    --color-input: #e4e4e7;
    --color-ring: #18181b;
}

@media (prefers-color-scheme: dark) {
    @theme {
        --color-background: #09090b;
        --color-foreground: #fafafa;
        --color-card: #09090b;
        --color-card-foreground: #fafafa;
        --color-popover: #09090b;
        --color-popover-foreground: #fafafa;
        --color-primary: #fafafa;
        --color-primary-foreground: #18181b;
        --color-secondary: #27272a;
        --color-secondary-foreground: #fafafa;
        --color-muted: #27272a;
        --color-muted-foreground: #a1a1aa;
        --color-accent: #27272a;
        --color-accent-foreground: #fafafa;
        --color-destructive: #7f1d1d;
        --color-destructive-foreground: #fafafa;
        --color-border: #27272a;
        --color-input: #27272a;
        --color-ring: #d4d4d8;
    }
}

body {
    background-color: var(--color-background);
    color: var(--color-foreground);
    font-feature-settings:
        "rlig" 1,
        "calt" 1;
    margin: 0;
    padding: 0;
    overflow: hidden;
    width: 100vw;
    height: 100vh;
}

/* Prevent scrolling on html and body elements */
html,
body {
    overflow: hidden;
    width: 100%;
    height: 100%;
}

/* Prompt textarea with syntax highlighting */
.prompt-textarea-input {
    caret-color: var(--color-foreground) !important;
}

.prompt-textarea-input::selection {
    background-color: rgba(59, 130, 246, 0.3);
    color: transparent;
}

.prompt-textarea-input::-moz-selection {
    background-color: rgba(59, 130, 246, 0.3);
    color: transparent;
}

/* Gallery utilities */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}