diff --git a/CHANGELOG.md b/CHANGELOG.md
index a203070..ace2fb6 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,7 @@
+## 1.2.0
+
+* Improve the UI for smaller screens to prevent overflows
+
 ## 1.1.1
 
 * Removed custom definition of CustomSemantics to use the one from flutter_accessibility instead
diff --git a/packages/flutter_availability/lib/src/ui/widgets/availability_clear.dart b/packages/flutter_availability/lib/src/ui/widgets/availability_clear.dart
index bf6667d..6f42052 100644
--- a/packages/flutter_availability/lib/src/ui/widgets/availability_clear.dart
+++ b/packages/flutter_availability/lib/src/ui/widgets/availability_clear.dart
@@ -70,9 +70,11 @@ class AvailabilityClearSection extends StatelessWidget {
               ),
             ),
             const SizedBox(width: 8),
-            Text(
-              unavailableText,
-              style: textTheme.bodyMedium,
+            Expanded(
+              child: Text(
+                unavailableText,
+                style: textTheme.bodyMedium,
+              ),
             ),
           ],
         ),
diff --git a/packages/flutter_availability/lib/src/ui/widgets/calendar.dart b/packages/flutter_availability/lib/src/ui/widgets/calendar.dart
index 96971d8..1eb57e1 100644
--- a/packages/flutter_availability/lib/src/ui/widgets/calendar.dart
+++ b/packages/flutter_availability/lib/src/ui/widgets/calendar.dart
@@ -73,47 +73,52 @@ class CalendarView extends StatelessWidget {
       (element) => element.templateDeviation,
     );
 
-    var monthDateSelector = Row(
-      mainAxisAlignment: MainAxisAlignment.center,
-      children: [
-        CustomSemantics(
-          identifier: identifiers.previousMonthButtonIdentifier,
-          child: IconButton(
-            padding: EdgeInsets.zero,
-            icon: const Icon(Icons.chevron_left),
-            onPressed: () {
-              onMonthChanged(
-                DateTime(month.year, month.month - 1),
-              );
-            },
-          ),
-        ),
-        const SizedBox(width: 44),
-        SizedBox(
-          width: _calculateTextWidthOfLongestMonth(context, translations),
-          child: CustomSemantics(
-            identifier: identifiers.monthNameTextIdentifier,
-            child: Text(
-              translations.monthYearFormatter(context, month),
-              style: textTheme.titleMedium,
-              textAlign: TextAlign.center,
+    var monthDateSelector = LayoutBuilder(
+      builder: (context, constraints) {
+        var monthWidth =
+            _calculateTextWidthOfLongestMonth(context, translations);
+        var sideSpace =
+            ((constraints.maxWidth - monthWidth) / 2 - 44).clamp(0.0, 44.0);
+
+        return Row(
+          mainAxisAlignment: MainAxisAlignment.center,
+          children: [
+            CustomSemantics(
+              identifier: identifiers.previousMonthButtonIdentifier,
+              child: IconButton(
+                padding: EdgeInsets.zero,
+                icon: const Icon(Icons.chevron_left),
+                onPressed: () {
+                  onMonthChanged(DateTime(month.year, month.month - 1));
+                },
+              ),
             ),
-          ),
-        ),
-        const SizedBox(width: 44),
-        CustomSemantics(
-          identifier: identifiers.nextMonthButtonIdentifier,
-          child: IconButton(
-            padding: EdgeInsets.zero,
-            icon: const Icon(Icons.chevron_right),
-            onPressed: () {
-              onMonthChanged(
-                DateTime(month.year, month.month + 1),
-              );
-            },
-          ),
-        ),
-      ],
+            SizedBox(width: sideSpace),
+            SizedBox(
+              width: monthWidth,
+              child: CustomSemantics(
+                identifier: identifiers.monthNameTextIdentifier,
+                child: Text(
+                  translations.monthYearFormatter(context, month),
+                  style: textTheme.titleMedium,
+                  textAlign: TextAlign.center,
+                ),
+              ),
+            ),
+            SizedBox(width: sideSpace),
+            CustomSemantics(
+              identifier: identifiers.nextMonthButtonIdentifier,
+              child: IconButton(
+                padding: EdgeInsets.zero,
+                icon: const Icon(Icons.chevron_right),
+                onPressed: () {
+                  onMonthChanged(DateTime(month.year, month.month + 1));
+                },
+              ),
+            ),
+          ],
+        );
+      },
     );
 
     var calendarGrid = CalendarGrid(
diff --git a/packages/flutter_availability/lib/src/ui/widgets/calendar_grid.dart b/packages/flutter_availability/lib/src/ui/widgets/calendar_grid.dart
index 731d63d..27ed6b1 100644
--- a/packages/flutter_availability/lib/src/ui/widgets/calendar_grid.dart
+++ b/packages/flutter_availability/lib/src/ui/widgets/calendar_grid.dart
@@ -167,9 +167,12 @@ class _CalendarDay extends StatelessWidget {
             children: [
               Center(
                 child: Container(
-                  padding: const EdgeInsets.symmetric(horizontal: 4),
+                  padding: const EdgeInsets.symmetric(horizontal: 2),
                   decoration: decoration,
-                  child: Text(day.date.day.toString(), style: textStyle),
+                  child: Text(
+                    day.date.day.toString(),
+                    style: textStyle,
+                  ),
                 ),
               ),
               if (day.templateDeviation) ...[
diff --git a/packages/flutter_availability/lib/src/ui/widgets/template_legend.dart b/packages/flutter_availability/lib/src/ui/widgets/template_legend.dart
index a7f780b..50306da 100644
--- a/packages/flutter_availability/lib/src/ui/widgets/template_legend.dart
+++ b/packages/flutter_availability/lib/src/ui/widgets/template_legend.dart
@@ -76,9 +76,11 @@ class _TemplateLegendState extends State<TemplateLegend> {
               const SizedBox(width: 12),
               const Icon(Icons.add, size: 20),
               const SizedBox(width: 6),
-              Text(
-                translations.createTemplateButton,
-                style: textTheme.bodyLarge,
+              Expanded(
+                child: Text(
+                  translations.createTemplateButton,
+                  style: textTheme.bodyLarge,
+                ),
               ),
             ],
           ),
diff --git a/packages/flutter_availability/pubspec.yaml b/packages/flutter_availability/pubspec.yaml
index b07ca7f..8279888 100644
--- a/packages/flutter_availability/pubspec.yaml
+++ b/packages/flutter_availability/pubspec.yaml
@@ -1,6 +1,6 @@
 name: flutter_availability
 description: "Flutter availability userstory package"
-version: 1.1.1
+version: 1.2.0
 
 publish_to: https://forgejo.internal.iconica.nl/api/packages/internal/pub
 
@@ -14,7 +14,7 @@ dependencies:
   flutter_hooks: ^0.20.5
   flutter_availability_data_interface:
     hosted: https://forgejo.internal.iconica.nl/api/packages/internal/pub
-    version: ^1.1.1
+    version: ^1.2.0
   flutter_accessibility:
     hosted: https://forgejo.internal.iconica.nl/api/packages/internal/pub
     version: ^0.0.3
diff --git a/packages/flutter_availability_data_interface/pubspec.yaml b/packages/flutter_availability_data_interface/pubspec.yaml
index d8c2b8c..27f31dd 100644
--- a/packages/flutter_availability_data_interface/pubspec.yaml
+++ b/packages/flutter_availability_data_interface/pubspec.yaml
@@ -1,6 +1,6 @@
 name: flutter_availability_data_interface
 description: "The data interface for the flutter_availability component"
-version: 1.1.1
+version: 1.2.0
 
 publish_to: https://forgejo.internal.iconica.nl/api/packages/internal/pub