From 3383015bb0764c139b4e46928d3604b8fdac8176 Mon Sep 17 00:00:00 2001
From: gnezim <gnezim@gmail.com>
Date: Sun, 19 Apr 2026 02:43:46 +0300
Subject: [PATCH] Match Angular mini-list header/time sizing + soften accordion
 headers
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Measured computed styles on the deployed Angular reference:
  mini-list flight-number: 16px / 400 / #000  (mine: 12px / grey)
  mini-list time:          20px / 500 / #022040 (mine: 17px / 600 / #222)
  'Детали рейса' header:   16px / 400 / #333  (mine: 18px / 500 / #222)
  'Расписание рейса' hdr:  16px / 400 / #333  (mine: 18px / 500 / #222)

React's mini-list was reading the carrier+number as secondary metadata
and the time as a loud bold chunk; Angular reverses the hierarchy —
the carrier+number is the tile's identifier, the time is a darker navy
number-group. Retune both. Also drop the collapse-header weight on
both details+schedule accordions so they read as section separators
rather than section titles; the row content below is the focus.
---
 .../components/FlightSchedule/FlightSchedule.scss |  8 +++++---
 .../FlightsMiniList/FlightsMiniList.scss          | 15 ++++++++++-----
 .../details-panels/FlightDetailsAccordion.scss    |  8 +++++---
 3 files changed, 20 insertions(+), 11 deletions(-)

diff --git a/src/features/online-board/components/FlightSchedule/FlightSchedule.scss b/src/features/online-board/components/FlightSchedule/FlightSchedule.scss
index ffab2b17..36257f87 100644
--- a/src/features/online-board/components/FlightSchedule/FlightSchedule.scss
+++ b/src/features/online-board/components/FlightSchedule/FlightSchedule.scss
@@ -7,12 +7,14 @@
     border-top: 1px solid #e0e6f0;
   }
 
+  // 'Расписание рейса' header — 16px / 400 / #333 to match the sibling
+  // 'Детали рейса' collapse row above.
   &__header {
     padding: 16px 0;
     cursor: pointer;
-    font-weight: 500;
-    font-size: 18px;
-    color: #222;
+    font-weight: 400;
+    font-size: 16px;
+    color: #333;
     display: flex;
     justify-content: space-between;
     align-items: center;
diff --git a/src/features/online-board/components/FlightsMiniList/FlightsMiniList.scss b/src/features/online-board/components/FlightsMiniList/FlightsMiniList.scss
index 8da0a455..51dd28ce 100644
--- a/src/features/online-board/components/FlightsMiniList/FlightsMiniList.scss
+++ b/src/features/online-board/components/FlightsMiniList/FlightsMiniList.scss
@@ -29,9 +29,12 @@
     }
   }
 
+  // Angular renders the mini-list header ('SU 6272') darker and larger
+  // than the surrounding meta: 16px / 400 / #000.
   &__flight-number {
-    font-size: 12px;
-    color: #8a8a8a;
+    font-size: 16px;
+    font-weight: 400;
+    color: #000;
     margin-bottom: 6px;
     display: flex;
     align-items: center;
@@ -65,10 +68,12 @@
     text-align: right;
   }
 
+  // Depart/arrive times inside the mini-list item: 20px / 500 / #022040
+  // (dark navy) to match Angular's big time-group.
   &__time {
-    font-size: 17px;
-    font-weight: 600;
-    color: #222;
+    font-size: 20px;
+    font-weight: 500;
+    color: #022040;
     line-height: 1;
   }
 
diff --git a/src/features/online-board/components/details-panels/FlightDetailsAccordion.scss b/src/features/online-board/components/details-panels/FlightDetailsAccordion.scss
index fc4606f8..6bf2bf02 100644
--- a/src/features/online-board/components/details-panels/FlightDetailsAccordion.scss
+++ b/src/features/online-board/components/details-panels/FlightDetailsAccordion.scss
@@ -6,12 +6,14 @@
     overflow: hidden;
   }
 
+  // 'Детали рейса' accordion header. Angular keeps this at 16px / 400 /
+  // #333 — it's a section divider, not a page heading, so it stays quiet.
   .p-accordion-header {
     padding: 16px 0;
     cursor: pointer;
-    font-weight: 500;
-    font-size: 18px;
-    color: #222;
+    font-weight: 400;
+    font-size: 16px;
+    color: #333;
     display: flex;
     justify-content: space-between;
     align-items: center;