test

assets/css/style.css

@@ -1,5 +1,4 @@
 body {
-    padding-inline: 5%;
     min-height: 100dvh;
     margin: 0;
     display: flex;
@@ -7,88 +6,6 @@ body {
     font-size: 1.2rem;
 }
 
-nav {
-    display: flex;
-    gap: 1rem 3rem;
-    flex-wrap: wrap;
-    align-items: center;
-    justify-content: space-between;
-    margin-inline: 5%;
-    padding: 0.5rem 3rem;
-}
-
-nav h2 {
-    margin: 0 auto;
-}
-
-nav ul {
-    list-style: none;
-    display: flex;
-    gap: 1rem;
-    flex-wrap: wrap;
-    align-items: center;
-    justify-content: center;
-    padding: 0;
-    margin: 0 auto;
-}
-
-nav li {
-    margin-inline: auto;
-}
-
-/* nav a {
-    color: #eee;
-    text-decoration: none;
-    font-size: 1.2rem;
-} */
-
-header {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-between;
-    padding-block: 2rem;
-    gap: 2rem;
-}
-
-img {
-    object-fit: cover;
-    width: 100%;
-}
-
-.stats {
-    display: flex;
-    flex-wrap: wrap;
-    gap: 2rem;
-}
-
-.stats > div {
-    padding: 0.5rem 2rem;
-    background-color: lightgray;
-}
-
-div:has(> table) {
-  overflow-x: auto;
-}
-
-table {
-  border-collapse: collapse;
-  width: 100%;
-}
-
-td, th {
-  border: 1px solid #dddddd;
-  text-align: left;
-  padding: 8px;
-}
-
-tr:nth-child(even) {
-  background-color: #dddddd;
-}
-
-span.error {
-    color: red;
-}
-
 #mainStats {
     display: flex;
     flex-direction: column;
@@ -96,22 +13,17 @@ span.error {
     margin: auto;
     justify-content: center;
     align-items: center;
+    padding-inline: 1rem;
 }
 
 #mainStats > .message {
     background-color: lightcoral;
     border: 2px solid red;
     padding: 0.5rem 2rem;
-    width: 100%;
     border-radius: 1rem;
 }
 
-.messageTitle {
-    font-weight: bold;
-    font-size: 1.2rem;
-}
-
-#mainStats > .stats {
+#mainStats .stats {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
@@ -119,7 +31,12 @@ span.error {
     gap: 2rem;
 }
 
-#mainStats > .stats > div {
+#mainStats .stats .wrapper {
+    display: flex;
+    gap: 2rem;
+}
+
+#mainStats .stats .values {
     background-color: #dddddd;
     padding: 0.5rem 2rem;
     border-radius: 1rem;

templates/sk/index.eta

@@ -1,10 +1,9 @@
 <% layout("/sk/layout") %>
 
-<%~ include("/sk/partials/navbar") %>
+<% /* <%~ include("/sk/partials/navbar") %> */ %>
 
 <div id="mainStats">
     <div class="message">
-        <span class="messageTitle">datum cas</span>
         <p>oops</p>
     </div>
     
@@ -13,9 +12,9 @@
     </div>
 
     <div class="stats">
-        <div id="vnutorne">
+        <div class="wrapper">
             <h3>vnútorné</h3>
-            <div class="indoor">
+            <div class="values indoor">
                 <p>teplota: <%= it.data?.[0]?.indoorTemp / 100 %> °C</p>
                 <p>tlak: <%= it.data?.[0]?.indoorPressure / 100 %> hPa</p>
                 <p>vlhkosť: <%= it.data?.[0]?.indoorHumidity / 100 %>%</p>
@@ -23,9 +22,9 @@
             </div>
         </div>
 
-        <div id="vonkajsie">
-        <h3>vonkajšie</h3>
-            <div class="outdoor">
+        <div class="wrapper">
+            <h3>vonkajšie</h3>
+            <div class="values outdoor">
                 <p>pripojenie <%= it.data?.[0]?.outdoorConnected %></p>
                 <p>teplota: <%= it.data?.[0]?.outdoorTemp / 100 %> °C</p>
                 <p>tlak: <%= it.data?.[0]?.outdoorPressure / 100 %> hPa</p>