2024-12-16

server/app/templates/style.css

@@ -3,13 +3,19 @@
     box-sizing: border-box; /* Include padding and borders in size calculations */
 }
 html, body {
-    width: 600px;
-    height: 800px;
     margin: 0; /* Prevent any default margins */
     padding: 0;
 }
 
+body {
+    width: 600px;
+    height: 800px;
+    border: 2px solid red; /* Visual aid */
+}
+
 .dashboard {
+    border: 2px solid green; /* Visual aid */
+
     display: -webkit-box;
     display: -webkit-flex;
     display: flex;
@@ -49,7 +55,7 @@ html, body {
     font-size: 60px;
     font-weight: bold;
     vertical-align: top;
-    text-align: right !important;
+    text-align: right;
 }
 
 .splitpanel .weather-icon {
@@ -71,6 +77,7 @@ html, body {
 }
 
 .panel.bottom.week .row {
+    border: 2px solid yellow; /* Visual aid */
     display: -webkit-box;
     display: -webkit-flex;
     display: flex;
@@ -78,6 +85,8 @@ html, body {
     -webkit-flex: 1;
     flex: 1;
     height: 50%;
+    align-items: stretch; /* Stretch children to fill the width (optional) */
+
 }
 
 .panel.bottom.week .row .day {
@@ -85,13 +94,11 @@ html, body {
     display: -webkit-flex;
     display: flex;
     -webkit-box-orient: vertical; /* Old WebKit property for column layout */
-    -webkit-box-direction: normal; /* Old WebKit property for forward direction */
+    -webkit-box-direction: column; /* Old WebKit property for forward direction */
     -webkit-flex-direction: column; /* Flexbox column direction for modern WebKit */
     flex-direction: column; /* Standard Flexbox column layout */
     border-style: solid;
-    width: 135px; /* Fixed width for each day */
     margin: 1px;
-    align-items: stretch; /* Stretch children to fill the width (optional) */
     justify-content: flex-start; /* Align children at the top */
     text-align: left;
     flex: 1;
@@ -119,6 +126,11 @@ html, body {
     padding: 2px;
 }
 
+.footer {
+    text-align: center;
+    height: 1em;
+}
+
 code {
     font-size: .8em;
 }