From 93b6970331118963a54930ed029b23854f5c2062 Mon Sep 17 00:00:00 2001
From: Isaiah Odhner <isaiahodhner@gmail.com>
Date: Fri, 1 Mar 2024 14:08:17 -0500
Subject: [PATCH] Fix clicking radio buttons directly

I always tend to click on the radio option labels, as it's a larger
click target, easier to reach with the mouse, so I missed that clicking
the radio button (circular control) was broken.

98.css hides the real `<input type="radio">` and replaces it with a
pseudo element on the `<label>` element to visually replace it.
Normally it's clickable in the same way that the `<label>` is clickable,
since the pseudo element is logically part of the `<label>`.
However, I have an overly broad selector for pseudo elements, which was
making them unclickable.

Fixes https://github.com/1j01/jspaint/issues/311
Fixes https://github.com/1j01/jspaint/issues/312
---
 styles/layout.css | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/styles/layout.css b/styles/layout.css
index 7cdedf73..2595ee80 100644
--- a/styles/layout.css
+++ b/styles/layout.css
@@ -951,9 +951,14 @@ html, body, .jspaint {
 	text-decoration: underline;
 }
 
+/* TODO: reduce scope of this rule, and remove exception(s) to it */
 ::before, ::after {
 	pointer-events: none;
 }
+/* Quick fix for clicking directly on the radio button in themes which use styles from 98.css */
+input[type="radio"] + label::before {
+	pointer-events: all;
+}
 
 .cursor-bully * {
 	cursor: inherit !important;