Single-binary self-hosted uptime monitoring and status pages on Rust axum: HTTP probes, Lighthouse audits, SEO crawler, and PDF reports.
axumdockerrustself-hostedsqlitestatus-pageuptime-monitoringvite
1// Status — warm-earth dark theme, aligned to blog.bythewood.me
2// Mossy forest green + warm amber on a deep earth background. Quieter
3// than true cyberpunk — feels like a UNIX operator's console.
4
5// ── Typography ──
6$font-family-sans-serif: 'Monaspace Argon', ui-monospace, 'Cascadia Code', Consolas, 'SF Mono', Menlo, monospace;
7$font-family-monospace: 'Monaspace Argon', ui-monospace, 'Cascadia Code', Consolas, 'SF Mono', Menlo, monospace;
8$headings-font-family: null;
9$headings-font-weight: 700;
10$font-size-base: 0.92rem;
11$line-height-base: 1.7;
12$headings-line-height: 1.3;
13
14// ── Core palette — warm earth darks ──
15$white: #ede8e0;
16$gray-100: #ddd7cd;
17$gray-200: #c4bdb2;
18$gray-300: #a09890;
19$gray-400: #847c72;
20$gray-500: #665f56;
21$gray-600: #4a443c;
22$gray-700: #332e28;
23$gray-800: #211e1a;
24$gray-900: #161310;
25$black: #0b0a08;
26
27$body-bg: #0e0d0a;
28$body-color: #ddd7cd;
29
30// ── Accents — muted forest green + warm amber ──
31$green: #6b9e78;
32$green-bright: #7db88c;
33$green-dim: rgba(107, 158, 120, 0.12);
34$green-border: rgba(107, 158, 120, 0.22);
35
36$amber: #c9a84c;
37$amber-dim: rgba(201, 168, 76, 0.1);
38$amber-border: rgba(201, 168, 76, 0.22);
39
40$terracotta: #c47055;
41$terracotta-dim: rgba(196, 112, 85, 0.1);
42$terracotta-border: rgba(196, 112, 85, 0.22);
43
44// ── Theme mapping ──
45$primary: $green;
46$secondary: #4a443c;
47$success: $green;
48$info: #7eaab8;
49$warning: $amber;
50$danger: $terracotta;
51$light: #211e1a;
52$dark: #0e0d0a;
53
54// ── Links ──
55$link-color: $green-bright;
56$link-hover-color: #95cca2;
57$link-decoration: none;
58$link-hover-decoration: underline;
59
60// ── Borders ──
61$border-color: rgba(221, 215, 205, 0.06);
62$border-radius: 0.25rem;
63$border-radius-sm: 0.2rem;
64$border-radius-lg: 0.375rem;
65
66// ── Cards ──
67$card-bg: #13120e;
68$card-border-color: rgba(107, 158, 120, 0.1);
69$card-color: $body-color;
70$card-cap-bg: rgba(221, 215, 205, 0.02);
71
72// ── Inputs ──
73$input-bg: #13120e;
74$input-color: $body-color;
75$input-border-color: rgba(107, 158, 120, 0.18);
76$input-focus-bg: #18160f;
77$input-focus-color: $body-color;
78$input-focus-border-color: $green;
79$input-focus-box-shadow: 0 0 0 2px rgba(107, 158, 120, 0.15);
80$input-placeholder-color: #665f56;
81
82// ── Navbar ──
83$navbar-dark-color: rgba(221, 215, 205, 0.6);
84$navbar-dark-hover-color: $white;
85$navbar-dark-active-color: $white;
86
87// ── List group ──
88$list-group-bg: #13120e;
89$list-group-border-color: rgba(107, 158, 120, 0.08);
90$list-group-hover-bg: #1a1812;
91$list-group-action-color: #a09890;
92$list-group-action-hover-color: $white;
93$list-group-action-active-bg: #211e1a;
94$list-group-action-active-color: $white;
95$list-group-active-bg: $green-dim;
96$list-group-active-border-color: $green-border;
97$list-group-active-color: $green-bright;
98
99// ── Breadcrumbs ──
100$breadcrumb-active-color: $white;
101$breadcrumb-divider-color: #665f56;
102
103// ── Dropdowns ──
104$dropdown-bg: #13120e;
105$dropdown-border-color: rgba(107, 158, 120, 0.12);
106$dropdown-color: $body-color;
107$dropdown-link-color: #a09890;
108$dropdown-link-hover-color: $white;
109$dropdown-link-hover-bg: #1a1812;
110
111// ── Close button ──
112$btn-close-color: $body-color;
113
114// ── Modal ──
115$modal-content-bg: #13120e;
116$modal-content-border-color: rgba(107, 158, 120, 0.15);
117$modal-header-border-color: rgba(107, 158, 120, 0.08);
118$modal-footer-border-color: rgba(107, 158, 120, 0.08);
119$modal-backdrop-bg: #000;
120$modal-backdrop-opacity: 0.75;
121
122// ── Progress ──
123$progress-bg: rgba(221, 215, 205, 0.05);
124$progress-bar-bg: $green;
125
126// ── Tables ──
127$table-bg: transparent;
128$table-color: $body-color;
129$table-border-color: rgba(107, 158, 120, 0.08);