1 files changed, 31 insertions, 0 deletions
diff --git a/src/views/SummaryCard.jsx b/src/views/SummaryCard.jsx
new file mode 100644
index 0000000..ac1d23a
--- /dev/null
+++ b/src/views/SummaryCard.jsx
@@ -0,0 +1,31 @@
+import { Card, IconButton, Typography } from '@mui/joy'
+
+const SummaryCard = () => {
+  return (
+    <Card>
+      <div className='flex justify-between'>
+        <div>
+          <Typography level='h2'>Summary</Typography>
+          <Typography level='body-xs'>
+            This is a summary of your chores
+          </Typography>
+        </div>
+        <IconButton>
+          <MoreVert />
+        </IconButton>
+      </div>
+      <div className='flex justify-between'>
+        <div>
+          <Typography level='h3'>Due Today</Typography>
+          <Typography level='h1'>3</Typography>
+        </div>
+        <div>
+          <Typography level='h3'>Overdue</Typography>
+          <Typography level='h1'>1</Typography>
+        </div>
+      </div>
+    </Card>
+  )
+}
+
+export default SummaryCard