ota card style moved to the component

cards/SystemCard.vue

@@ -22,6 +22,24 @@
   </q-card>
 </template>
 
+<style>
+.clerr .clwarn .clok {
+  font-weight: bold;
+}
+
+.clerr {
+  color: #b00000;
+}
+
+.clwarn {
+  color: #b0b000;
+}
+
+.clok {
+  color: #00b000;
+}
+</style>
+
 <script setup>
 import { reactive } from "vue";
 import { PostData } from "components/webguicomp/network"

comp.css

@@ -0,0 +1,32 @@
+.body {
+  background: #e0e0e0;
+}
+.card {
+ border-radius: 10px;
+ font-family: monospace;
+ font-size: medium;
+ break-inside: avoid;
+ margin: 0 0 10px 10px;
+}
+
+.cardholder {
+ column-count: 1;
+ column-gap: 0;
+
+ padding: 10px 10px 10px 0;
+}
+@media (min-width: 1024px) {
+ .cardholder {
+   column-count: 2;
+ }
+}
+@media (min-width: 1400px) {
+ .cardholder {
+   column-count: 3;
+ }
+}
+
+.clerr .clwarn .clok {font-weight:bold;}
+.clerr {color:#b00000;}
+.clwarn {color:#b0b000;}
+.clok {color:#00b000;}

network.js

@@ -18,6 +18,7 @@ function PostData(varlist, messtype, applytype, onfinished) {
   pld.data = data;
   pld.signature = sha256.hmac(SHA256_HMAC_KEY, JSON.stringify(data));
 
+
   api
     .post(API_URL, JSON.stringify(pld), {
       headers: { "Content-Type": "application/json" },