Mateusz Gruszczyński
118 lines
2.8 KiB
CSS
118 lines
2.8 KiB
CSS
@font-face {
|
|
font-family: "AppSans";
|
|
src: url("/static/fonts/DejaVuSans.ttf") format("truetype");
|
|
font-weight: 400;
|
|
font-style: normal;
|
|
font-display: swap;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: "AppSans";
|
|
src: url("/static/fonts/DejaVuSans-Bold.ttf") format("truetype");
|
|
font-weight: 700;
|
|
font-style: normal;
|
|
font-display: swap;
|
|
}
|
|
|
|
:root {
|
|
--bg: #f4f7fb;
|
|
--text: #1e2a36;
|
|
--card: #ffffff;
|
|
--muted: #6c7684;
|
|
--border: #edf1f7;
|
|
--row: #f8fafc;
|
|
--input-bg: #ffffff;
|
|
--input-text: #1e2a36;
|
|
--table-border: #e7edf5;
|
|
}
|
|
|
|
body[data-theme="dark"] {
|
|
--bg: #05070d;
|
|
--text: #e5e7eb;
|
|
--card: #0d1422;
|
|
--muted: #9aa7bb;
|
|
--border: #10192a;
|
|
--row: #111a2b;
|
|
--input-bg: #070b13;
|
|
--input-text: #e5e7eb;
|
|
--table-border: #3b4658;
|
|
}
|
|
|
|
body {
|
|
font-family: "AppSans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
|
|
background: var(--bg);
|
|
color: var(--text);
|
|
min-height: 100vh;
|
|
}
|
|
|
|
.card,
|
|
.hero,
|
|
.stat-card {
|
|
background: var(--card);
|
|
color: var(--text);
|
|
border: 1px solid var(--border) !important;
|
|
}
|
|
|
|
.text-muted,
|
|
.form-label,
|
|
.stat-label,
|
|
#resultText {
|
|
color: var(--muted) !important;
|
|
}
|
|
|
|
.form-control,
|
|
.form-select {
|
|
background-color: var(--input-bg);
|
|
color: var(--input-text);
|
|
border-color: var(--border);
|
|
}
|
|
|
|
.form-control:focus,
|
|
.form-select:focus {
|
|
background-color: var(--input-bg);
|
|
color: var(--input-text);
|
|
}
|
|
|
|
.form-control::placeholder { color: var(--muted); }
|
|
|
|
.table {
|
|
color: var(--text);
|
|
--bs-table-color: var(--text);
|
|
--bs-table-bg: transparent;
|
|
--bs-table-border-color: var(--table-border);
|
|
}
|
|
|
|
.app-shell { max-width: 1680px; }
|
|
.hero { border-radius: 20px; }
|
|
.slim-card { top: 1rem; border-radius: 18px; }
|
|
.chart-card canvas { max-height: 330px; }
|
|
.chart-card-sm canvas { max-height: 230px; }
|
|
.form-label { font-size: .78rem; margin-bottom: .2rem; }
|
|
.form-control, .form-select { border-radius: 10px; }
|
|
.stack { display: grid; gap: .45rem; }
|
|
.dynamic-row {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr auto;
|
|
gap: .4rem;
|
|
align-items: end;
|
|
background: var(--row);
|
|
border: 1px solid var(--border);
|
|
padding: .55rem;
|
|
border-radius: 12px;
|
|
}
|
|
.dynamic-row.overpay { grid-template-columns: .75fr 1fr .9fr .75fr auto; }
|
|
.stat-card { border-radius: 16px; }
|
|
.stat-value { font-size: 1.15rem; font-weight: 700; }
|
|
.table { font-size: .84rem; }
|
|
.btn { border-radius: 999px; }
|
|
|
|
@media (max-width: 768px) {
|
|
.dynamic-row, .dynamic-row.overpay { grid-template-columns: 1fr 1fr; }
|
|
.dynamic-row button { grid-column: span 2; }
|
|
}
|
|
|
|
.card { box-shadow: 0 12px 34px rgba(0, 0, 0, .16) !important; }
|
|
body[data-theme="dark"] .card { box-shadow: 0 14px 38px rgba(0, 0, 0, .34) !important; }
|
|
body[data-theme="dark"] .btn-outline-secondary { border-color: var(--border); color: var(--text); }
|
|
body[data-theme="dark"] .btn-outline-primary { border-color: #52637a; }
|