fixed button style on mac

NwinNwin · Sep 22, 2023 · 8eb0289 · 8eb0289
1 parent cc0f76b
commit 8eb0289
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 7 deletions.
diff --git a/src/components/CreateModal/CreateModal.jsx b/src/components/CreateModal/CreateModal.jsx
@@ -112,15 +112,17 @@ export default function CreateModal({
     <>
       {isCreate ? (
         <Button
-          h={{ base: "10vh", md: "7vh" }}
-          w={{ base: "40vw", md: "8vw" }}
+          // h={{ base: "10vh", md: "7vh" }}
+          // w={{ base: "40vw", md: "" }}
           boxShadow="xl"
           _hover={{ bg: "#b4dbd9" }}
           backgroundColor="#33b249"
           color="white"
           fontSize="xl"
           fontWeight="bold"
-          borderRadius={20}
+          borderRadius={30}
+          size={"lg"}
+          paddingY={{ base: 10, md: 8 }}
           onClick={() => {
             if (user) {
               onOpen();

diff --git a/src/components/Home/Home.jsx b/src/components/Home/Home.jsx
@@ -377,13 +377,16 @@ export default function Home() {
           ) : (
             <>
               <Button
-                backgroundColor="#a881af"
-                boxShadow="2xl"
-                color="white"
+                backgroundColor="white"
+                variant="outline"
+                boxShadow="7px 7px 14px #666666,
+                -7px -7px 14px #ffffff;"
+                color="#74a2fa"
                 onClick={onOpen}
                 fontSize={{ base: "xl", md: "2xl" }}
                 size="lg"
                 gap={2}
+                borderRadius={"lg"}
               >
                 <SettingsIcon />
                 Filter
@@ -400,9 +403,12 @@ export default function Home() {
                 colorScheme="blue"
                 onClick={onResultsBarOpen}
                 fontSize="2xl"
-                boxShadow="2xl"
+                boxShadow="12px 12px 24px #a8a8a8,
+                -12px -12px 24px #ffffff;"
                 size="lg"
                 gap={2}
+                justifyContent={"center"}
+                alignItems={"center"}
               >
                 <StarIcon />
               </Button>