From 61c1e88dcfb9f4a20bd6f8082d9891854916f482 Mon Sep 17 00:00:00 2001
From: Razboy20 <razboy20@gmail.com>
Date: Wed, 13 Mar 2024 17:29:11 -0500
Subject: [PATCH] style: fix centering of radio item (#156)

---
 .../ScheduleListItem/ScheduleListItem.tsx      | 18 ++++++++----------
 1 file changed, 8 insertions(+), 10 deletions(-)

diff --git a/src/views/components/common/ScheduleListItem/ScheduleListItem.tsx b/src/views/components/common/ScheduleListItem/ScheduleListItem.tsx
index 6c69a950..0a40f246 100644
--- a/src/views/components/common/ScheduleListItem/ScheduleListItem.tsx
+++ b/src/views/components/common/ScheduleListItem/ScheduleListItem.tsx
@@ -34,16 +34,14 @@ export default function ScheduleListItem({ style, name, dragHandleProps, onClick
                         <DragIndicatorIcon className='h-6 w-6 cursor-move text-zinc-300 btn-transition -ml-1.5 hover:text-zinc-400' />
                     </div>
                     <div className='group inline-flex items-center justify-center gap-1.5' onClick={onClick}>
-                        <div className='h-5.5 w-5.5 flex items-center justify-center border-2px border-current rounded-full btn-transition group-active:scale-95'>
-                            <div
-                                className={clsx(
-                                    'bg-current h-2.9 w-2.9 rounded-full transition tansform scale-100 ease-out-expo duration-250',
-                                    {
-                                        'scale-0! opacity-0 ease-in-out! duration-200!': !isActive,
-                                    }
-                                )}
-                            />
-                        </div>
+                        <div
+                            className={clsx(
+                                'h-5.5 w-5.5 relative border-2px border-current rounded-full btn-transition group-active:scale-95 after:(absolute content-empty bg-current h-2.9 w-2.9 rounded-full transition tansform scale-100 ease-out-expo duration-250 -translate-x-1/2 -translate-y-1/2 top-1/2 left-1/2)',
+                                {
+                                    'after:(scale-0! opacity-0 ease-in-out! duration-200!)': !isActive,
+                                }
+                            )}
+                        />
                         <Text variant='p'>{name}</Text>
                     </div>
                 </div>