tidy: nicer tag padding

ethanthoma · Oct 28, 2024 · d1a7da9 · d1a7da9
1 parent 84ae79c
commit d1a7da9
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 14 deletions.
diff --git a/services/webserver/main.go b/services/webserver/main.go
@@ -38,6 +38,8 @@ func main() {
 		w.WriteHeader(http.StatusOK)
 	})
 
+	// pages
+
 	navList := []string{"home", "blog"}
 
 	pageHome := pages.Home{Pages: navList}
@@ -68,6 +70,7 @@ func main() {
 	})
 
 	// static
+
 	http.Handle("GET /public/", http.StripPrefix("/public/", staticHandler(http.Dir("public"))))
 	http.Handle("GET /robots.txt", staticHandler(http.Dir("public/seo")))
 
@@ -104,7 +107,6 @@ func slugToHTML(slug string) (internal.Post, error) {
 func staticHandler(root http.FileSystem) http.HandlerFunc {
 	fileServer := http.FileServer(root)
 
-	// Calculate ETags once at startup
 	etagCache := make(map[string]string)
 	if dir, ok := root.(http.Dir); ok {
 		if err := filepath.Walk(string(dir), func(path string, info os.FileInfo, err error) error {
@@ -127,11 +129,9 @@ func staticHandler(root http.FileSystem) http.HandlerFunc {
 	}
 
 	return func(w http.ResponseWriter, r *http.Request) {
-		// Get ETag if we have one
 		if etag, ok := etagCache[r.URL.Path]; ok {
 			w.Header().Set("ETag", etag)
 
-			// Check If-None-Match
 			if match := r.Header.Get("If-None-Match"); match != "" {
 				if strings.Contains(match, etag) {
 					w.WriteHeader(http.StatusNotModified)

diff --git a/services/webserver/pages/home.templ b/services/webserver/pages/home.templ
@@ -83,6 +83,18 @@ templ (p Home) View() {
 				</ul>
 			</section>
 			<section class="mt-m-l">
+				<h2 class="mb-xs-s text-lg border-b-2 border-content/80">Skills:</h2>
+				<div class="flex flex-wrap gap-xs justify-start">
+					for _, tag := range tags {
+						<span class="px-xs py-3xs text-sm tracking-tight border-2 flex gap-2xs items-center text-content/80 flex-grow">
+							<svg class="w-xs h-xs text-content/80" aria-hidden="true">
+								<use href={ "#icon-" + tag }></use>
+							</svg>
+							<span class="flex-grow text-center">{ tag }</span>
+						</span>
+					}
+					<span class="flex-grow-[999]"></span>
+				</div>
 				<svg xmlns="http://www.w3.org/2000/svg" class="hidden invisible">
 					<!-- Python -->
 					<symbol id="icon-python" viewBox="0 0 128 128" fill="currentColor">
@@ -116,17 +128,6 @@ templ (p Home) View() {
 						<path d="M400.1 194.8C389.2 197.6 380.2 199.1 371 202.4C363.7 204.3 356.3 206.3 347.8 208.5L347.2 208.6C343 209.8 342.6 209.9 338.7 205.4C334 200.1 330.6 196.7 324.1 193.5C304.4 183.9 285.4 186.7 267.7 198.2C246.5 211.9 235.6 232.2 235.9 257.4C236.2 282.4 253.3 302.9 277.1 306.3C299.1 309.1 316.9 301.7 330.9 285.8C333 283.2 334.9 280.5 337 277.5V277.5L337 277.5C337.8 276.5 338.5 275.4 339.3 274.2H279.2C272.7 274.2 271.1 270.2 273.3 264.9C277.3 255.2 284.8 239 289.2 230.9C290.1 229.1 292.3 225.1 296.1 225.1H397.2C401.7 211.7 409 198.2 418.8 185.4C441.5 155.5 468.1 139.9 506 133.4C537.8 127.8 567.7 130.9 594.9 149.3C619.5 166.1 634.7 188.9 638.8 218.8C644.1 260.9 631.9 295.1 602.1 324.4C582.4 345.3 557.2 358.4 528.2 364.3C522.6 365.3 517.1 365.8 511.7 366.3C508.8 366.5 506 366.8 503.2 367.1C474.9 366.5 449 358.4 427.2 339.7C411.9 326.4 401.3 310.1 396.1 291.2C392.4 298.5 388.1 305.6 382.1 312.3C360.5 341.9 331.2 360.3 294.2 365.2C263.6 369.3 235.3 363.4 210.3 344.7C187.3 327.2 174.2 304.2 170.8 275.5C166.7 241.5 176.7 210.1 197.2 184.2C219.4 155.2 248.7 136.8 284.5 130.3C313.8 124.1 341.8 128.4 367.1 145.6C383.6 156.5 395.4 171.4 403.2 189.5C405.1 192.3 403.8 193.9 400.1 194.8zM48.3 200.4C47.1 200.4 46.7 199.8 47.4 198.8L53.9 190.4C54.5 189.5 56.1 188.9 57.3 188.9H168.6C169.8 188.9 170.1 189.8 169.5 190.7L164.2 198.8C163.6 199.8 162 200.7 161.1 200.7L48.3 200.4zM1.2 229.1C0 229.1-.3 228.4 .3 227.5L6.9 219.1C7.5 218.2 9 217.5 10.3 217.5H152.4C153.6 217.5 154.2 218.5 153.9 219.4L151.4 226.9C151.1 228.1 149.9 228.8 148.6 228.8L1.2 229.1zM75.7 255.9C75.1 256.8 75.4 257.7 76.7 257.7L144.6 258C145.5 258 146.8 257.1 146.8 255.9L147.4 248.4C147.4 247.1 146.8 246.2 145.5 246.2H83.2C82 246.2 80.7 247.1 80.1 248.1L75.7 255.9zM577.2 237.9C577 235.3 576.9 233.1 576.5 230.9C570.9 200.1 542.5 182.6 512.9 189.5C483.9 196 465.2 214.4 458.4 243.7C452.8 268 464.6 292.6 487 302.6C504.2 310.1 521.3 309.2 537.8 300.7C562.4 287.1 575.8 268 577.4 241.2C577.3 240 577.3 238.9 577.2 237.9z"></path>
 					</symbol>
 				</svg>
-				<h2 class="mb-xs-s text-lg border-b-2 border-content/80">Skills:</h2>
-				<div class="flex flex-wrap gap-xs">
-					for _, tag := range tags {
-						<span class="px-xs py-3xs text-sm tracking-tight border-2 flex gap-2xs items-center text-content/80">
-							<svg class="w-xs h-xs text-content/80" aria-hidden="true">
-								<use href={ "#icon-" + tag }></use>
-							</svg>
-							<span>{ tag }</span>
-						</span>
-					}
-				</div>
 			</section>
 		</article>
 	}