clean pronouns

assets/site.css

@@ -79,12 +79,12 @@ header.padded,
 main {
 	padding-left: 1em;
 	padding-right: 1em;
+	align-items: center;
 }
 
 header {
 	display: flex;
 	justify-content: space-between;
-	align-items: center;
 }
 
 section {
@@ -229,6 +229,10 @@ input#ident {
 	letter-spacing: .1ch;
 }
 
+.pronoun_fragment {
+	font-weight: bold;
+}
+
 .profile h2 {
 	font-size: 2em;
 }

templates/macros.html.tera

@@ -0,0 +1,7 @@
+{% macro pretty_pronouns(pronouns) %}
+{% set fragments = pronouns | split(pat="/") %}
+{% for fr in fragments %}
+<span class="pronoun_fragment">{{fr}}</span>
+{% if not loop.last %}/{% endif %}
+{% endfor %}
+{% endmacro pretty_pronouns %}

templates/show_profile.html.tera

@@ -1,4 +1,6 @@
 {% extends "base" %}
+{% import "macros" as macros %}
+
 {% block title %}{{ profile.name }} - {% endblock title %}
 {% block main %}
 <section class="raised profile">
@@ -11,7 +13,7 @@
 			Not microchipped
 			{% endif %}
 		</p>
-		<p class="pronouns">{{profile.pronouns}}</p>
+		<p class="pronouns">{{ macros::pretty_pronouns(pronouns=profile.pronouns) }}</p>
 	</header>
 	<h2>{{profile.name}}</h2>