From b433b69522c94d020cdf56ea4ec0e09d2da8a242 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Nikola=20Dere=C5=BEi=C4=87?= <nikola.derezic@gmail.com>
Date: Fri, 9 Feb 2024 10:13:13 +0100
Subject: [PATCH 1/3] full-width support for mobile

---
 app/ui/Main.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/ui/Main.tsx b/app/ui/Main.tsx
index 3e60430..41b9637 100644
--- a/app/ui/Main.tsx
+++ b/app/ui/Main.tsx
@@ -9,7 +9,7 @@ export interface MainProps {
 export const Main:FC<MainProps> = ({ children }) =>
 <main className="flex min-h-screen flex-col bg-base-300">
     <PageHeader />
-    <div className="mx-auto px-4">
+    <div className="sm:mx-auto px-4">
         {children}
     </div>
     <PageFooter />

From 6841726027985627105b11b360a6ea3d8d6c1878 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Nikola=20Dere=C5=BEi=C4=87?= <nikola.derezic@gmail.com>
Date: Fri, 9 Feb 2024 10:13:23 +0100
Subject: [PATCH 2/3] fixing spacing

---
 app/ui/AddMonthButton.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/ui/AddMonthButton.tsx b/app/ui/AddMonthButton.tsx
index b6e5f20..7616b71 100644
--- a/app/ui/AddMonthButton.tsx
+++ b/app/ui/AddMonthButton.tsx
@@ -9,7 +9,7 @@ export interface AddMonthButtonProps {
 }
 
 export const AddMonthButton:React.FC<AddMonthButtonProps> = ({ yearMonth }) =>
-<div className="card card-compact shadow-s my-1">
+<div className="card card-compact shadow-s mb-4">
     <Link href={`/year-month/${formatYearMonth(yearMonth)}/add`} className='grid self-center tooltip' data-tip="Dodaj novi mjesec">
         <span className='grid self-center'>
             <PlusCircleIcon className="h-[1em] w-[1em] cursor-pointer text-4xl"  />

From 3d335f98905d333fbb7d2a48ec7ce2f461a9bca4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Nikola=20Dere=C5=BEi=C4=87?= <nikola.derezic@gmail.com>
Date: Fri, 9 Feb 2024 10:13:45 +0100
Subject: [PATCH 3/3] fixing card min with on desktop

---
 app/ui/MonthCard.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/ui/MonthCard.tsx b/app/ui/MonthCard.tsx
index e9fea4e..09af29f 100644
--- a/app/ui/MonthCard.tsx
+++ b/app/ui/MonthCard.tsx
@@ -30,9 +30,9 @@ export const MonthCard:FC<MonthCardProps> = ({ yearMonth, children, monthlyExpen
   }, [expanded]);
 
   return(
-    <div className={`collapse collapse-plus bg-base-200 my-1 ${expanded ? "border-2 border-neutral" : ""}`} ref={elRef}>
+    <div className={`collapse collapse-plus bg-base-200 my-1 sm:min-w-[25em] ${expanded ? "border-2 border-neutral" : ""}`} ref={elRef}>
       <input type="checkbox" name="my-accordion-3" checked={expanded} onChange={handleChange} /> 
-      <div className="collapse-title text-xl font-medium">
+      <div className={`collapse-title text-xl font-medium ${expanded ? "text-white" : ""}`}>
         {`${formatYearMonth(yearMonth)}`}
         {
           monthlyExpense>0 ?