From df6216d0d22e375d062943acc1375b9850f2d532 Mon Sep 17 00:00:00 2001 From: reverse Date: Mon, 31 Aug 2026 00:46:01 +0000 Subject: [PATCH] footer: real multi-column layout, drop the duplicated tagline --- static/style.css | 28 ++++++++++++++++-------- templates/base.html | 52 +++++++++++++++++++++++++++++++++------------ 2 files changed, 58 insertions(+), 22 deletions(-) diff --git a/static/style.css b/static/style.css index deb2a70..a31e9c9 100644 --- a/static/style.css +++ b/static/style.css @@ -134,15 +134,21 @@ code{font-family:var(--mono);font-size:.9em;background:rgba(18,165,148,.09);colo font-family:var(--mono);font-size:.88rem;line-height:1.7;white-space:pre;margin:.5rem 0} /* footer (dark in both themes) */ -.site-foot{background:#0f1a22;color:#aeb8c0;margin-top:1rem} -.foot-in{max-width:var(--wrap);margin:0 auto;padding:2rem 1.25rem;display:flex;align-items:center;gap:1rem 1.5rem;flex-wrap:wrap} -.foot-brand{display:flex;align-items:center;gap:.5rem;color:#fff;font-weight:700} -.foot-brand .mark{width:22px;height:22px;color:var(--teal)} -.foot-tag{margin:0;color:#8994a0;font-size:.9rem} -.foot-tag code{background:rgba(255,255,255,.08);color:#cfe3dd} -.foot-links{margin-left:auto;display:flex;gap:1.2rem;flex-wrap:wrap} -.foot-links a{color:#aeb8c0;font-size:.9rem} -.foot-links a:hover{color:#fff} +.site-foot{background:#0f1a22;color:#aeb8c0;margin-top:3rem} +.foot-in{max-width:var(--wrap);margin:0 auto;padding:3rem 1.25rem 2.2rem;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:2rem 1.5rem} +.foot-about{max-width:22rem} +.foot-logo{display:inline-flex;align-items:center;gap:.5rem;color:#fff;font-weight:700;font-size:1.05rem} +.foot-logo .mark{width:22px;height:22px;color:var(--teal)} +.foot-logo:hover{text-decoration:none} +.foot-about p{margin:.85rem 0 0;color:#8994a0;font-size:.9rem;line-height:1.6} +.foot-net{font-family:var(--mono)} +.foot-net code,.foot-about code{background:rgba(255,255,255,.08);color:#cfe3dd;padding:.05em .4em;border-radius:4px;font-size:.85em} +.foot-col{display:flex;flex-direction:column} +.foot-col h4{color:#fff;font-size:.72rem;text-transform:uppercase;letter-spacing:.13em;font-weight:600;margin:.15rem 0 .9rem} +.foot-col a{color:#aeb8c0;font-size:.9rem;padding:.3rem 0} +.foot-col a:hover{color:#fff;text-decoration:none} +.foot-bar{border-top:1px solid rgba(255,255,255,.08);max-width:var(--wrap);margin:0 auto;padding:1.1rem 1.25rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;font-size:.83rem;color:#7c8894} +.foot-bar code{font-family:var(--mono);background:rgba(255,255,255,.06);color:#9fb4ad;padding:.2em .55em;border-radius:5px;font-size:.9em} /* services flow diagram */ .flow{display:flex;align-items:center;gap:.55rem;flex-wrap:wrap;margin:1.3rem 0 .3rem} @@ -155,6 +161,8 @@ code{font-family:var(--mono);font-size:.9em;background:rgba(18,165,148,.09);colo .hero-in{grid-template-columns:1fr;gap:1.6rem} .statuscard{max-width:26rem} .cards{grid-template-columns:1fr 1fr} + .foot-in{grid-template-columns:1fr 1fr 1fr;gap:1.8rem 1.5rem} + .foot-about{grid-column:1 / -1;max-width:none} } @media(max-width:560px){ .cards{grid-template-columns:1fr} @@ -162,4 +170,6 @@ code{font-family:var(--mono);font-size:.9em;background:rgba(18,165,148,.09);colo .news li{flex-direction:column;gap:.2rem} .news-date{width:auto} .ctaband-in{flex-direction:column;align-items:flex-start} + .foot-in{grid-template-columns:1fr 1fr} + .foot-bar{justify-content:center;text-align:center} } diff --git a/templates/base.html b/templates/base.html index 892fd18..365f58e 100644 --- a/templates/base.html +++ b/templates/base.html @@ -49,21 +49,47 @@