github-starred/awesome-python
2
0
Fork 0
mirror of https://github.com/vinta/awesome-python.git synced 2026-11-08 02:15:12 -06:00
Code Issues 461 Packages Projects Releases Wiki Activity

style: match each section's bottom gap to its top gap

Browse Source 
Measured from the section edge to the nearest glyph or filled box, the guide band put 92px under its text against 51px above its heading, the sponsor band 67px against 52px, and the Sponsorship page sections ranged from 69px to 92px under content that sat 68px to 84px below their tops.

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Vinta Chen
2026-10-22 00:05:01 +08:00
co-authored by Claude
parent 65ce927b80
commit 5ab66e83e8
1 changed files with 24 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
website/static/style.css
+24 -6
View File
@@ -593,7 +593,7 @@ kbd {
}
.guide-band {
padding-block: calc(var(--shell-pad) * 1.2) clamp(3rem, 7vw, 5.5rem);
padding-block: calc(var(--shell-pad) * 1.2);
background: linear-gradient(140deg, var(--hero-bg-start) 0%, var(--hero-bg-mid) 58%, var(--hero-bg-end) 100%);
color: var(--hero-text);
}
@@ -627,7 +627,9 @@ kbd {
}
.sponsor-band {
padding-block: clamp(2.5rem, 5.5vw, 4rem);
--band-pad: clamp(2.5rem, 5.5vw, 4rem);
/* The sponsor name's glyphs rise above its line box, so the top gap reads 1rem smaller than the padding */
padding-block: var(--band-pad) calc(var(--band-pad) - 1rem);
background: var(--sponsor-bg);
border-bottom: 1px solid var(--line-strong);
}
@@ -1335,17 +1337,23 @@ th[data-sort].sort-asc::after {
}
.sponsorship-section {
padding-block: clamp(2.75rem, 5.5vw, 4.25rem);
--section-pad: clamp(2.75rem, 5.5vw, 4.25rem);
padding-block: var(--section-pad);
border-bottom: 1px solid var(--line);
}
.sponsorship-section:first-of-type {
padding-top: clamp(3.25rem, 6vw, 4.75rem);
/* Sections that open with a label but end with a box get the space the label's line adds above its text */
.sponsorship-audience,
.sponsorship-getstarted {
padding-bottom: calc(var(--section-pad) + 0.5rem);
}
.sponsorship-independence {
padding-bottom: calc(var(--section-pad) + 0.25rem);
}
.sponsorship-section:last-of-type {
border-bottom: 0;
padding-bottom: clamp(3.5rem, 7vw, 5.5rem);
}
.sponsorship-getstarted {
@@ -1730,6 +1738,16 @@ th[data-sort].sort-asc::after {
grid-template-columns: 1fr;
}
/* Stacked, the band opens with its label instead of the sponsor name */
.sponsor-band {
padding-bottom: var(--band-pad);
}
/* Stacked, the tiers open with their label instead of a tier box */
.sponsorship-tiers {
padding-bottom: calc(var(--section-pad) + 0.5rem);
}
.sponsor-meta {
flex-direction: row;
justify-content: space-between;