Adminverbessert

ExoMy_Software-master/gui/style.css

@@ -432,11 +432,11 @@ h2 {
 }
 
 .admin-page {
-  color: #d9e6e9;
+  color: #1b2730;
   background:
-    radial-gradient(circle at top left, rgba(58, 97, 104, 0.22), transparent 24%),
+    radial-gradient(circle at top left, rgba(150, 176, 183, 0.32), transparent 24%),
-    radial-gradient(circle at bottom right, rgba(214, 138, 47, 0.18), transparent 22%),
+    radial-gradient(circle at bottom right, rgba(221, 193, 144, 0.3), transparent 22%),
-    linear-gradient(145deg, #081116, #0c1b22 46%, #09141a);
+    linear-gradient(145deg, #dde6e9, #cfd9dc 45%, #e8eeef);
 }
 
 .admin-page::before {
@@ -445,34 +445,34 @@ h2 {
   inset: 0;
   pointer-events: none;
   background:
-    linear-gradient(rgba(125, 165, 174, 0.08) 1px, transparent 1px),
+    linear-gradient(rgba(94, 122, 130, 0.07) 1px, transparent 1px),
-    linear-gradient(90deg, rgba(125, 165, 174, 0.08) 1px, transparent 1px);
+    linear-gradient(90deg, rgba(94, 122, 130, 0.07) 1px, transparent 1px);
-  background-size: 32px 32px;
+  background-size: 28px 28px;
-  mask-image: radial-gradient(circle at center, black 45%, transparent 100%);
+  mask-image: radial-gradient(circle at center, black 52%, transparent 100%);
 }
 
 .admin-page .admin_panel {
   position: relative;
-  border-color: rgba(91, 127, 137, 0.45);
+  border-color: rgba(102, 127, 136, 0.42);
   background:
-    linear-gradient(180deg, rgba(14, 31, 38, 0.95), rgba(11, 24, 30, 0.96)),
+    linear-gradient(180deg, rgba(247, 250, 250, 0.96), rgba(229, 236, 237, 0.98)),
-    linear-gradient(120deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0));
+    linear-gradient(120deg, rgba(255, 255, 255, 0.42), rgba(255, 255, 255, 0));
   box-shadow:
-    inset 0 0 0 1px rgba(118, 166, 177, 0.08),
+    inset 0 0 0 1px rgba(255, 255, 255, 0.55),
-    0 18px 45px rgba(0, 0, 0, 0.38);
+    0 22px 48px rgba(84, 98, 105, 0.22);
 }
 
 .admin-page .admin_panel::before {
   content: "";
   position: absolute;
   inset: 0.9rem;
-  border: 1px solid rgba(99, 143, 154, 0.18);
+  border: 1px solid rgba(118, 145, 153, 0.28);
   border-radius: 20px;
   pointer-events: none;
 }
 
 .admin-page .eyebrow {
-  color: #7db0b7;
+  color: #56717a;
   letter-spacing: 0.16em;
 }
 
@@ -480,38 +480,41 @@ h2 {
 .admin-page h2,
 .admin-page strong,
 .admin-page .admin_back {
-  color: #eef7f8;
+  color: #15222b;
 }
 
 .admin-page .admin_copy {
-  color: #93acb2;
+  color: #617781;
 }
 
 .admin-page .status_badge {
-  background: rgba(16, 38, 45, 0.92);
+  background: linear-gradient(180deg, rgba(243, 247, 248, 0.98), rgba(225, 233, 235, 0.98));
-  border-color: rgba(108, 166, 177, 0.34);
+  border-color: rgba(116, 143, 152, 0.35);
-  color: #9ed4dc;
+  color: #325662;
   font-family: Consolas, "Courier New", monospace;
   font-size: 0.85rem;
   letter-spacing: 0.04em;
   text-transform: uppercase;
+  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
 }
 
 .admin-page .pilot_logo_link {
-  background: radial-gradient(circle at center, rgba(95, 140, 149, 0.16), transparent 70%);
+  background: radial-gradient(circle at center, rgba(98, 128, 136, 0.12), transparent 72%);
 }
 
 .admin-page .info_card,
 .admin-page .service_compact {
-  border-color: rgba(99, 143, 154, 0.24);
+  border-color: rgba(116, 143, 152, 0.26);
   background:
-    linear-gradient(180deg, rgba(14, 30, 36, 0.95), rgba(10, 22, 27, 0.98));
+    linear-gradient(180deg, rgba(244, 248, 248, 0.98), rgba(230, 237, 238, 0.98));
-  box-shadow: inset 0 0 0 1px rgba(115, 157, 167, 0.05);
+  box-shadow:
+    inset 0 1px 0 rgba(255, 255, 255, 0.8),
+    0 8px 18px rgba(109, 126, 132, 0.08);
 }
 
 .admin-page .info_label,
 .admin-page .service_compact_row span {
-  color: #76a5ac;
+  color: #5f7981;
 }
 
 .admin-page .info_card strong {
@@ -520,21 +523,21 @@ h2 {
 }
 
 .admin-page .button {
-  border: 1px solid rgba(143, 187, 197, 0.14);
+  border: 1px solid rgba(118, 144, 153, 0.24);
   box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.08),
+    inset 0 1px 0 rgba(255, 255, 255, 0.22),
-    0 10px 24px rgba(0, 0, 0, 0.28);
+    0 10px 20px rgba(96, 110, 117, 0.16);
   text-transform: uppercase;
   font-size: 0.88rem;
   letter-spacing: 0.06em;
 }
 
 .admin-page .buttonWarm {
-  background: linear-gradient(180deg, #d18a2d, #8b5412);
+  background: linear-gradient(180deg, #dba041, #b46b15);
 }
 
 .admin-page .buttonDanger {
-  background: linear-gradient(180deg, #b44942, #711f1b);
+  background: linear-gradient(180deg, #cb6159, #922e28);
 }
 
 .admin-page .admin_back {
@@ -543,6 +546,51 @@ h2 {
   letter-spacing: 0.04em;
 }
 
+.admin-page .service_state {
+  position: relative;
+  padding-left: 1rem;
+}
+
+.admin-page .service_state::before {
+  content: "";
+  position: absolute;
+  left: 0;
+  top: 50%;
+  width: 0.52rem;
+  height: 0.52rem;
+  border-radius: 50%;
+  transform: translateY(-50%);
+  background: #c2a13e;
+  box-shadow: 0 0 0 2px rgba(194, 161, 62, 0.14), 0 0 10px rgba(194, 161, 62, 0.3);
+}
+
+.admin-page .state_active {
+  color: #17643a;
+}
+
+.admin-page .state_active::before {
+  background: #2aa857;
+  box-shadow: 0 0 0 2px rgba(42, 168, 87, 0.14), 0 0 10px rgba(42, 168, 87, 0.38);
+}
+
+.admin-page .state_inactive {
+  color: #8d2a23;
+}
+
+.admin-page .state_inactive::before {
+  background: #d64036;
+  box-shadow: 0 0 0 2px rgba(214, 64, 54, 0.14), 0 0 10px rgba(214, 64, 54, 0.34);
+}
+
+.admin-page .state_unknown {
+  color: #886216;
+}
+
+.admin-page .state_unknown::before {
+  background: #d3ab3b;
+  box-shadow: 0 0 0 2px rgba(211, 171, 59, 0.14), 0 0 10px rgba(211, 171, 59, 0.32);
+}
+
 @media (max-width: 1100px) {
   body {
     overflow-y: auto;