88 lines
2.8 KiB
HTML
88 lines
2.8 KiB
HTML
<!doctype html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<title>Адресная программа</title>
|
||
</head>
|
||
<body>
|
||
|
||
<header>
|
||
<!-- Group 1: brand -->
|
||
<div class="hgroup hgroup-brand">
|
||
<div class="brand">
|
||
<div class="brand-name">Green Media</div>
|
||
<div class="brand-sub">Адресная программа</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Group 2: fields -->
|
||
<div class="hgroup">
|
||
<div class="field">
|
||
<label>Город</label>
|
||
<div class="dropdown" id="city-dropdown">
|
||
<button type="button" class="dropdown-btn" id="city-btn">
|
||
<span id="city-btn-text">Все города</span>
|
||
<span class="caret">▾</span>
|
||
</button>
|
||
<div class="dropdown-panel" id="city-panel"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="field">
|
||
<label>Размер</label>
|
||
<div class="dropdown" id="dimension-dropdown">
|
||
<button type="button" class="dropdown-btn" id="dimension-btn">
|
||
<span id="dimension-btn-text">Все размеры</span>
|
||
<span class="caret">▾</span>
|
||
</button>
|
||
<div class="dropdown-panel" id="dimension-panel"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="field">
|
||
<label for="search">Поиск (адрес / код)</label>
|
||
<input type="text" id="search" placeholder="например, Азина" />
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Group 3: checkboxes -->
|
||
<div class="hgroup">
|
||
<div class="field checkbox-field">
|
||
<label for="show-brand"><input type="checkbox" id="show-brand" checked /> Бренд</label>
|
||
</div>
|
||
<div class="field checkbox-field">
|
||
<label for="show-company"><input type="checkbox" id="show-company" /> Компания</label>
|
||
</div>
|
||
<div class="field checkbox-field">
|
||
<label for="show-collisions"><input type="checkbox" id="show-collisions" checked /> Коллизии размещения</label>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Group 4: appearance settings -->
|
||
<div class="hgroup">
|
||
<div class="field zoom-field">
|
||
<label for="zoom-slider">Масштаб: <span id="zoom-label">12 месяцев</span></label>
|
||
<input type="range" id="zoom-slider" min="0" max="9" step="1" value="3" />
|
||
</div>
|
||
<div class="decor-wrap">
|
||
<button type="button" class="decor-btn" id="decor-btn">Оформление ▾</button>
|
||
<div class="decor-menu" id="decor-menu"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="status"></div>
|
||
</header>
|
||
|
||
<div id="chart-wrap">
|
||
<div id="timeline"></div>
|
||
<div id="col-resizer" title="Потяните, чтобы изменить ширину колонки"></div>
|
||
<div id="empty" style="display:none">Нет данных по выбранным фильтрам</div>
|
||
</div>
|
||
|
||
<div id="tooltip"></div>
|
||
|
||
<script type="module" src="/src/main.ts"></script>
|
||
</body>
|
||
</html>
|