From 4fec48c78cce74dd05686ee070338508241af540 Mon Sep 17 00:00:00 2001
From: Maxim <Maxim@mail.ru>
Date: Fri, 8 May 2026 10:11:25 +0300
Subject: [PATCH] =?UTF-8?q?=D0=98=D1=81=D0=BF=D1=80=D0=B0=D0=B2=D0=BB?=
 =?UTF-8?q?=D0=B5=D0=BD=D0=B8=D0=B5=20=D0=B0=D0=BD=D0=B8=D0=BC=D0=B0=D1=86?=
 =?UTF-8?q?=D0=B8=D0=B8=20=D0=B8=D1=81=D1=82=D0=BE=D1=80=D0=B8=D0=B5=D0=B9?=
 =?UTF-8?q?=20=D0=BF=D1=80=D0=B8=D0=BD=D1=8F=D1=82=D1=8B=D1=85=20=D0=B4?=
 =?UTF-8?q?=D0=B0=D0=BD=D0=BD=D1=8B=D1=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 cmd/server/web/css/style.css   | 20 ++++++++++++++++++++
 cmd/server/web/js/accordion.js |  1 +
 cmd/server/web/js/ui.js        |  4 +++-
 3 files changed, 24 insertions(+), 1 deletion(-)

diff --git a/cmd/server/web/css/style.css b/cmd/server/web/css/style.css
index 5b75ba1..ffa8237 100644
--- a/cmd/server/web/css/style.css
+++ b/cmd/server/web/css/style.css
@@ -282,4 +282,24 @@ h1 {
 
 #history {
     margin: 0;
+}
+
+.accordion-header {
+    cursor: pointer;
+    user-select: none;
+    transition: background-color 0.2s;
+}
+
+.accordion-header:hover {
+    background-color: rgba(255, 255, 255, 0.05);
+}
+
+.accordion-body {
+    overflow: hidden;
+    transition: max-height 0.3s ease-out;
+    max-height: 2000px;
+}
+
+.accordion-body.collapsed {
+    max-height: 0;
 }
\ No newline at end of file
diff --git a/cmd/server/web/js/accordion.js b/cmd/server/web/js/accordion.js
index e324b67..c956ba2 100644
--- a/cmd/server/web/js/accordion.js
+++ b/cmd/server/web/js/accordion.js
@@ -7,6 +7,7 @@ export function initAccordion() {
     let open = false;
 
     DOM.historyBody.classList.add("collapsed");
+    DOM.historyHeader.textContent = "▶ ПРИНЯТЫЕ ДАННЫЕ";
 
     DOM.historyHeader.addEventListener("click", () => {
         open = !open;
diff --git a/cmd/server/web/js/ui.js b/cmd/server/web/js/ui.js
index 3019b44..675a75d 100644
--- a/cmd/server/web/js/ui.js
+++ b/cmd/server/web/js/ui.js
@@ -8,8 +8,10 @@ export function initDOM() {
     DOM.lastByte = document.getElementById("last-byte");
     DOM.history = document.getElementById("history");
     DOM.canvas = document.getElementById("signalChart");
-
     DOM.bars = document.querySelectorAll(".sig-bar");
+
+    DOM.historyHeader = document.getElementById("history-header");
+    DOM.historyBody = document.getElementById("history-body");
 }
 
 export function setStatus(v) {