From c248dd80e2d6c66efdbca2eb74502ca3c93aabf5 Mon Sep 17 00:00:00 2001
From: Patrick Alvin Alcala <patrick_alv@yahoo.com>
Date: Wed, 24 Sep 2025 14:02:01 +0800
Subject: [PATCH] Added padding as props

---
 src/components/Box/Box.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/Box/Box.tsx b/src/components/Box/Box.tsx
index 947b06a..80cf5a4 100644
--- a/src/components/Box/Box.tsx
+++ b/src/components/Box/Box.tsx
@@ -6,13 +6,14 @@ interface Props {
   color?: string
   children: JSXElement
   curved?: boolean
+  padding?: number
 }
 
 export default (props: Props) => {
   const boxClass = createMemo(() => (props.curved ? 'curvedbox' : 'box'))
 
   return (
-    <section class={boxClass()} style={{ border: `${props.thickness}px solid ${props.color || 'white'}` }}>
+    <section class={boxClass()} style={`border: ${props.thickness}px solid ${props.color || 'white'}; padding: ${props.padding}rem`}>
       {props.children}
     </section>
   )