From 8ccc47294e213c44139d90e4971a6ae40ff4a74a Mon Sep 17 00:00:00 2001
From: Ariel Costas <94913521+arielcostas@users.noreply.github.com>
Date: Mon, 5 Feb 2024 19:27:58 +0100
Subject: Refactor CSS imports and remove unused styles

---
 assets/css/partials/_article.scss |  47 ++++++++++++
 assets/css/partials/_footer.scss  |  11 +++
 assets/css/partials/_header.scss  | 147 ++++++++++++++++++++++++++++++++++++++
 assets/css/partials/_index.scss   |   3 +
 assets/css/partials/article.scss  |  45 ------------
 assets/css/partials/footer.scss   |  11 ---
 assets/css/partials/header.scss   | 147 --------------------------------------
 7 files changed, 208 insertions(+), 203 deletions(-)
 create mode 100644 assets/css/partials/_article.scss
 create mode 100644 assets/css/partials/_footer.scss
 create mode 100644 assets/css/partials/_header.scss
 create mode 100644 assets/css/partials/_index.scss
 delete mode 100644 assets/css/partials/article.scss
 delete mode 100644 assets/css/partials/footer.scss
 delete mode 100644 assets/css/partials/header.scss

(limited to 'assets/css/partials')

diff --git a/assets/css/partials/_article.scss b/assets/css/partials/_article.scss
new file mode 100644
index 0000000..11da92b
--- /dev/null
+++ b/assets/css/partials/_article.scss
@@ -0,0 +1,47 @@
+main {
+	margin: 0 auto 3rem;
+	padding: 1rem;
+	box-sizing: border-box;
+
+	max-width: 72ch;
+	width: 100%;
+	font-size: 1.25rem;
+
+	a {
+		color: var(--accent-1);
+		transition: color 0.2s ease-in-out;
+
+		&:hover {
+			color: var(--accent-2);
+		}
+	}
+
+	>* {
+		margin-top: 0;
+		margin-bottom: 1.75rem;
+	}
+
+	>p>code {
+		word-break: break-word;
+		font-family: var(--font-mono);
+		
+		color: var(--accent-1);
+		background-color: #f6f6f6;
+	}
+
+	h1 {
+		font-size: 2.25rem;
+		line-height: 1;
+		margin-bottom: 1rem;
+	}
+
+	p.meta {
+		display: block;
+		font-size: 0.85rem;
+		margin-bottom: 1rem;
+	}
+
+	pre {
+		overflow: scroll;
+	}
+}
\ No newline at end of file
diff --git a/assets/css/partials/_footer.scss b/assets/css/partials/_footer.scss
new file mode 100644
index 0000000..9c6ccc1
--- /dev/null
+++ b/assets/css/partials/_footer.scss
@@ -0,0 +1,11 @@
+footer {
+	background-color: #333;
+	color: white;
+	text-align: center;
+
+	padding: 0.5rem 1rem;
+
+	a {
+		color: var(--accent-7);
+	}
+}
\ No newline at end of file
diff --git a/assets/css/partials/_header.scss b/assets/css/partials/_header.scss
new file mode 100644
index 0000000..21e746b
--- /dev/null
+++ b/assets/css/partials/_header.scss
@@ -0,0 +1,147 @@
+header {
+	border-top: 4px solid var(--accent-5);
+	background-color: #EFEFEF;
+	color: black;
+
+	display: flex;
+	flex-direction: column;
+	justify-content: space-between;
+
+	padding: 0 1rem;
+	margin-bottom: 1rem;
+
+	a {
+		display: inline-block;
+		padding-top: 0.5rem;
+		padding-bottom: calc(0.5rem - 4px);
+	}
+
+	#brand {
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		gap: 1rem;
+
+		h1 {
+			font-size: 2rem;
+			margin: 0;
+			font-weight: 900;
+			letter-spacing: 0.15rem;
+
+			a {
+				text-decoration: none;
+			}
+		}
+	}
+
+	#nav-pages {
+		display: flex;
+		flex-direction: column;
+		align-items: flex-start;
+
+		padding-inline-start: 2.5rem;
+
+		transition: max-height 0.2s linear;
+		max-height: 100vh;
+	}
+
+	#nav-socials {
+		align-self: center;
+
+		display: flex;
+		gap: 1.5rem;
+
+		transition: max-height 0.2s linear;
+		max-height: 100vh;
+
+		a {
+			font-size: 1.5rem;
+			transition: color 0.2s ease-in-out;
+			line-height: 1;
+		}
+	}
+
+	nav>a {
+		text-decoration: none;
+		font-weight: 700;
+		font-size: 1.2rem;
+		text-transform: uppercase;
+		letter-spacing: 0.1rem;
+		transition: color 0.2s ease-in-out;
+
+		&:hover {
+			color: var(--accent-3);
+		}
+
+		&.active {
+			border-bottom: 2px solid var(--accent-3);
+		}
+	}
+
+	button#mobile-menu {
+		display: block;
+		background-color: transparent;
+		border: none;
+		font-size: 2rem;
+		cursor: pointer;
+	}
+
+	&.collapsed {
+
+		#nav-pages,
+		#nav-socials {
+			max-height: 0;
+			overflow: hidden;
+		}
+	}
+}
+
+@media (min-width: 480px) {
+	header {
+		flex-direction: row;
+		align-items: center;
+		justify-content: space-between;
+
+		a {
+			padding-top: 1rem;
+			padding-bottom: calc(1rem - 4px);
+		}
+
+		#nav-pages {
+			justify-self: start;
+			flex-direction: row;
+			gap: 1.5rem;
+			padding-inline-start: 0;
+		}
+
+		button#mobile-menu {
+			display: none;
+		}
+
+		&.collapsed {
+
+			#nav-pages,
+			#nav-socials {
+				display: flex;
+				max-height: unset;
+			}
+		}
+	}
+}
+
+@media (min-width: 1024px) {
+	header {
+		padding: 0 1rem;
+		gap: 1.5rem;
+		justify-content: start;
+
+		h1 {
+			margin-bottom: 0.5rem;
+		}
+
+		#nav-socials {
+			align-self: flex-end;
+			margin-left: auto;
+		}
+	}
+}
\ No newline at end of file
diff --git a/assets/css/partials/_index.scss b/assets/css/partials/_index.scss
new file mode 100644
index 0000000..914dd5b
--- /dev/null
+++ b/assets/css/partials/_index.scss
@@ -0,0 +1,3 @@
+@import "_article";
+@import "_footer";
+@import "_header";
\ No newline at end of file
diff --git a/assets/css/partials/article.scss b/assets/css/partials/article.scss
deleted file mode 100644
index f93d460..0000000
--- a/assets/css/partials/article.scss
+++ /dev/null
@@ -1,45 +0,0 @@
-main {
-	margin: 0 auto 3rem;
-	padding: 1rem;
-	box-sizing: border-box;
-
-	max-width: 65ch;
-	width: 100%;
-	font-size: 1.25rem;
-
-	a {
-		color: var(--accent-1);
-		transition: color 0.2s ease-in-out;
-
-		&:hover {
-			color: var(--accent-2);
-		}
-	}
-
-	>* {
-		margin-top: 0;
-		margin-bottom: 1.75rem;
-	}
-
-	>p>code {
-		word-break: break-word;
-		font-size: 0.9em;
-		color: var(--accent-1);
-	}
-
-	h1 {
-		font-size: 2.25rem;
-		line-height: 1;
-		margin-bottom: 1rem;
-	}
-
-	p.meta {
-		display: block;
-		font-size: 0.85rem;
-		margin-bottom: 1rem;
-	}
-
-	pre {
-		overflow: scroll;
-	}
-}
\ No newline at end of file
diff --git a/assets/css/partials/footer.scss b/assets/css/partials/footer.scss
deleted file mode 100644
index 9c6ccc1..0000000
--- a/assets/css/partials/footer.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-footer {
-	background-color: #333;
-	color: white;
-	text-align: center;
-
-	padding: 0.5rem 1rem;
-
-	a {
-		color: var(--accent-7);
-	}
-}
\ No newline at end of file
diff --git a/assets/css/partials/header.scss b/assets/css/partials/header.scss
deleted file mode 100644
index 21e746b..0000000
--- a/assets/css/partials/header.scss
+++ /dev/null
@@ -1,147 +0,0 @@
-header {
-	border-top: 4px solid var(--accent-5);
-	background-color: #EFEFEF;
-	color: black;
-
-	display: flex;
-	flex-direction: column;
-	justify-content: space-between;
-
-	padding: 0 1rem;
-	margin-bottom: 1rem;
-
-	a {
-		display: inline-block;
-		padding-top: 0.5rem;
-		padding-bottom: calc(0.5rem - 4px);
-	}
-
-	#brand {
-		display: flex;
-		flex-direction: row;
-		align-items: center;
-		gap: 1rem;
-
-		h1 {
-			font-size: 2rem;
-			margin: 0;
-			font-weight: 900;
-			letter-spacing: 0.15rem;
-
-			a {
-				text-decoration: none;
-			}
-		}
-	}
-
-	#nav-pages {
-		display: flex;
-		flex-direction: column;
-		align-items: flex-start;
-
-		padding-inline-start: 2.5rem;
-
-		transition: max-height 0.2s linear;
-		max-height: 100vh;
-	}
-
-	#nav-socials {
-		align-self: center;
-
-		display: flex;
-		gap: 1.5rem;
-
-		transition: max-height 0.2s linear;
-		max-height: 100vh;
-
-		a {
-			font-size: 1.5rem;
-			transition: color 0.2s ease-in-out;
-			line-height: 1;
-		}
-	}
-
-	nav>a {
-		text-decoration: none;
-		font-weight: 700;
-		font-size: 1.2rem;
-		text-transform: uppercase;
-		letter-spacing: 0.1rem;
-		transition: color 0.2s ease-in-out;
-
-		&:hover {
-			color: var(--accent-3);
-		}
-
-		&.active {
-			border-bottom: 2px solid var(--accent-3);
-		}
-	}
-
-	button#mobile-menu {
-		display: block;
-		background-color: transparent;
-		border: none;
-		font-size: 2rem;
-		cursor: pointer;
-	}
-
-	&.collapsed {
-
-		#nav-pages,
-		#nav-socials {
-			max-height: 0;
-			overflow: hidden;
-		}
-	}
-}
-
-@media (min-width: 480px) {
-	header {
-		flex-direction: row;
-		align-items: center;
-		justify-content: space-between;
-
-		a {
-			padding-top: 1rem;
-			padding-bottom: calc(1rem - 4px);
-		}
-
-		#nav-pages {
-			justify-self: start;
-			flex-direction: row;
-			gap: 1.5rem;
-			padding-inline-start: 0;
-		}
-
-		button#mobile-menu {
-			display: none;
-		}
-
-		&.collapsed {
-
-			#nav-pages,
-			#nav-socials {
-				display: flex;
-				max-height: unset;
-			}
-		}
-	}
-}
-
-@media (min-width: 1024px) {
-	header {
-		padding: 0 1rem;
-		gap: 1.5rem;
-		justify-content: start;
-
-		h1 {
-			margin-bottom: 0.5rem;
-		}
-
-		#nav-socials {
-			align-self: flex-end;
-			margin-left: auto;
-		}
-	}
-}
\ No newline at end of file
-- 
cgit v1.3