tom/personal_site
1
0
Fork 0
mirror of https://github.com/TomHodson/tomhodson.github.com.git synced 2025-06-26 10:01:18 +02:00
Code Issues Packages Projects Releases Wiki Activity

Add a "byline"

Browse Source
This commit is contained in:
Tom 2024-09-09 18:12:02 +02:00
parent 1eba2027ca
commit 06ba05a264
3 changed files with 31 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
_layouts/post.html
View File

@ -14,8 +14,16 @@
{% include header.html %} {% include header.html %}
<main> <main>
<article class="h-entry"> <article class="h-entry">
<h1 class = "p-name">{{ page.title }}</h1> <section class="header">
<time class="dt-published" datetime="{{ page.date | date_to_xmlschema }}">{{ page.date | date_to_string }}</time> <section class="title-date-container">
<h1 class = "p-name highlights">{{ page.title }}</h1>
<time class="dt-label dt-published" datetime="{{ page.date | date_to_xmlschema }}">{{ page.date | date_to_string }}</time>
</section>
<hr class="byline">
<section class="byline">
{{page.excerpt}}
</section>
</section>
<summary style="display:none" class="p-summary">{{ page.excerpt }}</summary> <summary style="display:none" class="p-summary">{{ page.excerpt }}</summary>
<div class="e-content"> <div class="e-content">
{{ content }} {{ content }}

23
_sass/base.scss
View File

@ -13,8 +13,7 @@
@import "mastodon_timeline"; @import "mastodon_timeline";
@import "night_mode_toggle"; @import "night_mode_toggle";
@import "highlights"; @import "highlights";
@import "tables"; // The syntax highlighting css
// The syntax highlighting css
// generated with rougify style bw > code_style_bw.scss // generated with rougify style bw > code_style_bw.scss
// @import "code_style_bw"; // @import "code_style_bw";
@import "code_style_github"; @import "code_style_github";
@ -147,6 +146,15 @@ section.title-date-container {
} }
} }
hr.byline {
margin-top: 0.2em;
margin-bottom: 0.2em;
}
section.byline {
font-style: italic;
margin-bottom: 2em;
}
:is(h1, h2, h3, h4, .text-balance) { :is(h1, h2, h3, h4, .text-balance) {
text-wrap: balance; text-wrap: balance;
} }
@ -219,6 +227,17 @@ figure.centered {
justify-content: center; justify-content: center;
} }
figure.two-wide {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 1em;
margin-bottom: 1em;
img {
width: calc(50% - 0.5em);
}
}
section.image-grid-4x4 { section.image-grid-4x4 {
aspect-ratio: 1 / 1; aspect-ratio: 1 / 1;
display: grid; display: grid;

4
_sass/highlights.scss
View File

@ -10,10 +10,6 @@ h1.highlights {
section.highlights { section.highlights {
margin-bottom: 2rem; margin-bottom: 2rem;
h1 {
margin-bottom: 1rem;
}
a.highlights-more { a.highlights-more {
margin-left: $left_pad; margin-left: $left_pad;
} }