Switch filter time-selector to Angular compact layout

src/features/online-board/components/OnlineBoardFilter.scss

@@ -200,6 +200,32 @@
       margin-top: vars.$space-s;
       text-align: right;
     }
+
+    &.compact-view {
+      display: flex;
+      flex-direction: column;
+      gap: 6px;
+
+      .time-selector__label-value {
+        display: flex;
+        justify-content: space-between;
+        align-items: baseline;
+      }
+
+      .time-selector__label {
+        color: #333;
+        font-size: 12px;
+        font-weight: 700;
+        margin-bottom: 0;
+      }
+
+      .time-selector__value {
+        color: #8a8a8a;
+        font-size: 12px;
+        margin-top: 0;
+        text-align: left;
+      }
+    }
   }
 
   .input {

src/features/online-board/components/OnlineBoardFilter.tsx

@@ -308,8 +308,13 @@ export const OnlineBoardFilter: FC<OnlineBoardFilterProps> = ({
                     </div>
                   </div>
 
-                  <div className="wrapper--time-selector full-view" data-testid="time-selector">
-                    <div className="time-selector__label">{t("SHARED.FLIGHT_TIME")}</div>
+                  <div className="wrapper--time-selector compact-view" data-testid="time-selector">
+                    <div className="time-selector__label-value">
+                      <div className="time-selector__label">{t("SHARED.FLIGHT_TIME")}</div>
+                      <div className="time-selector__value">
+                        {minutesToTime(timeRange[0])} — {minutesToTime(timeRange[1])}
+                      </div>
+                    </div>
                     <div className="time-selector">
                       <Slider
                         value={timeRange}
@@ -320,9 +325,6 @@ export const OnlineBoardFilter: FC<OnlineBoardFilterProps> = ({
                         step={60}
                       />
                     </div>
-                    <div className="time-selector__value">
-                      {minutesToTime(timeRange[0])} — {minutesToTime(timeRange[1])}
-                    </div>
                   </div>
 
                   <div className="filter-button">

tests/integration/online-board/start-page.test.tsx

@@ -44,6 +44,20 @@ vi.mock("@/shared/hooks/useSearchHistory.js", () => ({
   useSearchHistory: () => ({ items: [], add: vi.fn(), clear: vi.fn() }),
 }));
 
+vi.mock("@/shared/dictionaries/index.js", () => ({
+  useDictionaries: () => ({ dictionaries: null, loading: false, error: null }),
+  findCityByCoord: () => null,
+}));
+
+vi.mock("@/ui/city-autocomplete/index.js", () => ({
+  CityAutocomplete: (props: Record<string, unknown>) => (
+    <input
+      data-testid={`${(props["testIdPrefix"] as string) ?? "city-autocomplete"}-input`}
+      placeholder={props["placeholder"] as string}
+    />
+  ),
+}));
+
 // ---------------------------------------------------------------------------
 // Tests
 // ---------------------------------------------------------------------------