Playground

.env.development

@@ -0,0 +1 @@
+API_ENDPOINT=http://localhost:8000

.env.production

@@ -0,0 +1 @@
+API_ENDPOINT=http://localhost:8000

db.json

@@ -25,7 +25,7 @@
         }
       ],
       "starterCode": "def solve(nums: list, target: int) -> list:\n\t# Code here...",
-      "timeLimit": 5
+      "timeLimit": 60
     },
     {
       "id": 3,
@@ -52,7 +52,7 @@
         }
       ],
       "starterCode": "def solve(s: str) -> int:\n\t# Code here...",
-      "timeLimit": 15
+      "timeLimit": 900
     },
     {
       "id": 4,
@@ -75,7 +75,7 @@
         }
       ],
       "starterCode": "def solve(nums1: list, nums2: list) -> float:\n\t# Code here...",
-      "timeLimit": 30
+      "timeLimit": 1800
     }
   ]
 }

src/components/Container.tsx

@@ -2,13 +2,23 @@ import { ReactNode } from "react";
 
 type Container = {
   children: ReactNode;
+  backgroundStyles?: string;
+  borderStyles?: string;
   onHover?: true;
 };
 
-const Container = ({ children, onHover }: Container) => {
+const Container = (props: Container) => {
+  const { children, backgroundStyles = "", borderStyles = "", onHover } = props;
+
   return (
-    <div className="w-fit bg-gradient-radial from-borderGradient-primary to-borderGradient-secondary p-[1px] rounded-2xl">
-      <div className={`rounded-2xl w-fit bg-gradient-radial from-cardGradient-primary to-cardGradient-secondary transition-all  ${onHover && "hover:to-cardGradient-tertiary"}`}>
+    <div
+      className={`${borderStyles} bg-gradient-radial from-borderGradient-primary to-borderGradient-secondary p-[1px] rounded-2xl`}
+    >
+      <div
+        className={`${backgroundStyles} ${
+          onHover && "hover:to-cardGradient-tertiary"
+        } rounded-2xl bg-gradient-radial from-cardGradient-primary to-cardGradient-secondary`}
+      >
         {children}
       </div>
     </div>