Blog post: Graphite progress report (Q3 2024) (#2013)

* Q3 blog

* WIP

---------

Co-authored-by: Keavon Chambers <keavon@keavon.com>

website/sass/base.scss

@@ -375,6 +375,7 @@ body > .page {
 // =====================
 
 :is(h1, h2, h3, h4, article > :first-child) ~ :is(p, ul, ol, ol li p, img, a:has(> img:only-child)),
+:is(h1, h2, h3, h4, article > :first-child) ~ :is(ul, ol) li p + img,
 :is(h1, h2, h3, h4, p) ~ .feature-icons,
 p ~ :is(h1, h2, h3, h4, details summary, blockquote, .image-comparison, .video-background, .video-embed),
 .video-embed + :is(p, .link, .button),
@@ -446,6 +447,10 @@ p {
 	text-justify: inter-character; // Only supported in Firefox
 	-webkit-hyphens: auto;
 	hyphens: auto;
+
+	code {
+		text-justify: auto;
+	}
 }
 
 h1,

website/sass/blog.scss

@@ -108,6 +108,10 @@
 				-webkit-box-orient: vertical;
 				-webkit-line-clamp: 3;
 
+				code {
+					text-justify: auto;
+				}
+
 				// Safari workaround: https://stackoverflow.com/a/72170897/775283
 				// But there remains an issue where the ellipsis is rendered inside the text. There doesn't appear to be a fix, or even a way to disable the ellipsis in Safari.
 				p {

website/sass/index.scss

@@ -445,6 +445,10 @@
 		-webkit-box-orient: vertical;
 		-webkit-line-clamp: 6;
 
+		code {
+			text-justify: auto;
+		}
+
 		// Safari workaround: https://stackoverflow.com/a/72170897/775283
 		// But there remains an issue where the ellipsis is rendered inside the text. There doesn't appear to be a fix, or even a way to disable the ellipsis in Safari.
 		p {