From 788957e7127907e6d9328b86202749a5593173a6 Mon Sep 17 00:00:00 2001
From: Ross Edfort <rossedfort@gmail.com>
Date: Tue, 10 Oct 2023 09:52:37 -0600
Subject: [PATCH] fix radio input

---
 .../holocene/radio-input/radio-input.svelte   | 25 ++++++++-----------
 1 file changed, 10 insertions(+), 15 deletions(-)

diff --git a/src/lib/holocene/radio-input/radio-input.svelte b/src/lib/holocene/radio-input/radio-input.svelte
index 3801c722c..39ea6a3f1 100644
--- a/src/lib/holocene/radio-input/radio-input.svelte
+++ b/src/lib/holocene/radio-input/radio-input.svelte
@@ -38,7 +38,6 @@
     {id}
     {...$$restProps}
   />
-  <span class="checkmark" />
   <span class="label" class:hidden={labelHidden}>
     {label}
   </span>
@@ -46,26 +45,22 @@
 
 <style lang="postcss">
   label {
-    @apply relative flex grow cursor-pointer flex-row items-center gap-1 text-sm focus:outline-none;
+    @apply flex grow cursor-pointer flex-row items-center gap-1 text-sm focus:outline-none;
   }
 
   input[type='radio'] {
-    @apply sr-only;
-  }
-
-  input[type='radio']:checked + .checkmark {
-    @apply border-indigo-600 bg-indigo-600 after:block;
-  }
+    @apply relative box-content h-4 w-4 cursor-pointer appearance-none rounded-full border border-gray-300 bg-white;
 
-  .label {
-    @apply ml-6;
+    &::after {
+      @apply absolute top-1 left-1 h-0 w-0 scale-0 rounded-full bg-white transition-transform content-[''];
+    }
   }
 
-  .checkmark {
-    @apply absolute left-0 box-content h-4 w-4 rounded-full border border-gray-300 bg-white;
-  }
+  input[type='radio']:checked {
+    @apply border-indigo-600 bg-indigo-600;
 
-  .checkmark::after {
-    @apply absolute top-1 left-1 hidden h-2 w-2 rounded-full bg-white content-[''];
+    &::after {
+      @apply h-2 w-2 scale-100;
+    }
   }
 </style>