Skip to content

🏗️♻️：tidy two seams in the stylesheets #1839

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
openinf-commit-queue merged 2 commits into from
Aug 21, 2026
Merged

🏗️♻️：tidy two seams in the stylesheets #1839

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
8fd5352
🏗️♻️：keep the navbar's height in one place
DerekNonGeneric Aug 21, 2026
91c4999
🏗️♻️：give the front page's card its own names
DerekNonGeneric Aug 21, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion _assets/styles/_custom.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ main > .container {
max-width: 48ch;
min-height: 100%;
padding: 0 16px 104px;
padding-top: 74px;
padding-top: $navbar-height;
}

.navbar-brand svg {
Expand Down
22 changes: 11 additions & 11 deletions _assets/styles/_home.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
--parchment: #{$body-bg};
--primary-tint: #{tint-color($primary, 30%)};
--primary-deep: #{shade-color($primary, 25%)};
--nav-h: 74px;
--nav-h: #{$navbar-height};
--sans: #{$font-family-sans-serif};
--mono: #{$font-family-monospace};
--wrap: 1200px;
Expand Down Expand Up @@ -529,7 +529,7 @@

/* --- Latest ---------------------------------------------------------- */

.home .post {
.home .latest {
display: grid;
grid-template-columns: minmax(0, 10rem) minmax(0, 1fr);
gap: 0.375rem 1.5rem;
Expand All @@ -538,18 +538,18 @@
border-bottom: 1px solid rgb(167 151 139 / 55%);
}

.home .post:hover .post-title {
.home .latest:hover .latest-title {
text-decoration: underline;
}

.home .post-meta {
.home .latest-meta {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
align-items: baseline;
}

.home .post-cat {
.home .latest-cat {
padding: 0.0625rem 0.4375rem;
font-family: var(--mono);
font-size: 0.6875rem;
Expand All @@ -559,25 +559,25 @@
background-color: var(--tertiary);
}

.home .post-date {
.home .latest-date {
font-family: var(--mono);
font-size: 0.75rem;
color: #6b6259;
}

// Both are spans, kept for the grid's sake (see `.post`), but not blockified
// by it: only `.post-body`, the direct grid item, is. Left as spans they run
// Both are spans, kept for the grid's sake (see `.latest`), but not blockified
// by it: only `.latest-body`, the direct grid item, is. Left as spans they run
// on as one paragraph, title-text-then-excerpt, and `margin-top` below does
// nothing — inline boxes do not take vertical margin.
.home .post-title {
.home .latest-title {
display: block;
font-size: 1.25rem;
font-weight: 700;
line-height: 1.25;
color: var(--primary-deep);
}

.home .post-excerpt {
.home .latest-excerpt {
display: block;
max-width: 62ch;
margin-top: 0.5rem;
Expand Down Expand Up @@ -657,7 +657,7 @@
opacity: 0.2;
}

.post {
.latest {
grid-template-columns: minmax(0, 1fr);
}

Expand Down
4 changes: 0 additions & 4 deletions _assets/styles/_nav.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,3 @@
// The fixed navbar's height: the brand mark plus the padding around it.
// _custom.scss offsets the page by the same number.
$navbar-height: 74px;

.navbar-toggler svg {
height: 24px;
}
Expand Down
4 changes: 4 additions & 0 deletions _assets/styles/_sublime-theme.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,10 @@ $body-color: #1d1916;
// our warm ink and it reads as a mistake. Our dark is the ink.
$dark: $body-color;
$body-bg: #e7e7d6;

// The fixed navbar's height: the brand mark plus the padding around it. The
// page offsets itself by this, and the navbar's own links fill it.
$navbar-height: 74px;
$pagination-border-width: 2px;
$pagination-border-color: $tertiary;
$pagination-active-bg: $tertiary;
Expand Down
14 changes: 7 additions & 7 deletions collections/_pages/home.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -192,18 +192,18 @@ <h2 class="section-title" id="latest-title">Latest</h2>

{%- assign latest = collections.posts | first -%}
{%- if latest %}
<a class="post" href="{{ latest.url }}">
<span class="post-meta">
<span class="post-cat">{{ latest.data.category }}</span>
<span class="post-date">
<a class="latest" href="{{ latest.url }}">
<span class="latest-meta">
<span class="latest-cat">{{ latest.data.category }}</span>
<span class="latest-date">
<time datetime="{{ latest.date | date: '%Y-%m-%d' }}">
{{- latest.date | date_to_string -}}
</time>
</span>
</span>
<span class="post-body">
<span class="post-title">{{ latest.data.title }}</span>
<span class="post-excerpt">
<span class="latest-body">
<span class="latest-title">{{ latest.data.title }}</span>
<span class="latest-excerpt">
{%- if latest.data.excerpt -%}
{{- latest.data.excerpt -}}
{%- else -%}
Expand Down
Loading