diff --git a/cmd/server/web/css/style.css b/cmd/server/web/css/style.css
index 1f3a4d3..73c4b5e 100644
--- a/cmd/server/web/css/style.css
+++ b/cmd/server/web/css/style.css
@@ -10,10 +10,44 @@ body {
padding: 12px;
}
+/* ===== HEADER BAR ===== */
+.header-bar {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 15px;
+ gap: 16px;
+}
+
h1 {
- text-align: center;
font-size: 22px;
- margin: 0 0 15px;
+ margin: 0;
+ flex: 1;
+}
+
+/* ===== CAMERA BUTTON (теперь в header) ===== */
+.cam-btn {
+ padding: 8px 16px;
+ background: rgba(0, 0, 0, 0.6);
+ color: #00ff88;
+ border: 1px solid #00ff88;
+ border-radius: 8px;
+ cursor: pointer;
+ font-family: monospace;
+ font-size: 14px;
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ white-space: nowrap;
+ flex-shrink: 0;
+}
+
+.cam-btn:hover {
+ background: rgba(0, 255, 136, 0.2);
+}
+
+.cam-btn-icon {
+ font-size: 16px;
}
/* ===== GRID ===== */
@@ -226,7 +260,7 @@ h1 {
/* ===== SPLIT LAYOUT (FIXED) ===== */
.layout {
display: flex;
- height: calc(100vh - 60px);
+ height: calc(100vh - 100px);
width: 100%;
margin: 0;
padding: 0;
@@ -308,31 +342,13 @@ h1 {
background: black;
}
-/* кнопка камеры */
-.cam-btn {
- position: fixed;
- top: 20px;
- right: 20px;
- z-index: 9999;
- padding: 10px 15px;
- background: rgba(0, 0, 0, 0.8);
- color: #00ff88;
- border: 1px solid #00ff88;
- border-radius: 8px;
- cursor: pointer;
- font-family: monospace;
- font-size: 14px;
- display: flex;
- align-items: center;
- gap: 8px;
-}
-
-.cam-btn:hover {
- background: rgba(0, 255, 136, 0.2);
-}
-
/* ===== MOBILE ===== */
@media (max-width: 500px) {
+ .header-bar {
+ flex-direction: column;
+ gap: 8px;
+ }
+
h1 {
font-size: 18px;
}
diff --git a/cmd/server/web/dashboard.html b/cmd/server/web/dashboard.html
index 38f9073..0dc2555 100644
--- a/cmd/server/web/dashboard.html
+++ b/cmd/server/web/dashboard.html
@@ -11,13 +11,13 @@
-GPIO МОНИТОРИНГ В РЕАЛЬНОМ ВРЕМЕНИ
-
-
-
+