From 7663e17644d53e17238687a14917a2db3b23a573 Mon Sep 17 00:00:00 2001
From: Wanjohi <71614375+wanjohiryan@users.noreply.github.com>
Date: Sun, 15 Sep 2024 01:27:06 +0300
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20fix:=20Fix=20Portal=20on=20Safar?=
 =?UTF-8?q?i?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/ui/src/card.tsx         | 2 +-
 packages/ui/src/portal/index.tsx | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/ui/src/card.tsx b/packages/ui/src/card.tsx
index 594de47c..4bdeabd6 100644
--- a/packages/ui/src/card.tsx
+++ b/packages/ui/src/card.tsx
@@ -110,7 +110,7 @@ export const Card = component$(({ titleWidth, titleHeight, game, size, ...props
                         '--after-height': `${titleHeight}%`
                     }}
                     class={cn(
-                        "w-full mx-auto h-full relative flex overflow-hidden",
+                        "w-full rounded-xl mx-auto inset-0 h-full relative flex overflow-hidden",
                         "before:absolute before:inset-0 before:w-full before:animate-zoom-out before:h-full before:bg-cover before:bg-center before:bg-no-repeat before:bg-[url:var(--before-url)]",
                         "after:absolute after:w-[var(--after-width)] after:bg-contain after:h-[var(--after-height)] after:left-0 after:m-auto after:right-0 after:bottom-0 after:top-0 after:bg-center after:bg-no-repeat after:bg-[url:var(--title-url)]"
                     )} />
diff --git a/packages/ui/src/portal/index.tsx b/packages/ui/src/portal/index.tsx
index 28beb2c1..91304df3 100644
--- a/packages/ui/src/portal/index.tsx
+++ b/packages/ui/src/portal/index.tsx
@@ -63,9 +63,9 @@ export default component$(() => {
 
 
     return (
-        <button class="relative rounded-full size-[100px] outline-none focus:ring-2 focus:ring-primary-500 hover:ring-2 hover:ring-primary-500 transition-all duration-200">
-            <canvas class="absolute w-full h-full left-0 top-0 bottom-0 right-0" height={100} width={100} ref={buttonRef} />
-            <canvas class="relative w-full h-full z-[5] left-0 top-0 bottom-0 right-0" height={100} width={100} ref={iconRef} />
+        <button class="relative inset-0 rounded-full size-[100px] outline-none focus:ring-2 focus:ring-primary-500 hover:ring-2 hover:ring-primary-500 transition-all duration-200">
+            <canvas class="absolute w-full h-full inset-0" height={100} width={100} ref={buttonRef} />
+            <canvas class="relative w-full h-full z-[5] inset-0" height={100} width={100} ref={iconRef} />
         </button>
     )
 })
\ No newline at end of file