fix: responsive clamp max-widths for 4K/ultrawide screens

This commit is contained in:
jae 2026-04-04 18:23:01 +00:00
parent 23d5692334
commit 40ee9bbec8
9 changed files with 16 additions and 16 deletions

View file

@ -3,7 +3,7 @@
*/ */
.al-container { .al-container {
max-width: 1200px; max-width: clamp(1000px, 88vw, 2200px);
margin: 0 auto; margin: 0 auto;
padding: 0 1.5rem 3rem; padding: 0 1.5rem 3rem;
} }

View file

@ -71,7 +71,7 @@
} }
.blog-container { .blog-container {
max-width: 1100px; max-width: clamp(900px, 85vw, 2000px);
margin: 0 auto; margin: 0 auto;
} }
@ -318,7 +318,7 @@
============================ */ ============================ */
.post-page-header { .post-page-header {
padding: calc(var(--nav-height) + 3rem) 2rem 2rem; padding: calc(var(--nav-height) + 3rem) 2rem 2rem;
max-width: 1100px; max-width: clamp(900px, 85vw, 2000px);
margin: 0 auto; margin: 0 auto;
} }
@ -338,7 +338,7 @@
.post-back:hover { color: var(--accent); } .post-back:hover { color: var(--accent); }
.post-page-layout { .post-page-layout {
max-width: 1100px; max-width: clamp(900px, 85vw, 2000px);
margin: 0 auto; margin: 0 auto;
padding: 0 2rem 4rem; padding: 0 2rem 4rem;
display: grid; display: grid;

View file

@ -3,7 +3,7 @@
*/ */
.changelog-container { .changelog-container {
max-width: 900px; max-width: clamp(700px, 80vw, 1600px);
margin: 0 auto; margin: 0 auto;
padding: 2rem 1.5rem; padding: 2rem 1.5rem;
} }

View file

@ -10,7 +10,7 @@
} }
.post-header-content { .post-header-content {
max-width: 1100px; max-width: clamp(900px, 85vw, 2000px);
margin: 0 auto; margin: 0 auto;
} }
@ -115,7 +115,7 @@
} }
.post-layout { .post-layout {
max-width: 1100px; max-width: clamp(900px, 85vw, 2000px);
margin: 0 auto; margin: 0 auto;
display: grid; display: grid;
grid-template-columns: 1fr 300px; grid-template-columns: 1fr 300px;

View file

@ -1,7 +1,7 @@
/* ─── RADAR: Live Intelligence Feed ─────────────── */ /* ─── RADAR: Live Intelligence Feed ─────────────── */
.radar-container { .radar-container {
max-width: 1400px; max-width: clamp(1200px, 90vw, 2400px);
margin: 0 auto; margin: 0 auto;
padding: 0 2rem 3rem; padding: 0 2rem 3rem;
} }

View file

@ -42,7 +42,7 @@
/* --- Section Grid (Landing Pages) --- */ /* --- Section Grid (Landing Pages) --- */
.section-grid-container { .section-grid-container {
max-width: 1100px; max-width: clamp(900px, 85vw, 2000px);
margin: 0 auto; margin: 0 auto;
padding: 2rem 1.5rem 4rem; padding: 2rem 1.5rem 4rem;
} }
@ -134,7 +134,7 @@
/* --- Subpage Content (Placeholder) --- */ /* --- Subpage Content (Placeholder) --- */
.subpage-content { .subpage-content {
max-width: 900px; max-width: clamp(700px, 80vw, 1600px);
margin: 0 auto; margin: 0 auto;
padding: 2rem 1.5rem 4rem; padding: 2rem 1.5rem 4rem;
} }
@ -191,7 +191,7 @@
/* --- Breadcrumb --- */ /* --- Breadcrumb --- */
.breadcrumb { .breadcrumb {
max-width: 1100px; max-width: clamp(900px, 85vw, 2000px);
margin: 0 auto; margin: 0 auto;
padding: calc(var(--nav-height) + 1.5rem) 1.5rem 0; padding: calc(var(--nav-height) + 1.5rem) 1.5rem 0;
font-family: var(--font-mono); font-family: var(--font-mono);

View file

@ -117,7 +117,7 @@ a:hover { color: #fff; text-shadow: none; }
} }
.nav-container { .nav-container {
max-width: 1400px; max-width: clamp(1200px, 90vw, 2400px);
margin: 0 auto; margin: 0 auto;
padding: 0 2rem; padding: 0 2rem;
height: 100%; height: 100%;
@ -941,7 +941,7 @@ a:hover { color: #fff; text-shadow: none; }
} }
.section-container { .section-container {
max-width: 1200px; max-width: clamp(1000px, 88vw, 2200px);
margin: 0 auto; margin: 0 auto;
} }
@ -1479,7 +1479,7 @@ a:hover { color: #fff; text-shadow: none; }
} }
.footer-container { .footer-container {
max-width: 1200px; max-width: clamp(1000px, 88vw, 2200px);
margin: 0 auto; margin: 0 auto;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;

View file

@ -44,7 +44,7 @@
<p class="section-header-sub">&gt; The largest classified index of free resources on the internet — 16,000+ assets catalogued, coded, and declassified.</p> <p class="section-header-sub">&gt; The largest classified index of free resources on the internet — 16,000+ assets catalogued, coded, and declassified.</p>
</section> </section>
<section class="subpage-content" style="max-width: 1400px; margin: 0 auto; padding: 0 2rem 3rem;"> <section class="subpage-content" style="max-width: clamp(1200px, 90vw, 2400px); margin: 0 auto; padding: 0 2rem 3rem;">
<div id="contrabandRoot"> <div id="contrabandRoot">
<div class="crt-loading">INITIALISING CONTRABAND DATABASE...</div> <div class="crt-loading">INITIALISING CONTRABAND DATABASE...</div>
</div> </div>

View file

@ -43,7 +43,7 @@
<p class="section-header-sub">&gt; Curated dossiers covering resources across 28 sectors. Select a sector to begin.</p> <p class="section-header-sub">&gt; Curated dossiers covering resources across 28 sectors. Select a sector to begin.</p>
</section> </section>
<section class="subpage-content" style="max-width: 1400px; margin: 0 auto; padding: 0 2rem 3rem;"> <section class="subpage-content" style="max-width: clamp(1200px, 90vw, 2400px); margin: 0 auto; padding: 0 2rem 3rem;">
<div id="awesomelistRoot"></div> <div id="awesomelistRoot"></div>
</section> </section>