anas/divan
1
0
Fork 0
Code Issues 12 Pull Requests Actions Packages Projects Releases Wiki Activity

Footer: the made-in line on its own row below the logo and tagline

Browse Source 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Anas Rashid 2026-10-09 23:51:06 +02:00
parent 93ccabdf29
commit 7077524dcb
2 changed files with 10 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/layouts/Base.astro
View File

@ -134,6 +134,7 @@ import { brand } from '../lib/brand';
<a class="footer-logo" href="/" title="سرورق"><img src="/logo/turanj.svg" width="64" height="64" alt={brand.name} /></a> <a class="footer-logo" href="/" title="سرورق"><img src="/logo/turanj.svg" width="64" height="64" alt={brand.name} /></a>
<div> <div>
<p class="footer-tagline">{brand.tagline}</p> <p class="footer-tagline">{brand.tagline}</p>
</div>
<p class="made-in"> <p class="made-in">
<svg class="flag" viewBox="0 0 30 20" width="27" height="18" role="img" aria-label="پاکستان کا پرچم"> <svg class="flag" viewBox="0 0 30 20" width="27" height="18" role="img" aria-label="پاکستان کا پرچم">
<rect width="30" height="20" fill="#fff" /><rect x="7.5" width="22.5" height="20" fill="#01411c" /> <rect width="30" height="20" fill="#fff" /><rect x="7.5" width="22.5" height="20" fill="#01411c" />
@ -143,7 +144,6 @@ import { brand } from '../lib/brand';
{brand.madeBy} {brand.madeBy}
</p> </p>
</div> </div>
</div>
<nav class="footer-links" aria-label="سائٹ کے بارے میں"> <nav class="footer-links" aria-label="سائٹ کے بارے میں">
<div><h2>{brand.name}</h2><ul> <div><h2>{brand.name}</h2><ul>
<li><a href="/about"><Icon name="info" size={18} /><span>{brand.name} کے بارے میں<small>مقصد اور طریقۂ کار</small></span></a></li> <li><a href="/about"><Icon name="info" size={18} /><span>{brand.name} کے بارے میں<small>مقصد اور طریقۂ کار</small></span></a></li>

3
web/src/styles/global.css
View File

@ -844,7 +844,8 @@ p, li { text-wrap: pretty; }
/* ── footer: the brand beside three groups of links across the page's width; licence and attribution in a thin bar ── */ /* ── footer: the brand beside three groups of links across the page's width; licence and attribution in a thin bar ── */
.site-footer .wrap { display: grid; grid-template-columns: minmax(300px, 1.2fr) 2fr; gap: 18px 40px; align-items: start; } .site-footer .wrap { display: grid; grid-template-columns: minmax(300px, 1.2fr) 2fr; gap: 18px 40px; align-items: start; }
.footer-brand { display: flex; align-items: flex-start; gap: 14px; } .footer-brand { display: flex; flex-wrap: wrap; align-items: center; gap: 0 14px; }
.footer-brand .made-in { flex-basis: 100%; margin-top: 14px; } /* its own line, below the logo and tagline */
.footer-logo { flex: none; display: block; } .footer-logo { flex: none; display: block; }
.footer-logo img { display: block; width: 64px; height: 64px; } .footer-logo img { display: block; width: 64px; height: 64px; }
.footer-tagline { margin: 4px 0 0; font: 700 1.15rem/2.2 'Noto Nastaliq Urdu', serif; color: var(--action); } /* the logo says دیوان; the tagline beside it */ .footer-tagline { margin: 4px 0 0; font: 700 1.15rem/2.2 'Noto Nastaliq Urdu', serif; color: var(--action); } /* the logo says دیوان; the tagline beside it */