src/main/resources/app.css - master - nady/rrp_client

src/main/resources/app.css
246 строк5 KB
Vector
hotfix
16 дек 2025, 13:43
16 дек 2025, 13:43b5b6867
.root {
    -fx-font-family: "Segoe UI", "Inter", "Arial";
    -fx-font-size: 13px;

    -rrp-bg: #f7f2ff;
    -rrp-surface: #ffffff;
    -rrp-surface-2: #f3f4ff;
    -rrp-text: #111827;
    -rrp-muted: #4b5563;

    -rrp-border: #111827;          /* brut: почти чёрный */
    -rrp-primary: #00d4ff;         /* неоновый голубой */
    -rrp-primary-2: #ffb703;       /* желтый “поп” */
    -rrp-danger: #ff4d6d;

    -rrp-focus: rgba(0, 212, 255, 0.35);

    -fx-background-color: -rrp-bg;
}

/* Typography */
.label { -fx-text-fill: -rrp-text; }
.label.muted { -fx-text-fill: -rrp-muted; }

.h1 {
    -fx-font-size: 18px;
    -fx-font-weight: 800;
}
.h2 {
    -fx-font-size: 14px;
    -fx-font-weight: 800;
}

/* Brut “hard shadow” helper (dropshadow with offset) */
.brut-shadow {
    -fx-effect: dropshadow(gaussian, rgba(17,24,39,0.22), 0, 0.0, 6, 6);
}

/* Surfaces */
.card {
    -fx-background-color: -rrp-surface;
    -fx-border-color: -rrp-border;
    -fx-border-width: 2;
    -fx-border-radius: 10;
    -fx-background-radius: 10;
    -fx-padding: 14;

    -fx-effect: dropshadow(gaussian, rgba(17,24,39,0.22), 0, 0.0, 6, 6);
}

.topbar {
    -fx-background-color: -rrp-surface;
    -fx-border-color: -rrp-border;
    -fx-border-width: 2;
    -fx-border-radius: 12;
    -fx-background-radius: 12;
    -fx-padding: 10 12 10 12;

    -fx-effect: dropshadow(gaussian, rgba(17,24,39,0.22), 0, 0.0, 6, 6);
}

/* Buttons */
.button {
    -fx-background-color: -rrp-surface-2;
    -fx-text-fill: -rrp-text;

    -fx-border-color: -rrp-border;
    -fx-border-width: 2;
    -fx-border-radius: 10;
    -fx-background-radius: 10;

    -fx-padding: 8 14 8 14;
    -fx-cursor: hand;

    -fx-effect: dropshadow(gaussian, rgba(17,24,39,0.20), 0, 0.0, 4, 4);
}

.button:hover {
    -fx-translate-y: -1;
    -fx-effect: dropshadow(gaussian, rgba(17,24,39,0.28), 0, 0.0, 6, 6);
}

.button:pressed {
    -fx-translate-y: 1;
    -fx-effect: dropshadow(gaussian, rgba(17,24,39,0.18), 0, 0.0, 2, 2);
}

.button:focused {
    -fx-effect:
            dropshadow(gaussian, rgba(17,24,39,0.22), 0, 0.0, 6, 6),
            dropshadow(gaussian, -rrp-focus, 18, 0.35, 0, 0);
}

/* Accent buttons */
.button.primary {
    -fx-background-color: -rrp-primary;
    -fx-text-fill: #111827;
}

.button.primary:hover {
    -fx-background-color: derive(-rrp-primary, -8%);
}

.button.danger {
    -fx-background-color: -rrp-danger;
    -fx-text-fill: #111827;
}

.button.danger:hover {
    -fx-background-color: derive(-rrp-danger, -10%);
}

/* Inputs */
.text-field, .password-field, .text-area, .spinner {
    -fx-background-color: -rrp-surface;
    -fx-text-fill: -rrp-text;

    -fx-border-color: -rrp-border;
    -fx-border-width: 2;
    -fx-border-radius: 10;
    -fx-background-radius: 10;
}

.text-field:focused, .password-field:focused, .text-area:focused, .spinner:focused {
    -fx-border-color: -rrp-primary;
    -fx-effect: dropshadow(gaussian, -rrp-focus, 18, 0.35, 0, 0);
}

.text-area { -fx-padding: 8; }

/* Status area */
.status-area {
    -fx-background-color: linear-gradient(to bottom, #ffffff, #fff8e7);
    -fx-control-inner-background: transparent;

    -fx-border-color: -rrp-border;
    -fx-border-width: 2;
    -fx-border-radius: 12;
    -fx-background-radius: 12;

    -fx-padding: 10;
    -fx-font-family: "Cascadia Mono", "JetBrains Mono", "Consolas", monospace;

    -fx-effect: dropshadow(gaussian, rgba(17,24,39,0.18), 0, 0.0, 5, 5);
}

/* Tabs */
.tab-pane { -fx-background-color: transparent; }
.tab-pane .tab-header-area .tab-header-background { -fx-background-color: transparent; }

.tab-pane .headers-region { -fx-padding: 0 0 10 0; }

.tab-pane .tab {
    -fx-background-color: -rrp-surface;
    -fx-border-color: -rrp-border;
    -fx-border-width: 2;
    -fx-background-radius: 10;
    -fx-border-radius: 10;
    -fx-padding: 8 14 8 14;

    -fx-effect: dropshadow(gaussian, rgba(17,24,39,0.16), 0, 0.0, 4, 4);
}

.tab-pane .tab .tab-label {
    -fx-text-fill: -rrp-muted;
    -fx-font-weight: 800;
}

.tab-pane .tab:selected {
    -fx-background-color: -rrp-primary-2;
}

.tab-pane .tab:selected .tab-label {
    -fx-text-fill: -rrp-text;
}

/* Tables */
.table-view {
    -fx-background-color: -rrp-surface;
    -fx-border-color: -rrp-border;
    -fx-border-width: 2;
    -fx-background-radius: 12;
    -fx-border-radius: 12;

    -fx-effect: dropshadow(gaussian, rgba(17,24,39,0.18), 0, 0.0, 6, 6);
}

.table-view .column-header-background {
    -fx-background-color: -rrp-primary-2;
    -fx-background-radius: 12 12 0 0;
    -fx-border-color: -rrp-border;
    -fx-border-width: 0 0 2 0;
}

.table-view .column-header, .table-view .filler {
    -fx-size: 36px;
    -fx-background-color: transparent;
}

.table-view .column-header .label {
    -fx-text-fill: -rrp-text;
    -fx-font-weight: 900;
}

.table-row-cell {
    -fx-background-color: -rrp-surface;
}

.table-row-cell:odd {
    -fx-background-color: #f5fbff;
}

.table-row-cell:selected {
    -fx-background-color: rgba(0, 212, 255, 0.22);
}

.table-cell {
    -fx-padding: 10 10 10 10;
    -fx-text-fill: -rrp-text;
}

/* Misc */
.separator { -fx-opacity: 0.4; }
.progress-indicator { -fx-progress-color: -rrp-primary; }

/* Quickchat */
.quickchat-button {
    -fx-font-size: 10px;
    -fx-padding: 4 8;
    -fx-background-color: #e5e7eb;
    -fx-background-radius: 4;
    -fx-border-radius: 4;
    -fx-cursor: hand;
}

.quickchat-button:hover {
    -fx-background-color: #d1d5db;
}

.quickchat-button:pressed {
    -fx-background-color: #9ca3af;
}

.quickchat-hbox {
    -fx-spacing: 5;
}