From bcd3f67e4ec3b89653a4b0849982d839f13f9f8c Mon Sep 17 00:00:00 2001 From: MattTheTekie Date: Sat, 28 Mar 2026 17:31:23 -0400 Subject: [PATCH] chore: fixes --- css/global.css | 64 +++++++++++++++++++++++++++++++++++++------------- 1 file changed, 48 insertions(+), 16 deletions(-) diff --git a/css/global.css b/css/global.css index 553958b..5f38cd2 100644 --- a/css/global.css +++ b/css/global.css @@ -817,6 +817,9 @@ a:hover { } +/* ========================= + * BASE (1920 DESIGN) + = *======================== */ .left_banner, .right_banner { position: fixed; @@ -836,35 +839,64 @@ a:hover { /* images */ .left_banner { background-image: url("https://www.veltron.net/images/dragon.png"); + top: 250px; + left: 40px; } .right_banner { background-image: url("https://www.veltron.net/images/digimon.png"); + top: 150px; + right: 40px; } /* ========================= - * TRUE RESPONSIVE SCALE (KEY FIX) + * SMALL LAPTOPS (1200–1600) = *======================== */ -:root { - --s: calc(100vw / 1920); -} +@media (max-width: 1600px) { + .left_banner, + .right_banner { + width: 260px; + height: 425px; + } -/* clamp so it doesn't get too small or too huge */ -.left_banner, -.right_banner { - transform: scale(clamp(0.55, var(--s), 2.2)); - transform-origin: top left; + .left_banner { + top: 180px; + left: 10px; + } + + .right_banner { + top: 120px; + right: 10px; + } } /* ========================= - * POSITION ALSO SCALES + * 4K ONLY (make slightly bigger, NOT scaled math) = *======================== */ -.left_banner { - top: calc(250px * var(--s)); - left: calc(40px * var(--s)); +@media (min-width: 3000px) { + .left_banner, + .right_banner { + width: 520px; + height: 850px; + } + + .left_banner { + top: 320px; + left: 80px; + } + + .right_banner { + top: 200px; + right: 80px; + } } -.right_banner { - top: calc(150px * var(--s)); - right: calc(40px * var(--s)); +/* ========================= + * MOBILE + = *======================== */ +@media (max-width: 768px) { + .left_banner, + .right_banner { + display: none !important; + } }