From 8b0edfffade23dad7ead437ee5d845860cdb1ee7 Mon Sep 17 00:00:00 2001
From: Ariel Costas <94913521+arielcostas@users.noreply.github.com>
Date: Sat, 25 Nov 2023 22:44:05 +0100
Subject: Implement blog page, add a few links

---
 assets/css/base.scss             |  9 +++++++++
 assets/css/fonts.scss            |  8 ++++++++
 assets/css/partials/article.scss | 22 ++++++++++++++++++++++
 assets/css/root.scss             |  4 +++-
 4 files changed, 42 insertions(+), 1 deletion(-)
 create mode 100644 assets/css/partials/article.scss

(limited to 'assets/css')

diff --git a/assets/css/base.scss b/assets/css/base.scss
index eaa64bc..189acc1 100644
--- a/assets/css/base.scss
+++ b/assets/css/base.scss
@@ -4,6 +4,7 @@
 @import "markup/render-heading.scss";
 
 @import "partials/header.scss";
+@import "partials/article.scss";
 @import "partials/footer.scss";
 
 html,
@@ -19,6 +20,13 @@ body {
 	flex-direction: column;
 }
 
+h1, h2, h3, h4, h5, h6 {
+	font-family: var(--font-heading);
+	line-height: 1.25;
+	margin-top: 0;
+	margin-bottom: 0.6em;	
+}
+
 h1 {
 	font-weight: 900;
 }
@@ -34,6 +42,7 @@ a {
 
 main {
 	max-width: 80ch;
+	width: 100%;
 	margin: 0 auto;
 	padding: 1rem;
 
diff --git a/assets/css/fonts.scss b/assets/css/fonts.scss
index c771f4b..a07f8f7 100644
--- a/assets/css/fonts.scss
+++ b/assets/css/fonts.scss
@@ -12,4 +12,12 @@
 	font-weight: 100 900;
 	font-display: swap;
 	src: url('/fonts/aleo-italic.ttf') format('truetype-variations');
+}
+
+@font-face {
+	font-family: 'Rubik';
+	font-style: normal;
+	font-weight: 100 900;
+	font-display: swap;
+	src: url('/fonts/rubik.ttf') format('truetype-variations');
 }
\ No newline at end of file
diff --git a/assets/css/partials/article.scss b/assets/css/partials/article.scss
new file mode 100644
index 0000000..c35669e
--- /dev/null
+++ b/assets/css/partials/article.scss
@@ -0,0 +1,22 @@
+article {
+	max-width: 70ch;
+	margin: 0 auto;
+	font-size: 1.25rem;
+
+	>* {
+		margin-top: 0;
+		margin-bottom: 1.75rem;
+	}
+
+	h1 {
+		font-size: 3.5rem;
+		line-height: 1;
+		margin-bottom: 1rem;
+	}
+
+	p.meta {
+		display: block;
+		font-size: 0.85rem;
+		margin-bottom: 1rem;
+	}
+}
\ No newline at end of file
diff --git a/assets/css/root.scss b/assets/css/root.scss
index 88d8614..9ffc849 100644
--- a/assets/css/root.scss
+++ b/assets/css/root.scss
@@ -1,9 +1,11 @@
 :root {
 	font-size: 16px;
 	font-weight: 400;
-	font-family: 'Aleo', consolas;
+	font-family: 'Rubik', sans-serif;
 	line-height: 1.5;
 
+	--font-heading: 'Aleo', "Roboto Slab", sans-serif;
+
 	--accent-1: hsl(152, 90%, 20%);
 	--accent-2: hsl(152, 90%, 30%);
 	--accent-3: hsl(152, 90%, 40%);
-- 
cgit v1.3