blog.bythewood.me-rust

  1// Dark theme variable overrides
  2
  3// Typography — monospace-first for the TUI/hacker aesthetic
  4$font-family-sans-serif: 'Monaspace Argon', ui-monospace, 'Cascadia Code', Consolas, 'SF Mono', Menlo, monospace;
  5$font-family-monospace: 'Monaspace Argon', ui-monospace, 'Cascadia Code', Consolas, 'SF Mono', Menlo, monospace;
  6$headings-font-family: null;
  7$headings-font-weight: 700;
  8$font-size-base: 0.92rem;
  9$line-height-base: 1.7;
 10$headings-line-height: 1.3;
 11
 12// Core palette — warm earth darks
 13$white: #ede8e0;
 14$gray-100: #ddd7cd;
 15$gray-200: #c4bdb2;
 16$gray-300: #a09890;
 17$gray-400: #847c72;
 18$gray-500: #665f56;
 19$gray-600: #4a443c;
 20$gray-700: #332e28;
 21$gray-800: #211e1a;
 22$gray-900: #161310;
 23$black: #0b0a08;
 24
 25$body-bg: #0e0d0a;
 26$body-color: #ddd7cd;
 27
 28// Accent — muted forest green + warm amber
 29$green: #6b9e78;
 30$green-bright: #7db88c;
 31$green-dim: rgba(107, 158, 120, 0.12);
 32$green-border: rgba(107, 158, 120, 0.2);
 33$amber: #c9a84c;
 34$amber-dim: rgba(201, 168, 76, 0.12);
 35
 36// Theme colors
 37$primary: $green;
 38$secondary: #4a443c;
 39$success: #6b9e78;
 40$info: #7eaab8;
 41$warning: $amber;
 42$danger: #c47055;
 43$light: #211e1a;
 44$dark: #0e0d0a;
 45
 46// Links
 47$link-color: $green-bright;
 48$link-hover-color: #95cca2;
 49$link-decoration: none;
 50$link-hover-decoration: underline;
 51
 52// Borders
 53$border-color: rgba(221, 215, 205, 0.07);
 54$border-radius: 0.25rem;
 55$border-radius-sm: 0.2rem;
 56$border-radius-lg: 0.375rem;
 57
 58// Cards
 59$card-bg: #13120e;
 60$card-border-color: rgba(107, 158, 120, 0.08);
 61$card-color: #ddd7cd;
 62$card-cap-bg: rgba(221, 215, 205, 0.03);
 63
 64// Inputs
 65$input-bg: #13120e;
 66$input-color: #ddd7cd;
 67$input-border-color: rgba(107, 158, 120, 0.18);
 68$input-focus-bg: #18160f;
 69$input-focus-color: #ddd7cd;
 70$input-focus-border-color: $green;
 71$input-focus-box-shadow: 0 0 0 2px rgba(107, 158, 120, 0.15);
 72$input-placeholder-color: #665f56;
 73
 74// Navbar
 75$navbar-dark-color: rgba(221, 215, 205, 0.6);
 76$navbar-dark-hover-color: #ddd7cd;
 77$navbar-dark-active-color: #ddd7cd;
 78
 79// List groups
 80$list-group-bg: #13120e;
 81$list-group-border-color: rgba(107, 158, 120, 0.08);
 82$list-group-hover-bg: #1a1812;
 83$list-group-action-color: #a09890;
 84$list-group-action-hover-color: #ddd7cd;
 85$list-group-action-active-bg: #211e1a;
 86$list-group-action-active-color: #ddd7cd;
 87$list-group-active-bg: $green-dim;
 88$list-group-active-border-color: rgba(107, 158, 120, 0.25);
 89$list-group-active-color: $green-bright;
 90
 91// Tables — Bootstrap's $table-color defaults to var(--bs-emphasis-color) which
 92// renders near-black on our dark body bg, hiding cell text until selected.
 93$table-color: $body-color;
 94$table-border-color: $border-color;
 95$table-striped-color: $body-color;
 96$table-striped-bg: rgba(221, 215, 205, 0.03);
 97$table-active-color: $body-color;
 98$table-active-bg: rgba(221, 215, 205, 0.06);
 99$table-hover-color: $body-color;
100$table-hover-bg: rgba(221, 215, 205, 0.04);
101
102// Breadcrumbs
103$breadcrumb-active-color: #ddd7cd;
104$breadcrumb-divider-color: #665f56;
105
106// Dropdowns
107$dropdown-bg: #13120e;
108$dropdown-border-color: rgba(107, 158, 120, 0.1);
109$dropdown-color: #ddd7cd;
110$dropdown-link-color: #a09890;
111$dropdown-link-hover-color: #ddd7cd;
112$dropdown-link-hover-bg: #1a1812;
113
114// Close button
115$btn-close-color: #ddd7cd;