diff --git a/lib/pages/calendar.dart b/lib/pages/calendar.dart
index 14a695d..3f4b394 100644
--- a/lib/pages/calendar.dart
+++ b/lib/pages/calendar.dart
@@ -46,53 +46,76 @@ class _CalendarScreenState extends State<CalendarScreen> {
     return Scaffold(
       body: _selectedDateRange == null
           ? const Padding(
-              padding: EdgeInsets.all(30),
+              padding: EdgeInsets.all(16),
               child: Center(
                 child:
                     Text('Select the date range by using the calendar button'),
               ),
             )
           : Padding(
-              padding: const EdgeInsets.all(30),
-              child: Center(
-                child: Column(
-                  crossAxisAlignment: CrossAxisAlignment.start,
-                  children: [
-                    const Text("Dates",
-                        style: TextStyle(
-                            fontSize: 30, fontWeight: FontWeight.bold)),
-                    const Text("Start Date", style: TextStyle(fontSize: 14)),
-                    const SizedBox(height: 5),
-                    Text(
-                      startDateString,
-                      style: const TextStyle(
-                          fontSize: 22, fontWeight: FontWeight.bold),
-                    ),
-                    const SizedBox(height: 10),
-                    const Text("End Date", style: TextStyle(fontSize: 14)),
-                    const SizedBox(height: 5),
-                    Text(endDateString,
-                        style: const TextStyle(
-                            fontSize: 22, fontWeight: FontWeight.bold)),
-                    const SizedBox(height: 20),
-                    const Text("Difference",
-                        style: TextStyle(
-                            fontSize: 30, fontWeight: FontWeight.bold)),
-                    const Text("Date Range", style: TextStyle(fontSize: 14)),
-                    Text(
-                        "${diffYMD[3]} days \n${diffYMD[2]} weeks \n${diffYMD[1]} months\n${diffYMD[0]} years",
-                        style: const TextStyle(
-                            fontSize: 24, fontWeight: FontWeight.bold)),
-                    const SizedBox(height: 10),
-                    const Text("Date Range in days",
-                        style: TextStyle(fontSize: 14)),
-                    Text("$diffD days",
-                        style: const TextStyle(
-                            fontSize: 24, fontWeight: FontWeight.bold)),
-                  ],
-                ),
-              ),
-            ),
+              padding: const EdgeInsets.all(16),
+              child: Column(children: [
+                Card(
+                    child: Padding(
+                        padding: const EdgeInsets.all(16),
+                        child: SizedBox(
+                          width: double.infinity,
+                          child: Column(
+                            mainAxisSize: MainAxisSize.min,
+                            crossAxisAlignment: CrossAxisAlignment.start,
+                            children: [
+                              const Text("Difference",
+                                  style: TextStyle(
+                                    fontSize: 40,
+                                  )),
+                              const Text("Date Range",
+                                  style: TextStyle(fontSize: 14)),
+                              Text(
+                                  "${diffYMD[3]} days \n${diffYMD[2]} weeks \n${diffYMD[1]} months\n${diffYMD[0]} years",
+                                  style: const TextStyle(
+                                      fontSize: 24,
+                                      fontWeight: FontWeight.bold)),
+                              const SizedBox(height: 10),
+                              const Text("Date Range in days",
+                                  style: TextStyle(fontSize: 14)),
+                              Text("$diffD days",
+                                  style: const TextStyle(
+                                      fontSize: 24,
+                                      fontWeight: FontWeight.bold)),
+                            ],
+                          ),
+                        ))),
+                const SizedBox(height: 16),
+                Card(
+                  child: Padding(
+                    padding: const EdgeInsets.all(16),
+                    child: SizedBox(
+                        width: double.infinity,
+                        child: Column(
+                          mainAxisSize: MainAxisSize.min,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: [
+                            const Text("Dates", style: TextStyle(fontSize: 40)),
+                            const Text("Start Date",
+                                style: TextStyle(fontSize: 14)),
+                            const SizedBox(height: 5),
+                            Text(
+                              startDateString,
+                              style: const TextStyle(
+                                  fontSize: 22, fontWeight: FontWeight.bold),
+                            ),
+                            const SizedBox(height: 10),
+                            const Text("End Date",
+                                style: TextStyle(fontSize: 14)),
+                            const SizedBox(height: 5),
+                            Text(endDateString,
+                                style: const TextStyle(
+                                    fontSize: 22, fontWeight: FontWeight.bold)),
+                          ],
+                        )),
+                  ),
+                )
+              ])),
       // This button is used to show the date range picker
       floatingActionButton: FloatingActionButton(
         onPressed: showRangeDialog,
diff --git a/lib/widgets/dialogs/community.dart b/lib/widgets/dialogs/community.dart
index 112632f..9316e75 100644
--- a/lib/widgets/dialogs/community.dart
+++ b/lib/widgets/dialogs/community.dart
@@ -39,7 +39,8 @@ Future<void> communityDialogBuilder(BuildContext context) {
           SimpleDialogOption(
             onPressed: () async {
               await launchUrl(
-                  Uri.parse('matrix.to/#/#datecalc:matrix.winscloud.net'),
+                  Uri.parse(
+                      'https://matrix.to/#/#datecalc:matrix.winscloud.net'),
                   mode: LaunchMode.externalApplication);
             },
             child: Row(
diff --git a/linux/net.winscloud.DateCalculator.appdata.xml b/linux/net.winscloud.DateCalculator.appdata.xml
index c480b3f..1542336 100644
--- a/linux/net.winscloud.DateCalculator.appdata.xml
+++ b/linux/net.winscloud.DateCalculator.appdata.xml
@@ -40,6 +40,10 @@
       <image>https://raw.githubusercontent.com/AtiusAmy/atiusamy.github.io/master/images/2020-07-12_17.29.36.png</image>
     </screenshot>
   </screenshots>
+  <branding>
+    <color type="primary" scheme_preference="light">#6f6385</color>
+    <color type="primary" scheme_preference="dark">#130b22</color>
+  </branding>
   <content_rating type="oars-1.0"/>
   <releases>
     <release version="0.0.7" date="2024-03-03">