From 898b52edcb47bcb3e9d6106e74ca73e74ea01e70 Mon Sep 17 00:00:00 2001 From: sillylaird Date: Thu, 3 Sep 2026 00:33:59 +0000 Subject: import live www.sillylaird.ca webroot --- assets/css/pages/computers.css | 102 +++++++++++++++++++++++++++++++++++++++++ 1 file changed, 102 insertions(+) create mode 100644 assets/css/pages/computers.css (limited to 'assets/css/pages/computers.css') diff --git a/assets/css/pages/computers.css b/assets/css/pages/computers.css new file mode 100644 index 0000000..2b0ff38 --- /dev/null +++ b/assets/css/pages/computers.css @@ -0,0 +1,102 @@ +.machine{ + border: 1px solid var(--ink); + padding: var(--space-md); + margin-top: var(--space-md); + background: var(--bg); +} + +.machine-info{ font-size: var(--fs-base); } + +.machine-title{ + color: var(--gold); + font-weight: 700; + font-size: var(--fs-lg); + margin-bottom: var(--space-xs); +} + +.machine--notes { + border-color: color-mix(in srgb, var(--accent-cyan) 42%, var(--border)); + background: linear-gradient(90deg, color-mix(in srgb, var(--accent-cyan) 7%, var(--bg)), var(--bg) 45%); +} + +.colon-nav { + font-size: var(--fs-base); + margin-top: var(--space-sm); +} + +.colon-nav strong { + color: var(--gold); +} + +.machine-row { + display: flex; + gap: var(--space-md); + align-items: flex-start; + flex-wrap: wrap; +} + +.machine-row .machine-thumb { + flex: 0 0 auto; + width: 96px; + height: 96px; + object-fit: contain; + border: 1px solid var(--border); + background: var(--bg); + padding: var(--space-xs); +} + +.machine-row .machine-facts { + flex: 1 1 240px; +} + +.machine-title--sub { + margin-top: var(--space-sm); +} + +.placeholder-grid { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); + gap: var(--space-md); +} + +.placeholder-box { + border: 1px dashed var(--border); + border-radius: var(--r); + padding: var(--space-md); + text-align: center; + color: var(--muted); + font-size: var(--fs-sm); + min-height: 120px; + display: flex; + align-items: center; + justify-content: center; +} + +.rs-shot { + margin: 0; + border: 1px solid var(--border); + border-radius: var(--r); + overflow: hidden; + background: var(--bg); +} + +.rs-shot img { + display: block; + width: 100%; + height: auto; +} + +.rs-shot figcaption { + padding: var(--space-xs) var(--space-sm); + font-size: var(--fs-sm); +} + +.rs-era-banner { + display: block; + width: 100%; + max-height: 220px; + object-fit: cover; + border: 1px solid var(--border); + border-radius: var(--r); + margin: var(--space-sm) 0 var(--space-md); +} -- cgit v1.2.3