From 0fa24c2d7cd18c6e226e6504235795611aba0c98 Mon Sep 17 00:00:00 2001
From: daudix <ddaudix@gmail.com>
Date: Wed, 3 Apr 2024 02:19:54 +0300
Subject: [PATCH] Sort styles using "Sort CSS" VSCode extension

---
 sass/_buttons.scss         |  20 +++----
 sass/_comments.scss        |  62 +++++++++----------
 sass/_crt.scss             |  42 ++++++-------
 sass/_footer.scss          |   4 +-
 sass/_johnvertisement.scss |   4 +-
 sass/_main.scss            | 118 ++++++++++++++++++-------------------
 sass/_media.scss           |  10 ++--
 sass/_nav.scss             |  38 ++++++------
 sass/_not-found.scss       |   4 +-
 sass/_post-nav.scss        |  12 ++--
 sass/_qrcode.scss          |   4 +-
 sass/_statements.scss      |   4 +-
 sass/_tags.scss            |  20 +++----
 13 files changed, 171 insertions(+), 171 deletions(-)

diff --git a/sass/_buttons.scss b/sass/_buttons.scss
index d09f037..ecd6114 100644
--- a/sass/_buttons.scss
+++ b/sass/_buttons.scss
@@ -1,21 +1,21 @@
 .dialog-buttons {
 	display: flex;
 	flex-direction: row;
-	align-items: baseline;
 	justify-content: space-between;
+	align-items: baseline;
 	margin-top: 6rem;
 }
 
 .inline-button {
-	background-color: var(--fg-muted-1);
-	border-radius: var(--rounded-corner);
-	box-shadow: var(--edge-highlight);
-	color: var(--fg-color);
 	display: inline-block;
-	font-size: 0.9rem;
-	padding: 0.5rem 1rem;
-	text-decoration: none;
 	transition: var(--transition);
+	box-shadow: var(--edge-highlight);
+	border-radius: var(--rounded-corner);
+	background-color: var(--fg-muted-1);
+	padding: 0.5rem 1rem;
+	color: var(--fg-color);
+	font-size: 0.9rem;
+	text-decoration: none;
 
 	&:hover {
 		background-color: var(--fg-muted-2);
@@ -27,13 +27,13 @@
 	}
 
 	&.colored {
-		background-color: transparent;
 		box-shadow: none;
+		background-color: transparent;
 		color: var(--primary-color);
 
 		&:hover {
-			background-color: var(--primary-color-alpha);
 			box-shadow: var(--edge-highlight);
+			background-color: var(--primary-color-alpha);
 		}
 	}
 }
diff --git a/sass/_comments.scss b/sass/_comments.scss
index 51286c8..675c7b5 100644
--- a/sass/_comments.scss
+++ b/sass/_comments.scss
@@ -12,13 +12,13 @@ section#comments {
 
 	.comment {
 		display: grid;
-		column-gap: 1rem;
+		grid-template-columns: min-content;
 		grid-template-areas:
 			"avatar name        "
 			"avatar time        "
 			"avatar post        "
 			"...... interactions";
-		grid-template-columns: min-content;
+		column-gap: 1rem;
 		justify-items: start;
 
 		&.comment-reply {
@@ -28,51 +28,51 @@ section#comments {
 		}
 
 		.avatar-link {
-			grid-area: avatar;
-			height: 4rem;
 			position: relative;
+			grid-area: avatar;
 			width: 4rem;
+			height: 4rem;
 
 			.avatar {
 				all: unset;
-				background-color: var(--fg-muted-1);
+				transition: var(--transition);
+				box-shadow: var(--edge-highlight), var(--shadow);
+				border-radius: var(--rounded-corner);
 				background-position: 50%;
 				background-size: cover;
-				border-radius: var(--rounded-corner);
-				box-shadow: var(--edge-highlight), var(--shadow);
+				background-color: var(--fg-muted-1);
+				width: 100%;
 				height: 100%;
 				overflow: hidden;
-				transition: var(--transition);
-				width: 100%;
 
 				&:hover {
-					box-shadow: var(--edge-highlight), var(--shadow-raised);
 					transform: rotate(10deg) scale(1.1);
+					box-shadow: var(--edge-highlight), var(--shadow-raised);
 				}
 
 				&:active {
-					box-shadow: var(--edge-highlight), var(--shadow);
 					transform: scale(var(--active));
+					box-shadow: var(--edge-highlight), var(--shadow);
 				}
 			}
 		}
 
 		.author {
-			align-items: center;
 			display: flex;
-			font-weight: bold;
-			gap: 0.25rem;
 			grid-area: name;
+			align-items: center;
+			gap: 0.25rem;
+			font-weight: bold;
 
 			.instance {
-				background-color: var(--fg-muted-1);
-				border-radius: 999px;
+				transition: var(--transition);
 				box-shadow: var(--edge-highlight);
+				border-radius: 999px;
+				background-color: var(--fg-muted-1);
+				padding: 0.25rem 0.75rem;
 				color: var(--fg-color);
 				font-size: 0.8rem;
-				padding: 0.25rem 0.75rem;
 				text-decoration: none;
-				transition: var(--transition);
 
 				&:hover {
 					background-color: var(--fg-muted-2);
@@ -86,18 +86,18 @@ section#comments {
 				&.op {
 					-webkit-backdrop-filter: unset;
 					backdrop-filter: unset;
-					background-color: transparent;
 					box-shadow: none;
+					background-color: transparent;
 					color: var(--primary-color);
 
 					&:hover {
-						background-color: var(--primary-color-alpha);
 						box-shadow: var(--edge-highlight);
+						background-color: var(--primary-color-alpha);
 					}
 
 					&::before {
-						content: "✔";
 						margin-inline-end: 0.25rem;
+						content: "✔";
 					}
 				}
 			}
@@ -106,15 +106,15 @@ section#comments {
 		.emoji {
 			all: unset;
 			display: inline;
-			height: 1.5em;
 			vertical-align: middle;
 			width: 1.5em;
+			height: 1.5em;
 		}
 
 		time {
+			grid-area: time;
 			color: var(--fg-muted-5);
 			font-size: 0.8rem;
-			grid-area: time;
 		}
 
 		main {
@@ -131,19 +131,19 @@ section#comments {
 
 			.boosts,
 			.faves {
-				background-color: transparent;
-				border-radius: 999px;
 				display: inline-block;
-				font-variant-numeric: tabular-nums;
-				margin-right: 0.25rem;
-				padding: 0.25rem 0.75rem;
-				text-decoration: none;
 				transition: var(--transition);
+				margin-right: 0.25rem;
+				border-radius: 999px;
+				background-color: transparent;
+				padding: 0.25rem 0.75rem;
+				font-variant-numeric: tabular-nums;
+				text-decoration: none;
 
 				svg {
-					margin-inline-end: 0.25rem;
-					transition: var(--transition-long);
 					vertical-align: -0.125em;
+					transition: var(--transition-long);
+					margin-inline-end: 0.25rem;
 				}
 
 				&:hover {
diff --git a/sass/_crt.scss b/sass/_crt.scss
index b5ba700..f047152 100644
--- a/sass/_crt.scss
+++ b/sass/_crt.scss
@@ -1,18 +1,18 @@
 .crt {
 	margin: 1rem 0 1rem;
+	box-shadow: 0 0 0 1px var(--primary-color-alpha), 0 2px 6px 2px var(--primary-color-alpha), 0 4px 24px 4px var(--primary-color-alpha);
 	border-radius: var(--rounded-corner);
 	background: radial-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.85)), var(--primary-color);
-	box-shadow: 0 0 0 1px var(--primary-color-alpha), 0 2px 6px 2px var(--primary-color-alpha), 0 4px 24px 4px var(--primary-color-alpha);
 
 	pre {
-		color: var(--primary-color);
-		padding: 1rem 1rem;
-		text-shadow: var(--primary-color-alpha) 0 0 4px, var(--primary-color) 0 0 12px;
+		animation: flicker 250ms alternate infinite;
+		margin: unset;
+		box-shadow: unset;
 		// Unset some <pre> stuff
 		background-color: unset;
-		box-shadow: unset;
-		margin: unset;
-		animation: flicker 250ms alternate infinite;
+		padding: 1rem 1rem;
+		color: var(--primary-color);
+		text-shadow: var(--primary-color-alpha) 0 0 4px, var(--primary-color) 0 0 12px;
 
 		@keyframes flicker {
 			from {
@@ -47,17 +47,17 @@
 	overflow: hidden;
 
 	&::before {
-		animation: scanlines 250ms linear infinite;
-		background: repeating-linear-gradient(to top, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25) 1px, transparent 3px, transparent 4px);
-		content: "";
 		display: block;
-		height: calc(100% + 0.5rem);
-		left: 0;
-		pointer-events: none;
 		position: absolute;
 		top: 0;
-		width: 100%;
+		left: 0;
 		z-index: 1;
+		animation: scanlines 250ms linear infinite;
+		background: repeating-linear-gradient(to top, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25) 1px, transparent 3px, transparent 4px);
+		width: 100%;
+		height: calc(100% + 0.5rem);
+		pointer-events: none;
+		content: "";
 
 		@keyframes scanlines {
 			from {
@@ -75,16 +75,16 @@
 	}
 
 	&::after {
+		display: block;
+		position: absolute;
+		bottom: 100%;
+		left: 0;
 		animation: scanline 5s linear infinite;
 		background: linear-gradient(to top, transparent 0%, var(--primary-color-alpha) 10%, transparent 100%);
-		bottom: 100%;
-		content: "";
-		display: block;
-		height: 8rem;
-		left: 0;
-		pointer-events: none;
-		position: absolute;
 		width: 100%;
+		height: 8rem;
+		pointer-events: none;
+		content: "";
 
 		@keyframes scanline {
 			from {
diff --git a/sass/_footer.scss b/sass/_footer.scss
index f94c4c6..1ab7d78 100644
--- a/sass/_footer.scss
+++ b/sass/_footer.scss
@@ -1,8 +1,8 @@
 #site-footer {
-	text-align: center;
+	margin-top: 4rem;
 	padding: 3rem 0 3rem;
 	font-size: 1rem;
-	margin-top: 4rem;
+	text-align: center;
 
 	details {
 		all: unset;
diff --git a/sass/_johnvertisement.scss b/sass/_johnvertisement.scss
index 6b1c63f..ff5581a 100644
--- a/sass/_johnvertisement.scss
+++ b/sass/_johnvertisement.scss
@@ -1,7 +1,7 @@
 #johnvertisement {
-	margin: 0 auto;
 	display: block;
+	margin: 0 auto;
+	border: none;
 	width: min(728px, 100vw);
 	height: min(90px, 12.367vw);
-	border: none;
 }
diff --git a/sass/_main.scss b/sass/_main.scss
index cbb6574..46a1a3e 100644
--- a/sass/_main.scss
+++ b/sass/_main.scss
@@ -5,12 +5,12 @@
 }
 
 html {
-	font-size: 16px;
+	overflow: hidden; // Disable scroll of html, scroll body instead
 	scroll-behavior: smooth;
 	// scrollbar-color: var(--primary-color) transparent;
 	accent-color: var(--primary-color);
+	font-size: 16px;
 	overflow-wrap: break-word;
-	overflow: hidden; // Disable scroll of html, scroll body instead
 
 	// Smaller font size on mobile
 	// @media only screen and (max-width: 480px) {
@@ -25,29 +25,29 @@ body {
 }
 
 body {
-	overflow: scroll; // Scroll body instead of html
-	height: 100vh;
-	font-family: var(--font-system);
-	line-height: 1.6;
-	color: var(--fg-color);
-	background: var(--bg-color);
 	// Put footer at the bottom for short pages, such as the 404
 	display: grid;
-	min-height: 100vh;
 	grid-template-rows: auto minmax(auto, 1fr) auto; // Header, stuff, footer
+	background: var(--bg-color);
+	height: 100vh;
+	min-height: 100vh;
+	overflow: scroll; // Scroll body instead of html
+	color: var(--fg-color);
+	line-height: 1.6;
+	font-family: var(--font-system);
 }
 
 // Style text selection to use primary color
 ::selection {
-	color: var(--fg-color);
 	background-color: var(--primary-color);
+	color: var(--fg-color);
 }
 
 // Make focused anchor not get covered by nav,
 // and flash it with primary color when jumping to it
 :target:not(#main) {
-	scroll-margin-top: 15vh;
 	animation: var(--transition-long) 1s highlight-in-out;
+	scroll-margin-top: 15vh;
 	color: var(--primary-color);
 	text-shadow: var(--primary-color-alpha) 0 0 4px, var(--primary-color) 0 0 12px;
 
@@ -64,8 +64,8 @@ body {
 
 // LAYOUT
 .container {
-	margin-left: auto;
 	margin-right: auto;
+	margin-left: auto;
 	width: min(var(--content-width), 90%);
 }
 
@@ -75,11 +75,11 @@ h3,
 h4,
 h5,
 h6 {
-	font-family: var(--font-serif);
-	font-weight: lighter;
-	letter-spacing: -0.05em;
-	line-height: 1.25;
 	margin: 3rem 0 1rem;
+	font-weight: lighter;
+	line-height: 1.25;
+	font-family: var(--font-serif);
+	letter-spacing: -0.05em;
 
 	.zola-anchor {
 		display: none;
@@ -88,8 +88,8 @@ h6 {
 
 	&:hover .zola-anchor {
 		display: inline-block;
-		text-decoration: none;
 		visibility: visible;
+		text-decoration: none;
 	}
 }
 
@@ -110,8 +110,8 @@ a {
 	font-weight: bold;
 
 	&:hover {
-		text-decoration: underline wavy;
 		-webkit-text-decoration: underline wavy;
+		text-decoration: underline wavy;
 	}
 }
 
@@ -124,22 +124,22 @@ dl {
 	padding: 0;
 
 	dt {
-		padding: 0;
 		margin-top: 1rem;
-		font-size: 1rem;
+		padding: 0;
 		font-weight: bold;
+		font-size: 1rem;
 	}
 
 	dd {
-		padding: 0;
 		margin-bottom: 1rem;
+		padding: 0;
 	}
 }
 
 hr {
+	margin: 2rem auto;
 	border: 0;
 	border-top: 1px solid var(--fg-muted-2);
-	margin: 2rem auto;
 	width: 100%;
 }
 
@@ -148,11 +148,11 @@ hr {
 }
 
 blockquote {
+	margin: 0;
 	border-left: 0.25rem solid var(--primary-color);
 	border-radius: 0.2rem;
-	color: var(--fg-muted-5);
-	margin: 0;
 	padding: 0 0.75rem;
+	color: var(--fg-muted-5);
 
 	& & {
 		border-radius: 0;
@@ -160,24 +160,24 @@ blockquote {
 }
 
 abbr[title] {
+	-webkit-text-decoration: underline dotted;
 	cursor: help;
 	text-decoration: underline dotted;
-	-webkit-text-decoration: underline dotted;
 }
 
 aside {
-	background-color: var(--primary-color-alpha);
-	border-radius: var(--rounded-corner);
-	box-shadow: var(--edge-highlight);
 	float: right;
 	margin-inline-start: 1rem;
+	box-shadow: var(--edge-highlight);
+	border-radius: var(--rounded-corner);
+	background-color: var(--primary-color-alpha);
 	padding: 1rem;
 	width: 30%;
 
 	@media only screen and (max-width: 720px) {
-		width: 100%;
 		float: none;
 		margin-inline-start: 0;
+		width: 100%;
 	}
 }
 
@@ -189,44 +189,44 @@ kbd {
 }
 
 code:not(pre code) {
-	background-color: var(--fg-muted-2);
-	border-radius: var(--rounded-corner-small);
 	box-shadow: var(--edge-highlight);
-	color: var(--red-fg);
+	border-radius: var(--rounded-corner-small);
+	background-color: var(--fg-muted-2);
 	padding: 0.125rem 0.375rem;
+	color: var(--red-fg);
 }
 
 pre {
-	border-radius: var(--rounded-corner);
-	box-shadow: var(--edge-highlight), var(--shadow);
-	line-height: normal; // Unset line height
 	margin: 1rem 0 1rem;
+	box-shadow: var(--edge-highlight), var(--shadow);
+	border-radius: var(--rounded-corner);
+	padding: 1rem;
 	max-width: 100vw;
 	overflow: auto;
-	padding: 1rem;
+	line-height: normal; // Unset line height
 
 	table td {
-		padding: 0;
 		border: none;
+		padding: 0;
 	}
 
 	// The line number cells
 	table td:nth-of-type(1) {
-		text-align: center;
 		user-select: none;
+		text-align: center;
 	}
 
 	mark {
-		background-color: var(--fg-muted-1);
-		border-radius: 0; // Unset code block border radius
-		color: var(--fg-color); // Unset mark color from primary color to text color
 		display: block;
+		border-radius: 0; // Unset code block border radius
+		background-color: var(--fg-muted-1);
 		padding: 0; // Unset mark padding
+		color: var(--fg-color); // Unset mark color from primary color to text color
 	}
 
 	table {
-		width: 100%;
 		border-collapse: collapse;
+		width: 100%;
 	}
 
 	// The line numbers already provide some kind of left/right padding
@@ -236,42 +236,42 @@ pre {
 }
 
 kbd {
-	background-color: var(--fg-muted-2);
-	border-radius: var(--rounded-corner-small);
-	box-shadow: inset 0 -2px 0 var(--fg-muted-2), 0 -1px 0 var(--fg-muted-3);
-	cursor: pointer;
 	display: inline-block;
+	transition: var(--transition);
+	cursor: pointer;
+	box-shadow: inset 0 -2px 0 var(--fg-muted-2), 0 -1px 0 var(--fg-muted-3);
+	border-radius: var(--rounded-corner-small);
+	background-color: var(--fg-muted-2);
+	padding: 0.125rem 0.375rem;
 	font-size: 0.8rem;
 	line-height: normal;
-	padding: 0.125rem 0.375rem;
-	transition: var(--transition);
 
 	// Small nice thingy, keys can be pressed!
 	&:active {
-		background-color: var(--fg-muted-3);
-		box-shadow: inset 0 1px 0 var(--fg-muted-2);
 		transform: translateY(2px);
+		box-shadow: inset 0 1px 0 var(--fg-muted-2);
+		background-color: var(--fg-muted-3);
 	}
 }
 
 mark {
-	background-color: var(--primary-color-alpha);
-	border-radius: var(--rounded-corner-small);
 	box-shadow: var(--edge-highlight);
-	color: var(--primary-color);
+	border-radius: var(--rounded-corner-small);
+	background-color: var(--primary-color-alpha);
 	padding: 0.125rem 0.375rem;
+	color: var(--primary-color);
 }
 
 figcaption {
 	display: block;
-	text-align: center;
 	color: var(--fg-muted-4);
 	font-size: 0.8rem;
+	text-align: center;
 }
 
 details {
-	background-color: var(--fg-muted-1);
 	border-radius: var(--rounded-corner);
+	background-color: var(--fg-muted-1);
 	padding: 1rem;
 
 	&>summary {
@@ -281,12 +281,12 @@ details {
 
 // TABLES
 table {
-	border-collapse: collapse;
-	border-radius: var(--rounded-corner);
 	box-shadow: var(--edge-highlight);
-	overflow: hidden;
-	table-layout: fixed;
+	border-radius: var(--rounded-corner);
+	border-collapse: collapse;
 	width: 100%;
+	table-layout: fixed;
+	overflow: hidden;
 
 	th {
 		font-weight: bold;
diff --git a/sass/_media.scss b/sass/_media.scss
index 1976442..e27a200 100644
--- a/sass/_media.scss
+++ b/sass/_media.scss
@@ -6,18 +6,18 @@ img {
 	}
 
 	&:not(.no-hover):hover {
-		border-radius: 0;
-		box-shadow: var(--shadow-raised);
 		transform: scale(1.1);
+		box-shadow: var(--shadow-raised);
+		border-radius: 0;
 	}
 }
 
 img,
 video {
-	border-radius: var(--rounded-corner);
-	box-shadow: var(--shadow);
 	display: block;
 	margin: 1rem auto;
+	box-shadow: var(--shadow);
+	border-radius: var(--rounded-corner);
 	max-width: 100%;
 
 	&.full {
@@ -29,8 +29,8 @@ video {
 	}
 
 	&.transparent {
-		border-radius: 0;
 		box-shadow: none;
+		border-radius: 0;
 
 		&:hover {
 			box-shadow: none;
diff --git a/sass/_nav.scss b/sass/_nav.scss
index ec2b6f3..7c2042a 100644
--- a/sass/_nav.scss
+++ b/sass/_nav.scss
@@ -1,14 +1,14 @@
 #site-nav {
 	-webkit-backdrop-filter: var(--blur);
-	backdrop-filter: var(--blur);
-	background-color: var(--nav-bg);
-	border-radius: 26px;
-	box-shadow: var(--edge-highlight), 0px 12px 24px -16px rgba(0, 0, 0, 0.5);
-	margin: 1rem auto;
-	max-width: min(calc(var(--content-width) + 10rem), 90%);
 	position: sticky;
 	top: 1rem;
 	z-index: 999;
+	backdrop-filter: var(--blur);
+	margin: 1rem auto;
+	box-shadow: var(--edge-highlight), 0px 12px 24px -16px rgba(0, 0, 0, 0.5);
+	border-radius: 26px;
+	background-color: var(--nav-bg);
+	max-width: min(calc(var(--content-width) + 10rem), 90%);
 
 	nav {
 		display: flex;
@@ -20,27 +20,27 @@
 		ul {
 			display: flex;
 			flex-wrap: wrap;
-			gap: 0.25rem;
 			justify-content: center;
+			gap: 0.25rem;
 			margin: 0;
 			padding: 0;
 		}
 
 		li {
-			list-style: none;
 			display: inline-flex;
+			list-style: none;
 		}
 
 		a {
-			border-radius: 999px;
-			color: var(--fg-muted-4);
-			padding: 0.325rem 0.75rem;
-			text-decoration: none;
 			transition: var(--transition);
+			border-radius: 999px;
+			padding: 0.325rem 0.75rem;
+			color: var(--fg-muted-4);
+			text-decoration: none;
 
 			&:hover {
-				background-color: var(--fg-muted-1);
 				box-shadow: var(--edge-highlight);
+				background-color: var(--fg-muted-1);
 				color: var(--primary-color);
 				text-decoration: none;
 			}
@@ -51,10 +51,10 @@
 		}
 
 		#main-content {
-			background: var(--bg-color);
 			position: absolute;
 			transform: translateY(-300%);
 			z-index: 999;
+			background: var(--bg-color);
 
 			&:focus {
 				transform: translateY(0);
@@ -66,18 +66,18 @@
 			margin-right: 0.625rem;
 
 			&::after {
-				background-color: var(--fg-muted-2);
-				content: "";
-				height: 110%;
 				position: absolute;
-				right: -0.5rem;
 				top: 0;
+				right: -0.5rem;
+				background-color: var(--fg-muted-2);
 				width: 1px;
+				height: 110%;
+				content: "";
 			}
 
 			a {
-				font-weight: 800;
 				color: var(--fg-muted-5);
+				font-weight: 800;
 
 				&:hover {
 					color: var(--primary-color);
diff --git a/sass/_not-found.scss b/sass/_not-found.scss
index 8b38109..80110d9 100644
--- a/sass/_not-found.scss
+++ b/sass/_not-found.scss
@@ -1,7 +1,7 @@
 #not-found {
-	width: 100%;
 	padding-top: 1rem;
 	padding-right: 35%;
-	padding-left: 35%;
 	padding-bottom: 1rem;
+	padding-left: 35%;
+	width: 100%;
 }
diff --git a/sass/_post-nav.scss b/sass/_post-nav.scss
index 53a5a96..33022bc 100644
--- a/sass/_post-nav.scss
+++ b/sass/_post-nav.scss
@@ -10,25 +10,25 @@
 		}
 
 		&:nth-child(2n + 1) {
-			padding-left: 0;
 			padding-right: 1rem;
+			padding-left: 0;
 		}
 
 		&:nth-child(2n) {
-			text-align: right;
-			padding-left: 1rem;
 			padding-right: 0;
+			padding-left: 1rem;
+			text-align: right;
 		}
 
 		.nav-arrow {
-			font-weight: normal;
-			color: var(--fg-muted-5);
 			margin-bottom: 0.5rem;
+			color: var(--fg-muted-5);
+			font-weight: normal;
 		}
 
 		.post-title {
-			color: var(--fg-color);
 			transition: var(--transition);
+			color: var(--fg-color);
 		}
 	}
 }
diff --git a/sass/_qrcode.scss b/sass/_qrcode.scss
index ab2a60a..0236bec 100644
--- a/sass/_qrcode.scss
+++ b/sass/_qrcode.scss
@@ -1,10 +1,10 @@
 #qrcode {
-	background-color: white;
 	float: right;
-	height: 150px;
 	margin: 3rem 0 0 1rem;
+	background-color: white;
 	padding: 12.5px;
 	width: 150px;
+	height: 150px;
 
 	@media only screen and (max-width: 720px) {
 		display: none;
diff --git a/sass/_statements.scss b/sass/_statements.scss
index 66823a6..59842b6 100644
--- a/sass/_statements.scss
+++ b/sass/_statements.scss
@@ -1,8 +1,8 @@
 .statement-container {
 	margin: 1rem 0 1rem;
-	padding: 1rem 1rem 0.5rem 1rem;
-	border-radius: var(--rounded-corner);
 	box-shadow: var(--edge-highlight);
+	border-radius: var(--rounded-corner);
+	padding: 1rem 1rem 0.5rem 1rem;
 
 	* {
 		margin: 0;
diff --git a/sass/_tags.scss b/sass/_tags.scss
index 92be04f..6bc48b4 100644
--- a/sass/_tags.scss
+++ b/sass/_tags.scss
@@ -1,12 +1,12 @@
 .tags {
-	list-style: none;
-	padding: 0;
 	display: inline-block;
+	padding: 0;
+	list-style: none;
 
 	li {
 		display: inline-block;
-		margin: 0 0.25rem 0.5rem 0;
 		transition: var(--transition);
+		margin: 0 0.25rem 0.5rem 0;
 
 		&:active {
 			transform: scale(var(--active));
@@ -14,17 +14,17 @@
 	}
 
 	.tag {
-		background-color: var(--fg-muted-1);
-		border-radius: 999px;
-		box-shadow: var(--edge-highlight);
-		color: var(--fg-color);
-		padding: 0.25rem 0.75rem;
-		text-decoration: none;
 		transition: var(--transition);
+		box-shadow: var(--edge-highlight);
+		border-radius: 999px;
+		background-color: var(--fg-muted-1);
+		padding: 0.25rem 0.75rem;
+		color: var(--fg-color);
+		text-decoration: none;
 
 		&:hover {
-			color: var(--primary-color);
 			background-color: var(--primary-color-alpha);
+			color: var(--primary-color);
 			text-decoration: none;
 		}