From: Omar Polo <op@omarpolo.com>
Subject: Re: httpd: improve directory index CSS
To: "Paul W. Rankin" <hello@paulwrankin.com>
Cc: tech@openbsd.org
Date: Fri, 31 May 2024 11:53:04 +0200

On 2024/05/31 15:23:25 +1000, "Paul W. Rankin" <hello@paulwrankin.com> wrote:
> It looks like the original email was blackholed. Here it is again...
> 
> This patch adds the CSS property font-variant-emoji: text to the 
> directory index. When supported this property prevents the unicode "up 
> and down" arrow being displayed as an emoji. Currently this property 
> needs to be explicitly enabled by users in Firefox and Safari, but will 
> hopefully be default soon.
> 
> More info:
> https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-emoji

so this should prevent future browsers from rendering the "up and down"
character in colours.  the mdn page is a bit vague in terms of what will
be the default value, saying that it's os-dependant.

however, i'm for a more sober design, and the cost of keeping one css
property is negligible.

> This patch also removes the italic styling on directories. I think this 
> is preferable because the directories are already bold and the italics 
> make the bottom of the characters squash up against each other.

fwiw I agree, i think it's more readable without italic.

by the way, the diff was mangled by your MUA, but can't help with
setting up apple mail (deduced from the headers) so that i doesn't
mangle whitespaces.  i'm reattaching your diff.

(to test you can try sending a diff to yourself and apply it)

Index: css.h.in
===================================================================
RCS file: /home/cvs/src/usr.sbin/httpd/css.h.in,v
diff -u -p -r1.1 css.h.in
--- css.h.in	4 Jan 2024 18:17:47 -0000	1.1
+++ css.h.in	31 May 2024 09:45:19 -0000
@@ -3,6 +3,7 @@ body {
     background-color: white; 
     color: black; 
     font-family: sans-serif;
+    font-variant-emoji: text;
 }
 table {
     border-collapse: collapse; 
@@ -18,7 +19,6 @@ tr.sort th.sorted { font-weight: bold; }
 tr.sort th::after { content: "\a0\2195"; }
 tr.dir td:nth-child(2n+1) { 
     font-weight: bold; 
-    font-style: italic; 
 }
 td, th { padding: 2pt 2em; }
 td:first-child, th:first-child { padding-left: 5pt; }