From afe6a6c8b77a7f1ae99190ab782cdba1f5ee422d Mon Sep 17 00:00:00 2001
From: Thomas Voss <mail@thomasvoss.com>
Date: Fri, 1 Aug 2025 21:24:48 +0200
Subject: Move .country-grid styling to the correct file

---
 src/templates/coins-designs.html.tmpl | 24 +++++++++++++++++++++++-
 src/templates/language.html.tmpl      |  4 +++-
 static/style.css                      | 23 +----------------------
 3 files changed, 27 insertions(+), 24 deletions(-)

diff --git a/src/templates/coins-designs.html.tmpl b/src/templates/coins-designs.html.tmpl
index def1e98..83164f3 100644
--- a/src/templates/coins-designs.html.tmpl
+++ b/src/templates/coins-designs.html.tmpl
@@ -1,3 +1,24 @@
+{{ define "header" }}
+<style>
+	.country-grid {
+		--button-min-width: 20ch;
+
+		row-gap: var(--spacing);
+
+		a {
+			display: flex;
+			padding-left: 0;
+			padding-block: 1ch;
+
+			> :first-child {
+				font-weight: bold;
+				width: calc(var(--form-element-spacing-horizontal) * 2 + 2ch);
+			}
+		}
+	}
+</style>
+{{ end }}
+
 {{ define "content" }}
 <header>
 	{{ template "navbar" . }}
@@ -17,7 +38,8 @@
 			role="button"
 			href="/coins/designs/{{ .Code }}"
 		>
-			{{ .Name }}
+			<span>{{ .Code | toUpper }}</span>
+			<span>{{ .Name }}</span>
 		</a>
 		{{ end }}
 	</div>
diff --git a/src/templates/language.html.tmpl b/src/templates/language.html.tmpl
index c67ca11..e8d8863 100644
--- a/src/templates/language.html.tmpl
+++ b/src/templates/language.html.tmpl
@@ -9,6 +9,8 @@
 	}
 
 	.lang-grid {
+		--button-min-width: 22ch;
+
 		button {
 			display: flex;
 			align-items: center;
@@ -18,7 +20,7 @@
 			> :first-child {
 				font-size: 2em;
 				font-weight: 600; /* Between normal and bold */
-				width: calc(var(--form-element-spacing-horizontal) * 2 + 2ch);
+				min-width: calc(var(--form-element-spacing-horizontal) * 2 + 2ch);
 			}
 			> :nth-child(2) {
 				text-align: left;
diff --git a/static/style.css b/static/style.css
index 0834d0e..e478306 100644
--- a/static/style.css
+++ b/static/style.css
@@ -2147,36 +2147,15 @@ textarea,
 	min-width: 0;
 }
 
-.country-grid {
-	row-gap: var(--grid-spacing-vertical);
-}
-
-.country-grid:first-of-type {
-	margin-top: var(--block-spacing-vertical);
-}
-
 .button-grid {
 	display: grid;
 	grid-template-columns: repeat(
 		auto-fit,
-		minmax(min(220px, 100%), 1fr)
+		minmax(min(var(--button-min-width), 100%), 1fr)
 	);
 	column-gap: var(--grid-spacing-horizontal);
 }
 
-.country-grid a {
-	display: flex;
-	align-items: center;
-	padding-left: 0;
-}
-
-.country-grid a::before {
-	content: attr(data-code);
-	font-weight: bold;
-	width: 2ch;
-	width: calc(var(--form-element-spacing-horizontal) * 2 + 2ch);
-}
-
 #nav-icon-lang a {
 	display: flex;
 	align-items: center;
-- 
cgit v1.2.3