Lepší design
parent
d5f795816b
commit
800a920f1c
|
|
@ -2,7 +2,7 @@
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
|
||||||
|
|
||||||
{* bootstrap: *}
|
{* bootstrap: *}
|
||||||
<link href="{$basePath}/css/bootstrap.min.css" rel="stylesheet">
|
<link href="{$basePath}/css/bootstrap.min.css" rel="stylesheet">
|
||||||
|
|
@ -28,7 +28,7 @@
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
{* naše vlastní styly *}
|
{* naše vlastní styly *}
|
||||||
<link href="{$basePath}/css/base.css?v=3" rel="stylesheet">
|
<link href="{$basePath}/css/base.css?v=6" rel="stylesheet">
|
||||||
|
|
||||||
<title>{ifset title}{include title|stripHtml} | {/ifset}Obvody</title>
|
<title>{ifset title}{include title|stripHtml} | {/ifset}Obvody</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
|
||||||
|
|
@ -1,17 +1,16 @@
|
||||||
{* This is the welcome page, you can delete it *}
|
|
||||||
|
|
||||||
{block content}
|
{block content}
|
||||||
<h3>Obvody</h3>
|
<div class="home">
|
||||||
|
<header class="home-hlavicka">
|
||||||
|
<div>
|
||||||
|
<h1 class="home-nadpis">Obvody</h1>
|
||||||
|
<p class="home-popis">Vyberte obvod, nebo otevřete celou mapu.</p>
|
||||||
|
</div>
|
||||||
|
<a n:href=":Mapa:" class="home-cela">Celá mapa</a>
|
||||||
|
</header>
|
||||||
|
|
||||||
{* Tlačítka: *}
|
<nav class="home-mrizka" aria-label="Výběr obvodu">
|
||||||
|
{foreach $obvody as $obvod}
|
||||||
<div class="p-1 m-1 d-flex flex-wrap justify-content-center">
|
<a n:href=":Mapa: obvod:$obvod" class="home-obvod">{$obvod}</a>
|
||||||
<a n:href=":Mapa:" type="button" class="btn btn-klavesa btn-letter btn-flex box-shadow--6dp">
|
{/foreach}
|
||||||
*
|
</nav>
|
||||||
</a>
|
|
||||||
{foreach $obvody as $obvod}
|
|
||||||
<a n:href=":Mapa: obvod:$obvod" type="button" class="btn btn-klavesa btn-letter btn-flex box-shadow--6dp">
|
|
||||||
{$obvod}
|
|
||||||
</a>
|
|
||||||
{/foreach}
|
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -11,5 +11,5 @@
|
||||||
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.5.3/dist/MarkerCluster.css" />
|
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.5.3/dist/MarkerCluster.css" />
|
||||||
<script src="https://unpkg.com/leaflet.markercluster@1.5.3/dist/leaflet.markercluster.js"></script>
|
<script src="https://unpkg.com/leaflet.markercluster@1.5.3/dist/leaflet.markercluster.js"></script>
|
||||||
<script type="application/json" id="stari-data">{$stariJson|noescape}</script>
|
<script type="application/json" id="stari-data">{$stariJson|noescape}</script>
|
||||||
<script src="{$basePath}/js/stari.js?v=12"></script>
|
<script src="{$basePath}/js/stari.js?v=13"></script>
|
||||||
{/block}
|
{/block}
|
||||||
|
|
|
||||||
|
|
@ -1,31 +1,41 @@
|
||||||
{block content}
|
{block content}
|
||||||
|
|
||||||
<div class="container-fluid p-2">
|
<div class="platno">
|
||||||
<h3>Obvody</h3>
|
<header class="lista">
|
||||||
<div class="d-flex flex-wrap gap-2 mb-2" n:if="$skupiny">
|
<div>
|
||||||
<div class="btn-group flex-wrap" role="group" aria-label="Filtr skupin">
|
<h1 class="lista-nadpis">Obvody</h1>
|
||||||
<a n:foreach="$skupiny as $s" n:href="list, skupina: $s" n:class="$skupina === $s ? 'btn btn-klavesa' : 'btn btn-outline-secondary'">{$s}</a>
|
<p class="lista-popis">Vyberte skupinu a otevřete obvod.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<a n:href=":Mapa:" class="tlacitko">Celá mapa</a>
|
||||||
|
</header>
|
||||||
|
|
||||||
<table class="table table-sm table-striped mb-1">
|
<section class="panel">
|
||||||
<thead>
|
<div class="filtry" n:if="$skupiny" role="group" aria-label="Filtr skupin">
|
||||||
<tr>
|
<a n:foreach="$skupiny as $s" n:href="list, skupina: $s" n:class="$skupina === $s ? 'tlacitko is-aktivni' : 'tlacitko'">{$s}</a>
|
||||||
<th scope="col" class="text-start">Číslo</th>
|
</div>
|
||||||
<th scope="col" class="text-start">Název</th>
|
|
||||||
<th scope="col" class="text-start">Akce</th>
|
<table class="tabulka">
|
||||||
</tr>
|
<thead>
|
||||||
</thead>
|
<tr>
|
||||||
<tbody>
|
<th scope="col">Číslo</th>
|
||||||
{foreach $obvody as $obvod}
|
<th scope="col">Název</th>
|
||||||
<tr>
|
<th scope="col">Akce</th>
|
||||||
<td>{$obvod->CISLO}</td>
|
</tr>
|
||||||
<td>{$obvod->NAZEV}</td>
|
</thead>
|
||||||
<td>
|
<tbody>
|
||||||
<a n:href=":Obvod:view id:$obvod->ID" class="btn btn-sm btn-klavesa box-shadow--6dp">Otevřít</a>
|
{foreach $obvody as $obvod}
|
||||||
</td>
|
<tr>
|
||||||
</tr>
|
<td data-popisek="Číslo">{$obvod->CISLO}</td>
|
||||||
{/foreach}
|
<td data-popisek="Název">{$obvod->NAZEV}</td>
|
||||||
</tbody>
|
<td class="bunka-akce" data-popisek="Akce">
|
||||||
</table>
|
<div class="akce-radek">
|
||||||
|
<a n:href=":Obvod:view id:$obvod->ID" class="tlacitko">Otevřít</a>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{/foreach}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
<p class="prazdno" n:if="count($obvody) === 0">V této skupině nejsou žádné obvody.</p>
|
||||||
|
</section>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -1,49 +1,63 @@
|
||||||
{block content}
|
{block content}
|
||||||
|
|
||||||
<div class="container-fluid p-2">
|
<div class="platno detail">
|
||||||
Číslo: {$obvod->CISLO}<br>
|
<header class="lista">
|
||||||
Název: {$obvod->NAZEV}<br>
|
<div class="detail-identita">
|
||||||
Skupina: {$obvod->SKUPINA}<br>
|
<span class="detail-cislo">{$obvod->CISLO}</span>
|
||||||
<a n:href=":Mapa: obvod:$obvod->CISLO" type="button" class="btn btn-klavesa btn-flex box-shadow--6dp">Mapa</a>
|
<div>
|
||||||
|
<h1 class="lista-nadpis">{$obvod->NAZEV}</h1>
|
||||||
|
<p class="lista-popis">Skupina {$obvod->SKUPINA}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="akce">
|
||||||
|
<a n:href=":Mapa: obvod:$obvod->CISLO" class="tlacitko">Mapa</a>
|
||||||
|
<button type="button" class="tlacitko is-aktivni" data-bs-toggle="modal" data-bs-target="#modalPridelit">Přidělit</button>
|
||||||
|
<button type="button" class="tlacitko" data-bs-toggle="modal" data-bs-target="#modalVratit">Vrátit</button>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
<div id="obvod-nahled"
|
<div class="detail-telo">
|
||||||
class="box-shadow--6dp my-2"
|
<section class="panel detail-mapa">
|
||||||
data-obvod="{$obvod->CISLO}"
|
<h2>Náhled</h2>
|
||||||
data-geojson="{$basePath}/data/geo-obvody.geojson"></div>
|
<div id="obvod-nahled"
|
||||||
<h5>Záznamy:</h5>
|
data-obvod="{$obvod->CISLO}"
|
||||||
<button type="button" class="btn btn-klavesa btn-flex box-shadow--6dp" data-bs-toggle="modal" data-bs-target="#modalPridelit">Přidělit</button>
|
data-geojson="{$basePath}/data/geo-obvody.geojson"></div>
|
||||||
<button type="button" class="btn btn-klavesa btn-flex box-shadow--6dp" data-bs-toggle="modal" data-bs-target="#modalVratit">Vrátit</button>
|
</section>
|
||||||
<table class="table table-sm table-striped mx-auto mb-1">
|
|
||||||
<thead>
|
<section class="panel detail-zaznamy">
|
||||||
<tr>
|
<h2>Záznamy</h2>
|
||||||
<th scope="col" class="text-start">Záznam</th>
|
<p class="prazdno" n:if="count($zaznamy) === 0">Tento obvod zatím nemá žádný záznam.</p>
|
||||||
<th scope="col" class="text-start">Přiděleno</th>
|
<div class="tabulka-obal" n:if="count($zaznamy) > 0">
|
||||||
<th scope="col" class="text-start">Vráceno</th>
|
<table class="tabulka">
|
||||||
<th scope="col" class="text-start">Akce</th>
|
<thead>
|
||||||
</tr>
|
<tr>
|
||||||
</thead>
|
<th scope="col">Zvěstovatel</th>
|
||||||
<tbody>
|
<th scope="col">Přiděleno</th>
|
||||||
{foreach $zaznamy as $zaznam}
|
<th scope="col">Vráceno</th>
|
||||||
<tr>
|
<th scope="col">Akce</th>
|
||||||
<td>{$zaznam->JMENO}</td>
|
</tr>
|
||||||
<td class="text-start">
|
</thead>
|
||||||
{date_format($zaznam->VYDANO,"d.m.Y")}
|
<tbody>
|
||||||
</td>
|
{foreach $zaznamy as $zaznam}
|
||||||
<td class="text-start">
|
<tr>
|
||||||
{if $zaznam->VRACENO}{date_format($zaznam->VRACENO,"d.m.Y")}{/if}
|
<td data-popisek="Zvěstovatel">{$zaznam->JMENO}</td>
|
||||||
</td>
|
<td data-popisek="Přiděleno">{date_format($zaznam->VYDANO, 'd.m.Y')}</td>
|
||||||
<td>
|
<td data-popisek="Vráceno">{if $zaznam->VRACENO}{date_format($zaznam->VRACENO, 'd.m.Y')}{else}—{/if}</td>
|
||||||
<div class="d-flex flex-wrap gap-1">
|
<td class="bunka-akce" data-popisek="Akce">
|
||||||
<button type="button" class="btn btn-sm btn-klavesa box-shadow--6dp" data-bs-toggle="modal" data-bs-target="#modalUpravit" data-id="{$zaznam->ID}" data-jmeno="{$zaznam->JMENO}" data-vydano="{date_format($zaznam->VYDANO, 'Y-m-d')}" data-vraceno="{if $zaznam->VRACENO}{date_format($zaznam->VRACENO, 'Y-m-d')}{/if}">Upravit</button>
|
<div class="akce-radek">
|
||||||
{form "smazat-$zaznam->ID", class: 'd-inline'}
|
<button type="button" class="tlacitko" data-bs-toggle="modal" data-bs-target="#modalUpravit" data-id="{$zaznam->ID}" data-jmeno="{$zaznam->JMENO}" data-vydano="{date_format($zaznam->VYDANO, 'Y-m-d')}" data-vraceno="{if $zaznam->VRACENO}{date_format($zaznam->VRACENO, 'Y-m-d')}{/if}">Upravit</button>
|
||||||
<button n:name="send" class="btn btn-sm btn-outline-danger" onclick="return confirm('Smazat záznam?')">Smazat</button>
|
{form "smazat-$zaznam->ID"}
|
||||||
{/form}
|
<button n:name="send" class="tlacitko tlacitko-nebezpeci" onclick="return confirm('Smazat záznam?')">Smazat</button>
|
||||||
</div>
|
{/form}
|
||||||
</td>
|
</div>
|
||||||
</tr>
|
</td>
|
||||||
{/foreach}
|
</tr>
|
||||||
</tbody>
|
{/foreach}
|
||||||
</table>
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="modal fade" id="modalPridelit" tabindex="-1" aria-labelledby="modalPridelitLabel" aria-hidden="true" data-show-errors="{if $presenter['pridelitForm']->hasErrors()}1{else}0{/if}">
|
<div class="modal fade" id="modalPridelit" tabindex="-1" aria-labelledby="modalPridelitLabel" aria-hidden="true" data-show-errors="{if $presenter['pridelitForm']->hasErrors()}1{else}0{/if}">
|
||||||
|
|
@ -70,8 +84,8 @@ Skupina: {$obvod->SKUPINA}<br>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-footer">
|
<div class="modal-footer">
|
||||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Zrušit</button>
|
<button type="button" class="tlacitko" data-bs-dismiss="modal">Zrušit</button>
|
||||||
<button n:name="send" class="btn btn-klavesa box-shadow--6dp">Přidělit</button>
|
<button n:name="send" class="tlacitko is-aktivni">Přidělit</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -88,7 +102,7 @@ Skupina: {$obvod->SKUPINA}<br>
|
||||||
{if count($otevrene) === 0}
|
{if count($otevrene) === 0}
|
||||||
<div class="modal-body">Tento obvod nemá otevřené přidělení.</div>
|
<div class="modal-body">Tento obvod nemá otevřené přidělení.</div>
|
||||||
<div class="modal-footer">
|
<div class="modal-footer">
|
||||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Zavřít</button>
|
<button type="button" class="tlacitko" data-bs-dismiss="modal">Zavřít</button>
|
||||||
</div>
|
</div>
|
||||||
{else}
|
{else}
|
||||||
<form n:name="vratitForm">
|
<form n:name="vratitForm">
|
||||||
|
|
@ -108,8 +122,8 @@ Skupina: {$obvod->SKUPINA}<br>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-footer">
|
<div class="modal-footer">
|
||||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Zrušit</button>
|
<button type="button" class="tlacitko" data-bs-dismiss="modal">Zrušit</button>
|
||||||
<button n:name="send" class="btn btn-klavesa box-shadow--6dp">Vrátit</button>
|
<button n:name="send" class="tlacitko is-aktivni">Vrátit</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
{/if}
|
{/if}
|
||||||
|
|
@ -145,8 +159,8 @@ Skupina: {$obvod->SKUPINA}<br>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-footer">
|
<div class="modal-footer">
|
||||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Zrušit</button>
|
<button type="button" class="tlacitko" data-bs-dismiss="modal">Zrušit</button>
|
||||||
<button n:name="send" class="btn btn-klavesa box-shadow--6dp">Uložit</button>
|
<button n:name="send" class="tlacitko is-aktivni">Uložit</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1,22 +1,25 @@
|
||||||
{block content}
|
{block content}
|
||||||
|
|
||||||
{* {control signInForm} *}
|
<div class="platno">
|
||||||
<div class="container-fluid">
|
<header class="lista">
|
||||||
<section class="w-100 p-4 d-flex justify-content-center pb-4">
|
<div>
|
||||||
<form n:name=signInForm style="width: 22rem;">
|
<h1 class="lista-nadpis">Přihlášení</h1>
|
||||||
<div class="p-3 container-fluid ramecek-chyba" n:if="$form->hasErrors()" n:foreach="$form->getErrors() as $error">
|
<p class="lista-popis">Pro práci se záznamy se přihlaste.</p>
|
||||||
<span>{$error}</span>
|
</div>
|
||||||
</div>
|
</header>
|
||||||
<div class="form-group">
|
|
||||||
<label n:name=username for="inputUser">Uživatel</label>
|
|
||||||
<input n:name=username type="text" class="form-control" id="inputUser" placeholder="Uživatel" required>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-group">
|
<section class="panel panel-uzky">
|
||||||
<label n:name=password for="inputHeslo">Heslo</label>
|
<form n:name="signInForm" class="prihlaseni formular">
|
||||||
<input n:name=password type="password" class="form-control" id="inputHeslo" placeholder="Heslo" autofocus="autofocus" required>
|
<div class="alert alert-danger" n:if="$form->hasErrors()" n:foreach="$form->getErrors() as $error">{$error}</div>
|
||||||
|
<div class="mb-3">
|
||||||
|
<label n:name="username" class="form-label" for="inputUser">Uživatel</label>
|
||||||
|
<input n:name="username" type="text" class="form-control" id="inputUser" placeholder="Uživatel" required>
|
||||||
</div>
|
</div>
|
||||||
<button type="submit" n:name=send class="btn btn-primary btn-xlarge w-100" style="margin-top: 10px;">Přihlásit</button>
|
<div class="mb-3">
|
||||||
</form>
|
<label n:name="password" class="form-label" for="inputHeslo">Heslo</label>
|
||||||
|
<input n:name="password" type="password" class="form-control" id="inputHeslo" placeholder="Heslo" required>
|
||||||
|
</div>
|
||||||
|
<button type="submit" n:name="send" class="tlacitko is-aktivni w-100">Přihlásit</button>
|
||||||
|
</form>
|
||||||
</section>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1,26 +1,36 @@
|
||||||
{block content}
|
{block content}
|
||||||
|
|
||||||
<div class="container-fluid p-2">
|
<div class="platno">
|
||||||
<h3>Zvěstovatelé</h3>
|
<header class="lista">
|
||||||
|
<div>
|
||||||
|
<h1 class="lista-nadpis">Zvěstovatelé</h1>
|
||||||
|
<p class="lista-popis">Jména použitá u záznamů obvodů.</p>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
<table class="table table-sm table-striped mb-1">
|
<section class="panel">
|
||||||
<thead>
|
<table class="tabulka">
|
||||||
<tr>
|
<thead>
|
||||||
<th scope="col" class="text-start">Jméno</th>
|
<tr>
|
||||||
<th scope="col" class="text-start">Záznamy</th>
|
<th scope="col">Jméno</th>
|
||||||
<th scope="col" class="text-start">Akce</th>
|
<th scope="col">Záznamy</th>
|
||||||
</tr>
|
<th scope="col">Akce</th>
|
||||||
</thead>
|
</tr>
|
||||||
<tbody>
|
</thead>
|
||||||
{foreach $zvestovatele as $zvestovatel}
|
<tbody>
|
||||||
<tr>
|
{foreach $zvestovatele as $zvestovatel}
|
||||||
<td>{$zvestovatel->JMENO}</td>
|
<tr>
|
||||||
<td>{$zvestovatel->POCET}</td>
|
<td data-popisek="Jméno">{$zvestovatel->JMENO}</td>
|
||||||
<td>
|
<td data-popisek="Záznamy">{$zvestovatel->POCET}</td>
|
||||||
<a n:href="edit, jmeno: $zvestovatel->JMENO" class="btn btn-sm btn-klavesa box-shadow--6dp">Upravit</a>
|
<td class="bunka-akce" data-popisek="Akce">
|
||||||
</td>
|
<div class="akce-radek">
|
||||||
</tr>
|
<a n:href="edit, jmeno: $zvestovatel->JMENO" class="tlacitko">Upravit</a>
|
||||||
{/foreach}
|
</div>
|
||||||
</tbody>
|
</td>
|
||||||
</table>
|
</tr>
|
||||||
|
{/foreach}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
<p class="prazdno" n:if="count($zvestovatele) === 0">Zatím tu není žádný zvěstovatel.</p>
|
||||||
|
</section>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1,15 +1,23 @@
|
||||||
{block content}
|
{block content}
|
||||||
|
|
||||||
<div class="container-fluid p-2">
|
<div class="platno">
|
||||||
<h3>Upravit zvěstovatele</h3>
|
<header class="lista">
|
||||||
<form n:name="zvestovatelForm" class="mb-3">
|
<div>
|
||||||
|
<h1 class="lista-nadpis">Upravit zvěstovatele</h1>
|
||||||
|
<p class="lista-popis">Změna se propíše do všech jeho záznamů.</p>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<form n:name="zvestovatelForm" class="panel panel-uzky formular">
|
||||||
<input n:name="puvodni">
|
<input n:name="puvodni">
|
||||||
<div class="alert alert-danger" n:if="$form->hasErrors()" n:foreach="$form->getErrors() as $error">{$error}</div>
|
<div class="alert alert-danger" n:if="$form->hasErrors()" n:foreach="$form->getErrors() as $error">{$error}</div>
|
||||||
<div class="mb-2">
|
<div class="mb-3">
|
||||||
<label n:name="jmeno" class="form-label">Jméno</label>
|
<label n:name="jmeno" class="form-label">Jméno</label>
|
||||||
<input n:name="jmeno" class="form-control">
|
<input n:name="jmeno" class="form-control">
|
||||||
</div>
|
</div>
|
||||||
<button n:name="send" class="btn btn-klavesa box-shadow--6dp">Uložit</button>
|
<div class="formular-akce">
|
||||||
<a n:href="default" class="btn btn-secondary">Zpět</a>
|
<button n:name="send" class="tlacitko is-aktivni">Uložit</button>
|
||||||
|
<a n:href="default" class="tlacitko">Zpět</a>
|
||||||
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
678
www/css/base.css
678
www/css/base.css
|
|
@ -1,10 +1,13 @@
|
||||||
body {
|
html, body {
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
html, body, #map {
|
|
||||||
height: 100%;
|
height: 100%;
|
||||||
width: 100vw;
|
width: 100%;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#map {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
body:has(#map[data-max]) {
|
body:has(#map[data-max]) {
|
||||||
|
|
@ -218,6 +221,182 @@ body:has(#map[data-max]) {
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.home {
|
||||||
|
min-height: calc(100vh - 3.5rem);
|
||||||
|
background:
|
||||||
|
radial-gradient(900px 420px at 0% -8%, #c5ddf6 0%, transparent 62%),
|
||||||
|
linear-gradient(180deg, #e3f2fd 0%, #f4f8fc 42%, #ffffff 100%);
|
||||||
|
padding: 1.15rem 0.9rem 2.4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-hlavicka {
|
||||||
|
max-width: 52rem;
|
||||||
|
margin: 0 auto 1.15rem;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: 1rem;
|
||||||
|
padding: 1rem 1.15rem;
|
||||||
|
background: rgba(255, 255, 255, 0.94);
|
||||||
|
border: 1px solid #c5ddf6;
|
||||||
|
border-radius: 1.15rem;
|
||||||
|
box-shadow: 0 12px 28px rgba(29, 79, 145, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-nadpis {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 1.55rem;
|
||||||
|
font-weight: 800;
|
||||||
|
letter-spacing: -0.03em;
|
||||||
|
color: #1d4f91;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-popis {
|
||||||
|
margin: 0.2rem 0 0;
|
||||||
|
color: #3d5a80;
|
||||||
|
font-size: 0.95rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tlacitko,
|
||||||
|
.home-cela {
|
||||||
|
flex: 0 0 auto;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
min-height: 2.75rem;
|
||||||
|
padding: 0.55rem 1.15rem;
|
||||||
|
border-radius: 999px;
|
||||||
|
border: 2px solid #1d4f91;
|
||||||
|
background: #c5ddf6;
|
||||||
|
color: #1d4f91;
|
||||||
|
font-weight: 800;
|
||||||
|
font-size: 1rem;
|
||||||
|
line-height: 1.2;
|
||||||
|
text-align: center;
|
||||||
|
text-decoration: none;
|
||||||
|
box-shadow: 0 4px 12px rgba(29, 79, 145, 0.16);
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tlacitko:hover,
|
||||||
|
.tlacitko:focus-visible,
|
||||||
|
.home-cela:hover,
|
||||||
|
.home-cela:focus-visible {
|
||||||
|
background: #2652a8;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tlacitko.is-aktivni {
|
||||||
|
background: #2652a8;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tlacitko.is-aktivni:hover,
|
||||||
|
.tlacitko.is-aktivni:focus-visible {
|
||||||
|
background: #1d4f91;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tlacitko-nebezpeci {
|
||||||
|
background: #fde8ea;
|
||||||
|
color: #8d1d2c;
|
||||||
|
border-color: #c44b5a;
|
||||||
|
box-shadow: 0 4px 12px rgba(141, 29, 44, 0.12);
|
||||||
|
}
|
||||||
|
|
||||||
|
.tlacitko-nebezpeci:hover,
|
||||||
|
.tlacitko-nebezpeci:focus-visible {
|
||||||
|
background: #c44b5a;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-mrizka {
|
||||||
|
max-width: 52rem;
|
||||||
|
margin: 0 auto;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fill, minmax(5.5rem, 1fr));
|
||||||
|
gap: 0.85rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-obvod {
|
||||||
|
aspect-ratio: 1;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border-radius: 50%;
|
||||||
|
border: 2px solid #1d4f91;
|
||||||
|
background: #2652a8;
|
||||||
|
color: #fff;
|
||||||
|
font-size: clamp(1.2rem, 4.6vw, 1.5rem);
|
||||||
|
font-weight: 800;
|
||||||
|
line-height: 1;
|
||||||
|
text-decoration: none;
|
||||||
|
box-shadow: 0 4px 10px rgba(29, 79, 145, 0.28);
|
||||||
|
transition: transform 0.12s ease, background-color 0.12s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-obvod:hover,
|
||||||
|
.home-obvod:focus-visible {
|
||||||
|
background: #1d4f91;
|
||||||
|
color: #fff;
|
||||||
|
transform: translateY(-2px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-obvod:active {
|
||||||
|
transform: translateY(0);
|
||||||
|
background: #163e78;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home {
|
||||||
|
padding-left: max(0.9rem, env(safe-area-inset-left));
|
||||||
|
padding-right: max(0.9rem, env(safe-area-inset-right));
|
||||||
|
padding-bottom: max(2.4rem, env(safe-area-inset-bottom));
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 720px) {
|
||||||
|
.home-mrizka {
|
||||||
|
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||||
|
gap: 0.7rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 520px) {
|
||||||
|
.home {
|
||||||
|
padding-top: 0.85rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-hlavicka {
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: stretch;
|
||||||
|
text-align: center;
|
||||||
|
padding: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-nadpis {
|
||||||
|
font-size: 1.7rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-popis {
|
||||||
|
font-size: 1.05rem;
|
||||||
|
line-height: 1.4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-cela {
|
||||||
|
width: 100%;
|
||||||
|
min-height: 3.25rem;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-mrizka {
|
||||||
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||||
|
gap: 0.85rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.home-obvod {
|
||||||
|
font-size: 1.4rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@media (orientation: portrait) {
|
@media (orientation: portrait) {
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -265,3 +444,490 @@ body:has(#map[data-max]) {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.prihlaseni-obal {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 1.25rem 1rem 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prihlaseni {
|
||||||
|
width: min(22rem, 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.prihlaseni .form-control {
|
||||||
|
min-height: 3rem;
|
||||||
|
font-size: 1.05rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prihlaseni-odeslat {
|
||||||
|
margin-top: 0.85rem;
|
||||||
|
min-height: 3rem;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.obvod-udaje {
|
||||||
|
display: grid;
|
||||||
|
gap: 0.35rem;
|
||||||
|
margin: 0 0 0.85rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.obvod-udaje div {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 0.35rem 0.75rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.obvod-udaje dt {
|
||||||
|
margin: 0;
|
||||||
|
color: #3d5a80;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.obvod-udaje dd {
|
||||||
|
margin: 0;
|
||||||
|
color: #1a1a1a;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.obvod-akce {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.obvod-akce .btn {
|
||||||
|
flex: 1 1 8rem;
|
||||||
|
min-height: 2.85rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 991.98px) {
|
||||||
|
#menu .navbar-brand {
|
||||||
|
font-size: 1.25rem;
|
||||||
|
font-weight: 800;
|
||||||
|
color: #1d4f91;
|
||||||
|
}
|
||||||
|
|
||||||
|
#menu .navbar-toggler {
|
||||||
|
min-width: 3rem;
|
||||||
|
min-height: 3rem;
|
||||||
|
padding: 0.45rem 0.6rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#menu .nav-link {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
min-height: 3rem;
|
||||||
|
padding: 0.75rem 0.2rem;
|
||||||
|
font-size: 1.125rem;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 576px) {
|
||||||
|
.stranka,
|
||||||
|
.container-fluid.p-2 {
|
||||||
|
padding-left: max(0.75rem, env(safe-area-inset-left)) !important;
|
||||||
|
padding-right: max(0.75rem, env(safe-area-inset-right)) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3, h5 {
|
||||||
|
line-height: 1.25;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table {
|
||||||
|
font-size: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-sm {
|
||||||
|
min-height: 2.5rem;
|
||||||
|
padding: 0.4rem 0.8rem;
|
||||||
|
font-size: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-group.flex-wrap {
|
||||||
|
display: flex;
|
||||||
|
gap: 0.4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-group.flex-wrap > .btn {
|
||||||
|
flex: 1 1 auto;
|
||||||
|
border-radius: 0.6rem !important;
|
||||||
|
min-height: 2.75rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mapa-filtr {
|
||||||
|
max-width: calc(100% - 3.25rem);
|
||||||
|
gap: 0.25rem;
|
||||||
|
padding: 0.3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mapa-filtr button {
|
||||||
|
font-size: 0.95rem;
|
||||||
|
padding: 0.55rem 0.7rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stari-legenda {
|
||||||
|
width: min(15rem, calc(100vw - 4.5rem));
|
||||||
|
font-size: 0.85rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.obvod-kolecko {
|
||||||
|
width: 36px;
|
||||||
|
height: 36px;
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#obvod-nahled {
|
||||||
|
height: 34vh;
|
||||||
|
min-height: 180px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-footer {
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 0.4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-footer .btn,
|
||||||
|
.modal-footer .tlacitko {
|
||||||
|
flex: 1 1 8rem;
|
||||||
|
min-height: 2.85rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.platno {
|
||||||
|
min-height: calc(100vh - 3.5rem);
|
||||||
|
background:
|
||||||
|
radial-gradient(900px 420px at 0% -8%, #c5ddf6 0%, transparent 62%),
|
||||||
|
linear-gradient(180deg, #e3f2fd 0%, #f4f8fc 42%, #ffffff 100%);
|
||||||
|
padding: 1.15rem max(0.9rem, env(safe-area-inset-right)) max(2.4rem, env(safe-area-inset-bottom)) max(0.9rem, env(safe-area-inset-left));
|
||||||
|
}
|
||||||
|
|
||||||
|
.lista,
|
||||||
|
.panel {
|
||||||
|
max-width: 64rem;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
background: rgba(255, 255, 255, 0.94);
|
||||||
|
border: 1px solid #c5ddf6;
|
||||||
|
border-radius: 1.15rem;
|
||||||
|
box-shadow: 0 12px 28px rgba(29, 79, 145, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.lista {
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: 1rem;
|
||||||
|
padding: 1rem 1.15rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lista-nadpis {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 1.55rem;
|
||||||
|
font-weight: 800;
|
||||||
|
letter-spacing: -0.03em;
|
||||||
|
color: #1d4f91;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lista-popis {
|
||||||
|
margin: 0.2rem 0 0;
|
||||||
|
color: #3d5a80;
|
||||||
|
font-size: 0.95rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.panel {
|
||||||
|
padding: 0.95rem 1rem 1.05rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.panel h2 {
|
||||||
|
margin: 0 0 0.75rem;
|
||||||
|
font-size: 1.05rem;
|
||||||
|
font-weight: 800;
|
||||||
|
color: #1d4f91;
|
||||||
|
}
|
||||||
|
|
||||||
|
.panel-uzky {
|
||||||
|
max-width: 36rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filtry,
|
||||||
|
.akce {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filtry {
|
||||||
|
margin-bottom: 0.85rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.akce {
|
||||||
|
justify-content: flex-end;
|
||||||
|
}
|
||||||
|
|
||||||
|
.formular .form-control,
|
||||||
|
.modal .form-control,
|
||||||
|
.modal .form-select,
|
||||||
|
.prihlaseni .form-control {
|
||||||
|
min-height: 2.9rem;
|
||||||
|
border-radius: 0.8rem;
|
||||||
|
border-color: #d5e3f5;
|
||||||
|
font-size: 1.05rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.formular .form-label,
|
||||||
|
.modal .form-label,
|
||||||
|
.prihlaseni label {
|
||||||
|
color: #1d4f91;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.panel .prihlaseni {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.formular-akce {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 0.5rem;
|
||||||
|
margin-top: 0.4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabulka {
|
||||||
|
width: 100%;
|
||||||
|
border-collapse: separate;
|
||||||
|
border-spacing: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabulka th {
|
||||||
|
text-align: left;
|
||||||
|
color: #1d4f91;
|
||||||
|
font-size: 0.85rem;
|
||||||
|
font-weight: 800;
|
||||||
|
padding: 0.45rem 0.7rem 0.6rem;
|
||||||
|
border-bottom: 2px solid #c5ddf6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabulka td {
|
||||||
|
padding: 0.7rem;
|
||||||
|
border-bottom: 1px solid #e3f2fd;
|
||||||
|
vertical-align: middle;
|
||||||
|
color: #1a1a1a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabulka tbody tr:last-child td {
|
||||||
|
border-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bunka-akce .akce-radek {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 0.4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.akce-radek form {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prazdno {
|
||||||
|
margin: 0.2rem 0 0.3rem;
|
||||||
|
color: #3d5a80;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail .lista,
|
||||||
|
.detail-telo {
|
||||||
|
max-width: 76rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail-identita {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.9rem;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail-cislo {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 4.4rem;
|
||||||
|
height: 4.4rem;
|
||||||
|
flex: 0 0 auto;
|
||||||
|
border-radius: 50%;
|
||||||
|
border: 2px solid #1d4f91;
|
||||||
|
background: #2652a8;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 1.35rem;
|
||||||
|
font-weight: 800;
|
||||||
|
box-shadow: 0 4px 10px rgba(29, 79, 145, 0.28);
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail-telo {
|
||||||
|
margin: 0 auto;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: minmax(18rem, 0.9fr) minmax(0, 1.25fr);
|
||||||
|
gap: 1rem;
|
||||||
|
align-items: stretch;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail-telo .panel {
|
||||||
|
max-width: none;
|
||||||
|
margin: 0;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail-mapa #obvod-nahled {
|
||||||
|
height: calc(100vh - 15rem);
|
||||||
|
min-height: 320px;
|
||||||
|
margin: 0;
|
||||||
|
border: 1px solid #c5ddf6;
|
||||||
|
border-radius: 0.9rem;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail-zaznamy {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
max-height: calc(100vh - 12.5rem);
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail-zaznamy .tabulka-obal {
|
||||||
|
overflow: auto;
|
||||||
|
min-height: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-content {
|
||||||
|
border: 1px solid #c5ddf6;
|
||||||
|
border-radius: 1.15rem;
|
||||||
|
box-shadow: 0 18px 40px rgba(29, 79, 145, 0.18);
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-header,
|
||||||
|
.modal-footer {
|
||||||
|
border-color: #e3f2fd;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-title {
|
||||||
|
color: #1d4f91;
|
||||||
|
font-weight: 800;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flash {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0.7rem 1rem;
|
||||||
|
background: #e3f2fd;
|
||||||
|
color: #1d4f91;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flash.error,
|
||||||
|
.flash.warning {
|
||||||
|
background: #fde8ea;
|
||||||
|
color: #8d1d2c;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 900px) {
|
||||||
|
.detail-telo {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail-mapa #obvod-nahled {
|
||||||
|
height: 38vh;
|
||||||
|
min-height: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail-zaznamy {
|
||||||
|
max-height: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 640px) {
|
||||||
|
.lista {
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: stretch;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lista > .tlacitko,
|
||||||
|
.akce,
|
||||||
|
.formular-akce {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.akce,
|
||||||
|
.formular-akce {
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.akce .tlacitko,
|
||||||
|
.formular-akce .tlacitko {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail-identita {
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabulka thead {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabulka,
|
||||||
|
.tabulka tbody,
|
||||||
|
.tabulka tr,
|
||||||
|
.tabulka td {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabulka tr {
|
||||||
|
border: 1px solid #c5ddf6;
|
||||||
|
border-radius: 1rem;
|
||||||
|
margin-bottom: 0.7rem;
|
||||||
|
padding: 0.35rem 0.85rem 0.65rem;
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabulka td {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.75rem;
|
||||||
|
border: 0;
|
||||||
|
padding: 0.45rem 0;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabulka td::before {
|
||||||
|
content: attr(data-popisek);
|
||||||
|
color: #3d5a80;
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: 0.85rem;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabulka td.bunka-akce {
|
||||||
|
display: block;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabulka td.bunka-akce::before {
|
||||||
|
display: block;
|
||||||
|
margin-bottom: 0.35rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bunka-akce .akce-radek,
|
||||||
|
.bunka-akce .akce-radek form {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 0.4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bunka-akce .tlacitko {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -36,13 +36,26 @@
|
||||||
return 'rgb(' + kanaly[0] + ',' + kanaly[1] + ',' + kanaly[2] + ')';
|
return 'rgb(' + kanaly[0] + ',' + kanaly[1] + ',' + kanaly[2] + ')';
|
||||||
}
|
}
|
||||||
|
|
||||||
function barvaStari(mesice, stupnice) {
|
function kanalyStari(mesice, stupnice) {
|
||||||
var max = stupnice || maxMesicu;
|
var max = stupnice || maxMesicu;
|
||||||
var t = mesice == null ? 1 : Math.max(0, Math.min(mesice / max, 1));
|
var t = mesice == null ? 1 : Math.max(0, Math.min(mesice / max, 1));
|
||||||
if (t < 0.5) {
|
if (t < 0.5) {
|
||||||
return rgb(mix(ZELENA, ZLUTA, t / 0.5));
|
return mix(ZELENA, ZLUTA, t / 0.5);
|
||||||
}
|
}
|
||||||
return rgb(mix(ZLUTA, CERVENA, (t - 0.5) / 0.5));
|
return mix(ZLUTA, CERVENA, (t - 0.5) / 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
function barvaStari(mesice, stupnice) {
|
||||||
|
return rgb(kanalyStari(mesice, stupnice));
|
||||||
|
}
|
||||||
|
|
||||||
|
function barvaOkraje(mesice, stupnice) {
|
||||||
|
var kanaly = kanalyStari(mesice, stupnice);
|
||||||
|
return rgb([
|
||||||
|
Math.round(kanaly[0] * 0.68),
|
||||||
|
Math.round(kanaly[1] * 0.68),
|
||||||
|
Math.round(kanaly[2] * 0.68),
|
||||||
|
]);
|
||||||
}
|
}
|
||||||
|
|
||||||
function infoObvodu(feature) {
|
function infoObvodu(feature) {
|
||||||
|
|
@ -199,7 +212,7 @@
|
||||||
|
|
||||||
function htmlKolecko(text, mesice, sede, stupnice) {
|
function htmlKolecko(text, mesice, sede, stupnice) {
|
||||||
var barva = sede ? SEDA : barvaStari(mesice, stupnice);
|
var barva = sede ? SEDA : barvaStari(mesice, stupnice);
|
||||||
var okraj = sede ? SEDA_HRANICE : barva;
|
var okraj = sede ? SEDA_HRANICE : barvaOkraje(mesice, stupnice);
|
||||||
var textBarva = sede ? '#1a1a1a' : barvaTextu(mesice, stupnice);
|
var textBarva = sede ? '#1a1a1a' : barvaTextu(mesice, stupnice);
|
||||||
return '<div class="obvod-kolecko" style="background:' + barva + ';border-color:' + okraj + ';color:' + textBarva + '">' + text + '</div>';
|
return '<div class="obvod-kolecko" style="background:' + barva + ';border-color:' + okraj + ';color:' + textBarva + '">' + text + '</div>';
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue