From aefdd0169b0170c8c264374474e4eeeab2920cc9 Mon Sep 17 00:00:00 2001
From: violette <vi@violette.town>
Date: Fri, 19 Dec 2025 09:54:28 +0100
Subject: Updated CSS.

---
 doc/style.css | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

(limited to 'doc/style.css')

diff --git a/doc/style.css b/doc/style.css
index 5289332..2981926 100644
--- a/doc/style.css
+++ b/doc/style.css
@@ -32,7 +32,10 @@ blockquote { font-style: italic; }
 .snac-list-of-lists li { display: inline; border: 1px solid #a0a0a0; border-radius: 25px;
   margin-right: 0.5em; padding-left: 0.5em; padding-right: 0.5em; }
 .snac-no-more-unseen-posts { border-top: 1px solid #a0a0a0; border-bottom: 1px solid #a0a0a0; padding: 0.5em 0; margin: 1em 0; }
-@media (prefers-color-scheme: dark) { 
+.snac-reaction { padding:5px; padding-left: 10px; padding-right: 10px; display: inline-flex; margin-right: 5px; font-family: inherit; font-size: medium; height: 2.5rem; vertical-align:middle; align-items:center;}
+.snac-reaction-image { max-width: 100%; max-height: 100%; }
+.snac-reaction-div { border-left: darkgray; border-left-style: solid; margin-bottom: .3em; padding-left: .3em; border-left-width: 2px; }
+@media (prefers-color-scheme: dark) {
   body, input, textarea { background-color: #000; color: #fff; }
   a { color: #7799dd }
   a:visited { color: #aa99dd }
-- 
cgit 


From f5ad346f7d819a1fe71ac6f1bc98e16fe1aead01 Mon Sep 17 00:00:00 2001
From: violette <vi@violette.town>
Date: Mon, 12 Jan 2026 05:09:21 +0100
Subject: Use the metadata pronouns.

---
 doc/style.css |  1 +
 html.c        | 38 ++++++++++++++++++++++++++++++++++++++
 utils.c       |  1 +
 3 files changed, 40 insertions(+)

(limited to 'doc/style.css')

diff --git a/doc/style.css b/doc/style.css
index 2981926..9c8764a 100644
--- a/doc/style.css
+++ b/doc/style.css
@@ -40,3 +40,4 @@ blockquote { font-style: italic; }
   a { color: #7799dd }
   a:visited { color: #aa99dd }
 }
+select { max-width: 40%; }
diff --git a/html.c b/html.c
index ebd9331..9aaaa50 100644
--- a/html.c
+++ b/html.c
@@ -162,6 +162,31 @@ xs_str *actor_name(xs_dict *actor, const char *proxy)
 }
 
 
+xs_str *actor_pronouns(xs_dict *actor)
+/* gets the actor name */
+{
+    const xs_list *attachment;
+    const xs_dict *d;
+    const char *pronouns = "";
+    char *ret;
+
+    if (!xs_is_null((attachment = xs_dict_get(actor, "attachment")))) {
+        xs_list_foreach(attachment, d) {
+            char *prop = xs_utf8_to_lower(xs_dict_get(d, "name"));
+            /* make sure that we are reading the correct metadata */
+            if (strlen(prop) == 8 && strcmp(prop, "pronouns") == 0)
+                pronouns = xs_dict_get(d, "value");
+        }
+    }
+
+    /* <p> breaks page, cannot nest them */
+    ret = xs_replace_i(xs_dup(pronouns), "<p>", "");
+    ret = xs_replace_i(ret, "</p>", "");
+
+    return ret;
+}
+
+
 xs_str *format_text_with_emoji(snac *user, const char *text, int ems, const char *proxy)
 /* needed when we have local text with no tags attached */
 {
@@ -195,6 +220,10 @@ xs_html *html_actor_icon(snac *user, xs_dict *actor, const char *date,
     int fwer = 0;
 
     xs *name = actor_name(actor, proxy);
+    xs *pronouns = actor_pronouns(actor);
+    char pronouns_c = 0;
+    if (*pronouns != '\0')
+        pronouns_c = 1;
 
     /* get the avatar */
     if ((v = xs_dict_get(actor, "icon")) != NULL) {
@@ -251,6 +280,15 @@ xs_html *html_actor_icon(snac *user, xs_dict *actor, const char *date,
                 xs_html_text("»")));
     }
 
+    if (pronouns_c > 0)
+        xs_html_add(actor_icon,
+            xs_html_text(" "),
+            xs_html_tag("span",
+                xs_html_attr("class",   "snac-pronouns"),
+                xs_html_attr("title",   "user's pronouns"),
+                xs_html_raw(pronouns)));
+
+
     if (strcmp(xs_dict_get(actor, "type"), "Service") == 0) {
         xs_html_add(actor_icon,
             xs_html_text(" "),
diff --git a/utils.c b/utils.c
index fd077f6..9f4e1b7 100644
--- a/utils.c
+++ b/utils.c
@@ -88,6 +88,7 @@ static const char * const default_css =
     "  a { color: #7799dd }\n"
     "  a:visited { color: #aa99dd }\n"
     "}\n"
+    "select { max-width: 40%; }\n"
 ;
 
 const char *snac_blurb =
-- 
cgit