Select Git revision
__init__.py
generator.html 88.78 KiB
<!DOCTYPE html>
<html>
<head>
<title>Generátor grafiky</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script
type="text/javascript"
src="{{ url_for('static', filename='js/jquery.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/qrcode.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/select2.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/jspdf.umd.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/utils.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/base.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/bottom-slogan.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/bottom-slogan-gradient.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/bottom-slogan-gradient-vertical-logo.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/bottom-slogan-person.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/eu-image-slogan.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/eu-big-text-image.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/eu-icons-image.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/bottom-slogan-full-width.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/left-long-text.js') }}"
></script>
<script
type="text/javascript" src="{{ url_for('static', filename='js/templates/right-long-text.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/right-big-text.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/left-corner-slogan.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/story-with-rectangle.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/story-full-width-rectangle.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/no-image-icon-text.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/no-image-text-more-info.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/no-image-big-text-icon.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/no-image-big-text-icon-with-terciary.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/no-image-quote.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/no-image-text-icon-vertical-logo.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/poster-bottom-slogan.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/poster-bottom-slogan-no-icon.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/poster-center-slogan-no-image.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/poster-center-slogan-icons-no-image.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/poster-event.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/poster-bottom-slogan-printable.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/poster-bottom-slogan-no-icon-printable.js') }}"
></script> <script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/poster-center-slogan-no-image-printable.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/poster-center-slogan-icons-no-image-printable.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/banner-name-left.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/banner-name-right.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/billboard.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/cover.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/cover-static-name-and-logo.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/cover-static-name-and-logo-left.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/poll.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/koneckorupci-poll.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/event-text-right.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/event-text-bottom.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/nalodeni.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/nalodeni-story.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/rollup-big-logo-short-text.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/rollup-short-and-long-text.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/rollup-points.js') }}"
></script>
<script
type="text/javascript" src="{{ url_for('static', filename='js/templates/humans.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/bottom-slogan-vertical-logo.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/pro-usti-poster.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/pro-usti-slogan-icon-bubble.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/pro-usti-slogan-bubble.js') }}"
></script>
<script
type="text/javascript"
src="{{ url_for('static', filename='js/templates/sticker-number.js') }}"
></script>
<link
rel="preload"
href="{{ url_for('static', filename='fonts/bebas-neue/BebasNeue.woff') }}"
as="font"
type="font/woff"
>
<link
rel="preload"
href="{{ url_for('static', filename='fonts/bebas-neue/BebasNeue Bold.woff') }}"
as="font"
type="font/woff"
>
<link
rel="preload"
href="{{ url_for('static', filename='fonts/roboto-condensed/roboto-condensed-v25-latin-ext_latin-regular.woff2') }}"
as="font"
type="font/woff"
>
<link
rel="preload"
href="{{ url_for('static', filename='fonts/roboto-condensed/roboto-condensed-v25-latin-ext_latin-regular.woff') }}"
as="font"
type="font/woff"
>
<link
rel="preload"
href="{{ url_for('static', filename='fonts/raleway-black/raleway-black.woff') }}"
as="font"
type="font/woff"
>
<link
rel="preload"
href="{{ url_for('static', filename='fonts/raleway/raleway.woff') }}"
as="font"
type="font/woff"
>
<link
rel="stylesheet"
href="{{ url_for('static', filename='fonts/bebas-neue/style.css') }}"
>
<link
rel="stylesheet"
href="{{ url_for('static', filename='fonts/roboto-condensed/style.css') }}"
> <link
rel="stylesheet"
href="{{ url_for('static', filename='fonts/raleway-black/style.css') }}"
>
<link
rel="stylesheet"
href="{{ url_for('static', filename='fonts/raleway/style.css') }}"
>
<link
rel="stylesheet"
href="{{ url_for('static', filename='css/select2.css') }}"
>
<link
rel="stylesheet"
href="{{ url_for('static', filename='css/base.css') }}"
>
<link
rel="icon"
href="{{ url_for('static', filename='images/parrot.gif') }}"
>
</head>
<body>
<header>
<h1>
<img
src="{{ url_for('static', filename='images/badges/default-light.png') }}"
alt="Pirátské logo"
height="40"
width="40"
>
Generátor grafiky
</h1>
<small>Tentokrát ty volby vyhrajeme! :)</small>
</header>
<main class="container">
<div class="canvas-container">
<section class="position-top">
<section id="primary-image-position-wrapper-upper">
<b>Pozice:
<button class="move-primary-image-left">←</button>
<button class="move-primary-image-up">↑</button>
<button class="move-primary-image-right">→</button>
<button class="move-primary-image-down">↓</button>
<button class="move-primary-image-reset">Reset</button>
</b>
<br>
<b>
Přiblížení:
<input
type="range"
min="25"
max="300"
value="100"
class="zoom-primary-image-input slider"
autocomplete="off"
>
<button class="zoom-primary-image-reset">Reset</button>
</b>
</section>
</section>
<section class="guide-top">
<img id="guide-top-image" src="{{ url_for('static', filename='images/cover_guide_top.png') }}">
</section>
<section class="graphics-canvas">
<canvas id="graphicsCanvas"
width="2000"
height="2000"
></canvas>
</section>
<section class="settings">
<button id="download">Stáhnout</button>
<section id="printing-wrapper">
<br>
<button id="pdf-a4">PDF - A4</button>
<button id="pdf-a3">PDF - A3</button>
<button id="pdf-a2">PDF - A2</button>
<button id="pdf-a1">PDF - A1</button>
<button id="pdf-a0">PDF - A0</button>
</section>
<br>
<h3>Koncepty</h3>
<section>
<select id="concept-selection">
<option>Žádný koncept</option>
</select>
</section>
<div id="concept-save-wrapper">
<input
class="inline"
type="text"
id="concept-name"
placeholder="Jméno konceptu"
autocomplete="off"
required
>
<button id="concept-save">Uložit</button>
<span id="concept-settings-wrapper" style="display:none">
<button id="concept-delete">Smazat</button>
</span>
</div>
<br>
<small>
Generátor s ♥ vytvořil <a href="https://toho.neocities.org" target="_blank" rel="nofollow">Tomáš Valenta</a>
pod svobodnou licencí <a href="https://www.gnu.org/licenses/agpl-3.0.en.html" target="_blank">AGPLv3</a>.
</small>
</section>
</div>
<section class="controls-primary">
<section>
<h2>Typ šablony</h2>
<select id="template-selection">
<option
data-image-source="static/images/examples/bottom-slogan.png"
data-template-type="bottom-slogan"
>Velký spodní slogan</option>
<option
data-image-source="static/images/examples/bottom_slogan_full_width.png"
data-template-type="bottom-slogan-full-width"
>Velký spodní slogan, obdélník zabírající celou šířku</option>
<option
data-image-source="static/images/examples/bottom-slogan-gradient.png"
data-template-type="bottom-slogan-gradient" >Velký spodní slogan, gradient na pozadí</option>
<option
data-image-source="static/images/examples/bottom-slogan-person.png"
data-template-type="bottom-slogan-person"
>Velký spodní slogan, podobný nalodění</option>
<option
data-image-source="static/images/examples/left-long-text.png"
data-template-type="left-long-text"
>Dlouhý text vlevo</option>
<option
data-image-source="static/images/examples/right-long-text.png"
data-template-type="right-long-text"
>Dlouhý text vpravo</option>
<option
data-image-source="static/images/examples/right-big-text.png"
data-template-type="right-big-text"
>Velký text vpravo</option>
<option
data-image-source="static/images/examples/left_corner_slogan.png"
data-template-type="left-corner-slogan"
>Slogan v levém rohu, možnost koláže</option>
<option
data-image-source="static/images/examples/story_with_rectangle.png"
data-template-type="story-with-rectangle"
>Story - s obdélníkem</option>
<option
data-image-source="static/images/examples/story_full_width_rectangle.png"
data-template-type="story-with-full-width-rectangle"
>Story - obdélník zabírající celou šířku</option>
<option
data-image-source="static/images/examples/poll.png"
data-template-type="poll"
>Anketa</option>
<option
data-image-source="static/images/examples/cover.png"
data-template-type="cover-static-name-and-logo"
>Cover - pevné jméno a logo</option>
<option
data-image-source="static/images/examples/cover-left.png"
data-template-type="cover-static-name-and-logo-left"
>Cover - pevné jméno a logo, obsah vlevo</option>
<option
data-image-source="static/images/examples/cover.png"
data-template-type="cover"
>Cover</option>
<option
data-image-source="static/images/examples/no_image_icon_text.png"
data-template-type="no-image-icon-text"
>Bez obrázku - ikona, text</option>
<option
data-image-source="static/images/examples/no_image_text_more_info.png"
data-template-type="no-image-text-more-info"
>Bez obrázku - text, více informací</option>
<option
data-image-source="static/images/examples/no_image_quote.png"
data-template-type="no-image-quote"
>Bez obrázku - citát</option>
<option
data-image-source="static/images/examples/no_image_big_text_and_icon.png"
data-template-type="no-image-big-text-icon"
>Bez obrázku - velký slogan, ikona</option>
<option
data-image-source="static/images/examples/no_image_big_text_and_icon_with_terciary.png"
data-template-type="no-image-big-text-icon-with-terciary"
>Bez obrázku - velký slogan, ikona a delší spodní text</option>
<option
data-image-source="static/images/examples/poster_bottom_slogan.png"
data-template-type="poster-bottom-slogan-printable" >NA TISK: Plakát - velký spodní slogan</option>
<option
data-image-source="static/images/examples/poster_bottom_slogan_no_icon.png"
data-template-type="poster-bottom-slogan-no-icon-printable"
>NA TISK: Plakát - velký spodní slogan, bez ikony</option>
<option
data-image-source="static/images/examples/poster_center_slogan_no_image.png"
data-template-type="poster-center-slogan-no-image-printable"
>NA TISK: Plakát - pouze velký slogan uprostřed, bez obrázku</option>
<option
data-image-source="static/images/examples/poster_center_slogan_icons_no_image.png"
data-template-type="poster-center-slogan-icons-no-image-printable"
>NA TISK: Plakát - velký slogan a ikony, bez obrázku</option>
<option
data-image-source="static/images/examples/poster_event.png"
data-template-type="poster-event"
>NA TISK: Plakát - událost</option>
<option
data-image-source="static/images/examples/banner_name_left.png"
data-template-type="banner-name-left"
>Banner - jméno vlevo</option>
<option
data-image-source="static/images/examples/banner_name_right.png"
data-template-type="banner-name-right"
>Banner - jméno vpravo</option>
<option
data-image-source="static/images/examples/billboard.png"
data-template-type="billboard"
>Billboard</option>
<option
data-image-source="static/images/examples/event_text_right.png"
data-template-type="event-text-right"
>Událost - text vpravo</option>
<option
data-image-source="static/images/examples/event_text_bottom.png"
data-template-type="event-text-bottom"
>Událost - text dole</option>
<option
data-image-source="static/images/examples/eu_image_slogan.png"
data-template-type="eu-image-slogan"
>EU - obrázek + slogan</option>
<option
data-image-source="static/images/examples/eu_image_long_text.png"
data-template-type="eu-big-text-image"
>EU - dlouhý text, možnost obrázku</option>
<option
data-image-source="static/images/examples/eu_icons_image.png"
data-template-type="eu-icons-image"
>EU - text, ikony, možnost obrázku</option>
<option
data-image-source="static/images/examples/nalodeni.png"
data-template-type="nalodeni"
>Nalodění</option>
<option
data-image-source="static/images/examples/nalodeni_story.png"
data-template-type="nalodeni-story"
>Nalodění - story</option>
<option
data-image-source="static/images/examples/rollup_big_logo_short_text.png"
data-template-type="rollup-big-logo-short-text"
>Rollup - nutná lokalizace, velké pirátské logo, krátký text</option>
<option
data-image-source="static/images/examples/rollup_points.png"
data-template-type="rollup-points"
>Rollup - nutná lokalizace, max. 5 bodů</option>
<option data-image-source="static/images/examples/rollup_short_and_long_text.png"
data-template-type="rollup-short-and-long-text"
>Rollup - nutná lokalizace, krátký text a slogan</option>
<option
data-image-source="static/images/examples/koneckorupci.png"
data-template-type="koneckorupci-poll"
>Konec korupci - anketa</option>
<option
data-image-source="static/images/examples/humans.png"
data-template-type="humans"
>Humans of Piráti</option>
<option
data-image-source="static/images/examples/bottom-slogan-vertical-logo.png"
data-template-type="bottom-slogan-vertical-logo"
>Velký spodní slogan, vertikální logo</option>
<option
data-image-source="static/images/examples/bottom-slogan-gradient-vertical-logo.png"
data-template-type="bottom-slogan-gradient-vertical-logo"
>Velký spodní slogan, gradient na pozadí, vertikální logo</option>
<option
data-image-source="static/images/examples/no-image-text-icon-vertical-logo.png"
data-template-type="no-image-text-icon-vertical-logo"
>Bez obrázku - text, ikona, vertikální logo</option>
<option
data-image-source="static/images/examples/pro-usti-poster.png"
data-template-type="pro-usti-poster"
>PRO! Ústí - plakát</option>
<option
data-image-source="static/images/examples/pro-usti-slogan-icon-bubble.png"
data-template-type="pro-usti-slogan-icon-bubble"
>PRO! Ústí - krátký slogan, ikona, bublina</option>
<option
data-image-source="static/images/examples/pro-usti-slogan-bubble.png"
data-template-type="pro-usti-slogan-bubble"
>PRO! Ústí - krátký slogan, bublina</option>
<option
data-image-source="static/images/examples/sticker-number.png"
data-template-type="sticker-number"
>Samolepka s číslem kandidátky</option>
<option
data-image-source="static/images/examples/poster_bottom_slogan.png"
data-template-type="poster-bottom-slogan"
>NETISKNOUT: Plakát - velký spodní slogan</option>
<option
data-image-source="static/images/examples/poster_bottom_slogan_no_icon.png"
data-template-type="poster-bottom-slogan-no-icon"
>NETISKNOUT: Plakát - velký spodní slogan, bez ikony</option>
<option
data-image-source="static/images/examples/poster_center_slogan_no_image.png"
data-template-type="poster-center-slogan-no-image"
>NETISKNOUT: Plakát - pouze velký slogan uprostřed, bez obrázku</option>
<option
data-image-source="static/images/examples/poster_center_slogan_icons_no_image.png"
data-template-type="poster-center-slogan-icons-no-image"
>NETISKNOUT: Plakát - velký slogan a ikony, bez obrázku</option>
</select>
<p id="template-description"></p>
</section>
<h2>Hlavní nastavení</h2>
<section id="5-point-set-wrapper">
<h3>Set pěti bodů</h3>
<textarea
id="5-point-set-text-1"
placeholder="První bod"
></textarea>
<textarea
id="5-point-set-text-2"
placeholder="Druhý bod"
></textarea>
<textarea
id="5-point-set-text-3"
placeholder="Třetí bod"
></textarea>
<textarea
id="5-point-set-text-4"
placeholder="Čtvrtý bod"
></textarea>
<textarea
id="5-point-set-text-5"
placeholder="Pátý bod"
></textarea>
</section>
<h3>Text</h3>
<small>
Pro zvýraznění některých slov platí syntaxe: <tt>*slovo*</tt>.<br>
Prosím, neplýtvej zvýrazňovačem a zvýrazni jen jedno slovo.
</small>
<section id="primary-text-wrapper">
<textarea
id="primary-text"
placeholder="Primární text"
></textarea>
</section>
<section id="name-text-wrapper">
<input
type="text"
id="name-text"
placeholder="Jméno"
>
</section>
<section id="under-name-text-wrapper">
<textarea
id="under-name-text"
placeholder="Text pod jménem"
></textarea>
</section>
<section id="secondary-name-text-wrapper">
<input
type="text"
id="secondary-name-text"
placeholder="Jméno 2"
>
</section>
<section id="secondary-under-name-text-wrapper">
<textarea
id="secondary-under-name-text"
placeholder="Text pod 2. jménem"
></textarea>
</section>
<section id="secondary-text-wrapper">
<textarea
id="secondary-text" placeholder="Sekundární text"
></textarea>
</section>
<section id="terciary-text-wrapper">
<textarea
id="terciary-text"
placeholder="Terciární text"
></textarea>
</section>
<section id="date-text-wrapper">
<input
type="text"
id="date-text"
placeholder="Datum"
>
</section>
<section id="time-text-wrapper">
<input
type="text"
id="time-text"
placeholder="Čas"
>
</section>
<section id="location-text-wrapper">
<input
type="text"
id="location-text"
placeholder="Místo"
>
</section>
<section id="icon-text-wrapper">
<textarea
id="icon-text"
placeholder="Text vedle ikony, bez ikony vyplňuje její prostor"
></textarea>
</section>
<section id="requester-text-wrapper">
<br>
<input
type="checkbox"
id="show-requester"
name="show-requester"
>
<label for="show-requester">Zobrazit zadavatele a zpracovatele</label>
<br>
<input
style="display:none"
type="text"
id="requester-text"
placeholder="Zadavatel a zpracovatel"
value="Zadavatel a zpracovatel: Piráti"
>
</section>
<section id="gradient-wrapper">
<input
type="checkbox"
id="show-gradient"
name="show-gradient"
checked
> <label for="show-gradient">Zobrazit gradient</label>
</section>
<section id="primary-image-wrapper">
<h3>Hlavní obrázek</h3>
<input type="file" accept="image/*" id="primary-image" name="primary-image">
<section id="additional-3-primary-images-wrapper">
<h4>Vedlejší obrázky do koláže</h4>
<input type="file" accept="image/*" id="additional-primary-image-0" name="additional-primary-image-0">
<button id="reset-additional-primary-image-0">Resetovat</button>
<input type="file" accept="image/*" id="additional-primary-image-1" name="additional-primary-image-1">
<button id="reset-additional-primary-image-1">Resetovat</button>
<input type="file" accept="image/*" id="additional-primary-image-2" name="additional-primary-image-2">
<button id="reset-additional-primary-image-2">Resetovat</button>
</section>
</section>
<section id="secondary-image-wrapper">
<h3>Sekundární obrázek</h3>
<input type="file" accept="image/*" id="secondary-image" name="secondary-image">
</section>
<section id="2-reaction-set-wrapper">
<h3>Reakce</h3>
<h4>Vlevo</h4>
<select id="2-reaction-set-image-1-selection">
<option>Žádná reakce</option>
<option
data-image-source="{{ url_for('static', filename='images/reactions/like.png') }}"
data-image-reaction-source="{{ url_for('static', filename='images/reactions/like.png') }}"
>Like</option>
<option
data-image-source="{{ url_for('static', filename='images/reactions/laugh.png') }}"
data-image-reaction-source="{{ url_for('static', filename='images/reactions/laugh.png') }}"
>Smích</option>
<option
data-image-source="{{ url_for('static', filename='images/reactions/heart.png') }}"
data-image-reaction-source="{{ url_for('static', filename='images/reactions/heart.png') }}"
>Srdce</option>
<option
data-image-source="{{ url_for('static', filename='images/reactions/angry.png') }}"
data-image-reaction-source="{{ url_for('static', filename='images/reactions/angry.png') }}"
>Naštvaný</option>
<option
data-image-source="{{ url_for('static', filename='images/reactions/sad.png') }}"
data-image-reaction-source="{{ url_for('static', filename='images/reactions/sad.png') }}"
>Smutný</option>
<option
data-image-source="{{ url_for('static', filename='images/reactions/surprised.png') }}"
data-image-reaction-source="{{ url_for('static', filename='images/reactions/surprised.png') }}"
>Překvapený</option>
<option
data-image-source="{{ url_for('static', filename='images/reactions/care.png') }}"
data-image-reaction-source="{{ url_for('static', filename='images/reactions/care.png') }}"
>Péče</option>
</select>
<textarea
id="2-reaction-set-text-1"
type="text"
placeholder="Text"
></textarea>
<h4>Vpravo</h4>
<select id="2-reaction-set-image-2-selection">
<option>Žádná reakce</option>
<option
data-image-source="{{ url_for('static', filename='images/reactions/like.png') }}"
data-image-reaction-source="{{ url_for('static', filename='images/reactions/like.png') }}"
>Like</option>
<option
data-image-source="{{ url_for('static', filename='images/reactions/laugh.png') }}"
data-image-reaction-source="{{ url_for('static', filename='images/reactions/laugh.png') }}"
>Smích</option>
<option
data-image-source="{{ url_for('static', filename='images/reactions/heart.png') }}"
data-image-reaction-source="{{ url_for('static', filename='images/reactions/heart.png') }}"
>Srdce</option>
<option
data-image-source="{{ url_for('static', filename='images/reactions/angry.png') }}"
data-image-reaction-source="{{ url_for('static', filename='images/reactions/angry.png') }}"
>Naštvaný</option>
<option
data-image-source="{{ url_for('static', filename='images/reactions/sad.png') }}"
data-image-reaction-source="{{ url_for('static', filename='images/reactions/sad.png') }}"
>Smutný</option>
<option
data-image-source="{{ url_for('static', filename='images/reactions/surprised.png') }}"
data-image-reaction-source="{{ url_for('static', filename='images/reactions/surprised.png') }}"
>Překvapený</option>
<option
data-image-source="{{ url_for('static', filename='images/reactions/care.png') }}"
data-image-reaction-source="{{ url_for('static', filename='images/reactions/care.png') }}"
>Péče</option>
</select>
<textarea
id="2-reaction-set-text-2"
type="text"
placeholder="Text"
></textarea>
</section>
<section id="4-icon-group-wrapper">
<h3>Set čtyřech ikon</h3>
<h4>První ikona</h4>
<select id="4-icon-group-image-1-selection" class="icon-selection"></select>
<textarea
id="4-icon-group-text-1"
rows="2"
placeholder="Text vedle ikony"
></textarea>
<h4>Druhá ikona</h4>
<select id="4-icon-group-image-2-selection" class="icon-selection"></select>
<textarea
id="4-icon-group-text-2"
rows="2"
placeholder="Text vedle ikony"
></textarea>
<h4>Třetí ikona</h4>
<select id="4-icon-group-image-3-selection" class="icon-selection"></select>
<textarea id="4-icon-group-text-3"
rows="2"
placeholder="Text vedle ikony"
></textarea>
<h4>Čtvrtá ikona</h4>
<select id="4-icon-group-image-4-selection" class="icon-selection"></select>
<textarea
id="4-icon-group-text-4"
rows="2"
placeholder="Text vedle ikony"
></textarea>
</section>
<section id="5-icon-group-wrapper">
<h3>Set pěti ikon</h3>
<h4>První ikona</h4>
<select id="5-icon-group-image-1-selection" class="icon-selection"></select>
<textarea
id="5-icon-group-text-1"
rows="2"
placeholder="Text vedle ikony"
></textarea>
<h4>Druhá ikona</h4>
<select id="5-icon-group-image-2-selection" class="icon-selection"></select>
<textarea
id="5-icon-group-text-2"
rows="2"
placeholder="Text vedle ikony"
></textarea>
<h4>Třetí ikona</h4>
<select id="5-icon-group-image-3-selection" class="icon-selection"></select>
<textarea
id="5-icon-group-text-3"
rows="2"
placeholder="Text vedle ikony"
></textarea>
<h4>Čtvrtá ikona</h4>
<select id="5-icon-group-image-4-selection" class="icon-selection"></select>
<textarea
id="5-icon-group-text-4"
rows="2"
placeholder="Text vedle ikony"
></textarea>
<h4>Pátá ikona</h4>
<select id="5-icon-group-image-5-selection" class="icon-selection"></select>
<textarea
id="5-icon-group-text-5"
rows="2"
placeholder="Text vedle ikony"
></textarea>
</section>
<section id="icon-image-wrapper">
<h3>Ikony</h3>
<small>(Vyhledávání podle textu je možné)</small><br>
<select id="icon-image-selection" class="icon-selection"></select>
<br><br>
<b>
Nebo nahraj vlastní:
<input type="file" id="icon-image-input">
</b>
<button id="icon-image-reset">Resetovat</button>
</section>
<section id="pro-usti-icon-image-wrapper">
<h3>PRO! Ústí - Ikona</h3>
<small>(Vyhledávání podle textu je možné)</small><br>
<select id="pro-usti-icon-image-selection">
<option
data-image-source="{{ url_for('static', filename='images/pro-usti/icons/Zadne-diry-dark.png') }}"
data-image-icon-source="{{ url_for('static', filename='images/pro-usti/icons/Zadne-diry.png') }}"
>Žádné díry</option>
<option
data-image-source="{{ url_for('static', filename='images/pro-usti/icons/Srdce-dark.png') }}"
data-image-icon-source="{{ url_for('static', filename='images/pro-usti/icons/Srdce.png') }}"
>Srdce</option>
<option
data-image-source="{{ url_for('static', filename='images/pro-usti/icons/Schopny-politik-dark.png') }}"
data-image-icon-source="{{ url_for('static', filename='images/pro-usti/icons/Schopny-politik.png') }}"
>Schopný politik</option>
<option
data-image-source="{{ url_for('static', filename='images/pro-usti/icons/Pistalka-dark.png') }}"
data-image-icon-source="{{ url_for('static', filename='images/pro-usti/icons/Pistalka.png') }}"
>Píšťalka</option>
<option
data-image-source="{{ url_for('static', filename='images/pro-usti/icons/Mesto-dark.png') }}"
data-image-icon-source="{{ url_for('static', filename='images/pro-usti/icons/Mesto.png') }}"
>Město</option>
<option
data-image-source="{{ url_for('static', filename='images/pro-usti/icons/Komunikace-dark.png') }}"
data-image-icon-source="{{ url_for('static', filename='images/pro-usti/icons/Komunikace.png') }}"
>Komunikace</option>
</select>
<br><br>
<b>
Nebo nahraj vlastní:
<input type="file" id="pro-usti-icon-image-input">
</b>
<button id="pro-usti-icon-image-reset">Resetovat</button>
</section>
<section id="location-image-wrapper">
<h3>Lokalizace</h3>
<small>(Vyhledávání podle textu je možné)</small><br>
<select id="location-image-selection"> <option>Žádná lokalizace</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Benesov-1-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Benesov-1.png') }}"
>Benešov 1</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Benesov-2-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Benesov-2.png') }}"
>Benešov 2</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Benesov-3-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Benesov-3.png') }}"
>Benešov 3</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Beroun-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Beroun.png') }}"
>Beroun</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Blansko-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Blansko.png') }}"
>Blansko</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Boskovicko-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Boskovicko.png') }}"
>Boskovicko</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Brno-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Brno.png') }}"
>Brno</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Brandys-nad-labem-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Brandys-nad-labem.png') }}"
>Brandýs nad Labem</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Breclavsko-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Breclavsko.png') }}"
>Břeclavsko</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Bohumin-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Bohumin.png') }}"
>Bohumín</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Caslav-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Caslav.png') }}"
>Čáslav</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Ceska-lipa-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Ceska-lipa.png') }}"
>Česka Lípa</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Ceska-trebova-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Ceska-trebova.png') }}"
>Česká Třebová</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Ceske-budejovice-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Ceske-budejovice.png') }}"
>České Budějovice</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Cesky-tesin-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Cesky-tesin.png') }}"
>Český Těšín</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Cheb-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Cheb.png') }}"
>Cheb</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Chudova-plana-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Chudova-plana.png') }}"
>Chudová Planá</option>
<option data-image-source="{{ url_for('static', filename='images/locations/Chrast-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Chrast.png') }}"
>Chrast</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Chrudim-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Chrudim.png') }}"
>Chrudim</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Decin-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Decin.png') }}"
>Děčín</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Domazlice-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Domazlice.png') }}"
>Domažlice</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Frydek-mistek-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Frydek-mistek.png') }}"
>Frýdek-Místek</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Havirov-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Havirov.png') }}"
>Havířov</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Havlickuv-brod-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Havlickuv-brod.png') }}"
>Havlíčkův Brod</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Hermanuv-mestec-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Hermanuv-mestec.png') }}"
>Heřmanův Městec</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Hodonin-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Hodonin.png') }}"
>Hodonín</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Holesov-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Holesov.png') }}"
>Holešov</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Holysov-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Holysov.png') }}"
>Holyšov</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Hradec-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Hradec.png') }}"
>Hradec</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Jablonec-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Jablonec.png') }}"
>Jablonec nad Nisou</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Jesenice-jilove-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Jesenice-jilove.png') }}"
>Jesenice - Jílové</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Jihlava-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Jihlava.png') }}"
>Jihlava</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Jilemnice-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Jilemnice.png') }}"
>Jílemnice</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Jindrichuv-hradec-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Jindrichuv-hradec.png') }}"
>Jindřichův Hradec</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Kadan-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Kadan.png') }}" >Kadaň</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Karlovy-vary-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Karlovy-vary.png') }}"
>Karlovy Vary</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Karvina-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Karvina.png') }}"
>Karviná</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Kladno-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Kladno.png') }}"
>Kladno</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Klatovy-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Klatovy.png') }}"
>Klatovy</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Kolin-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Kolin.png') }}"
>Kolín</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Kralupy-nad-vltavou-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Kralupy-nad-vltavou.png') }}"
>Kralupy nad Vltavou</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Kromeriz-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Kromeriz.png') }}"
>Kroměříž</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Kutna-hora-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Kutna-hora.png') }}"
>Kutná Hora</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Liberec-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Liberec.png') }}"
>Liberec</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Livtinov-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Livtinov.png') }}"
>Livtínov</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Loket-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Loket.png') }}"
>Loket</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Louny-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Louny.png') }}"
>Louny</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Lysa-nad-labem-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Lysa-nad-labem.png') }}"
>Lysá nad Labem</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Marianske-lazne-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Marianske-lazne.png') }}"
>Mariánské Lázně</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Melnik-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Melnik.png') }}"
>Mělník</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Moravska-ostrava-a-privoz-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Moravska-ostrava-a-privoz.png') }}"
>Moravská Ostrava a Přívoz</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Moravska-trebova-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Moravska-trebova.png') }}"
>Moravská Třebová</option>
<option data-image-source="{{ url_for('static', filename='images/locations/Mikulov-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Mikulov.png') }}"
>Mikulov</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Milovice-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Milovice.png') }}"
>Milovice</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Mlada-boleslav-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Mlada-boleslav.png') }}"
>Mladá Boleslav</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Mnisecko-a-dolni-berounka-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Mnisecko-a-dolni-berounka.png') }}"
>Mnisecko a Dolní Berounka</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Most-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Most.png') }}"
>Most</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Napajedla-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Napajedla.png') }}"
>Napajedla</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Neratovice-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Neratovice.png') }}"
>Neratovice</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Nova-role-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Nova-role.png') }}"
>Nová Role</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Nymburk-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Nymburk.png') }}"
>Nymburk</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Olomouc-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Olomouc.png') }}"
>Olomouc</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Opava-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Opava.png') }}"
>Opava</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Orlova-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Orlova.png') }}"
>Orlová</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Ostrava-jih-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Ostrava-jih.png') }}"
>Ostrava-jih</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Ostrava-poruba-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Ostrava-poruba.png') }}"
>Ostrava-poruba</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Ostrava-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Ostrava.png') }}"
>Ostrava</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Otrokovice-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Otrokovice.png') }}"
>Otrokovice</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Pardubice-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Pardubice.png') }}"
>Pardubice</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Pelhrimov-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Pelhrimov.png') }}" >Pelhřimov</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Pisek-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Pisek.png') }}"
>Písek</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Plzen-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Plzen.png') }}"
>Plzeň</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Policka-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Policka.png') }}"
>Polička</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Podebrady-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Podebrady.png') }}"
>Poděbrady</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Poruba-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Poruba.png') }}"
>Poruba</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Prachatice-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Prachatice.png') }}"
>Prachatice</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Praha-1-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Praha-1.png') }}"
>Praha 1</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Praha-2-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Praha-2.png') }}"
>Praha 2</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Praha-3-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Praha-3.png') }}"
>Praha 3</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Praha-4-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Praha-4.png') }}"
>Praha 4</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Praha-5-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Praha-5.png') }}"
>Praha 5</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Praha-6-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Praha-6.png') }}"
>Praha 6</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Praha-7-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Praha-7.png') }}"
>Praha 7</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Praha-8-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Praha-8.png') }}"
>Praha 8</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Praha-9-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Praha-9.png') }}"
>Praha 9</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Praha-10-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Praha-10.png') }}"
>Praha 10</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Praha-11-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Praha-11.png') }}"
>Praha 11</option>
<option data-image-source="{{ url_for('static', filename='images/locations/Praha-11-2-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Praha-11-2.png') }}"
>Praha 11, 2. verze</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Praha-12-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Praha-12.png') }}"
>Praha 12</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Praha-13-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Praha-13.png') }}"
>Praha 13</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Praha-14-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Praha-14.png') }}"
>Praha 14</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Praha-15-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Praha-15.png') }}"
>Praha 15</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Praha-18-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Praha-18.png') }}"
>Praha 18</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Praha-21-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Praha-21.png') }}"
>Praha 21</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Prerov-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Prerov.png') }}"
>Přerov</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Pribor-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Pribor.png') }}"
>Příbor</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Pribram-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Pribram.png') }}"
>Příbram</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Prostejov-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Prostejov.png') }}"
>Prostějov</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Rotava-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Rotava.png') }}"
>Rotava</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Roudnice-nad-labem-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Roudnice-nad-labem.png') }}"
>Roudnice nad Labem</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Roznov-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Roznov.png') }}"
>Rožnov</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Rudoltice-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Rudoltice.png') }}"
>Rudoltice</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Rychnov-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Rychnov.png') }}"
>Rychnov</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Slovacko-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Slovacko.png') }}"
>Slovácko</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Sobeslav-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Sobeslav.png') }}" >Soběslav</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Sokolov-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Sokolov.png') }}"
>Sokolov</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Strakonice-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Strakonice.png') }}"
>Strakonice</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Susice-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Susice.png') }}"
>Sušice</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Sumperk-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Sumperk.png') }}"
>Šumperk</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Svitavy-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Svitavy.png') }}"
>Svitavy</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Tachov-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Tachov.png') }}"
>Tachov</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Tabor-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Tabor.png') }}"
>Tábor</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Telc-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Telc.png') }}"
>Telč</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Teplice-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Teplice.png') }}"
>Teplice</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Terezin-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Terezin.png') }}"
>Terezín</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Trutnov-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Trutnov.png') }}"
>Trutnov</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Trebic-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Trebic.png') }}"
>Třebíč</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Turnov-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Turnov.png') }}"
>Turnov</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Tyn-nad-vltavou-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Tyn-nad-vltavou.png') }}"
>Týn nad Vltavou</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Uherske-hradiste-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Uherske-hradiste.png') }}"
>Uherské Hradiště</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Usti-nad-labem-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Usti-nad-labem.png') }}"
>Ústí nad Labem</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Valec-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Valec.png') }}"
>Valeč</option>
<option data-image-source="{{ url_for('static', filename='images/locations/Valmez-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Valmez.png') }}"
>Valmez</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Vejprtice-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Vejprtice.png') }}"
>Vejprtice</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Volary-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Volary.png') }}"
>Volary</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Zatec-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Zatec.png') }}"
>Žatec</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Zelezny-brod-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Zelezny-brod.png') }}"
>Železný Brod</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Zlin-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Zlin.png') }}"
>Zlín</option>
<option
data-image-source="{{ url_for('static', filename='images/locations/Znojemsko-dark.png') }}"
data-image-location-source="{{ url_for('static', filename='images/locations/Znojemsko.png') }}"
>Znojemsko</option>
</select>
<section id="location-to-top-wrapper">
<input
type="checkbox"
name="location-to-top"
id="location-to-top"
>
<label for="location-to-top">Zobrazit nahoře</label>
</section>
</section>
<section id="qr-code-wrapper">
<h3>QR kód</h3>
<input
type="text"
id="qr-code-source"
placeholder="Adresa stránek"
>
</section>
<section id="selectable-rollup-background-wrapper">
<h3>Pozadí rollupu</h3>
<select id="selectable-rollup-background">
<option
data-image-source="{{ url_for('static', filename='images/scroll-backgrounds/prerov-dark.png') }}"
data-color-scheme="white-on-black-prerov"
>Přerov - tmavé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/scroll-backgrounds/prerov-light.png') }}"
data-color-scheme="black-on-white-prerov"
>Přerov - světlé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/scroll-backgrounds/pardubice-dark.png') }}"
data-color-scheme="white-on-black-pardubice"
>Pardubice - tmavé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/scroll-backgrounds/pardubice-light.png') }}"
data-color-scheme="black-on-white-pardubice"
>Pardubice - světlé pozadí</option>
</select> </section>
</section>
<section class="controls-secondary">
<section id="primary-image-position-wrapper-lower">
<h2>Detaily</h2>
<h3>Hlavní obrázek</h3>
<b>Pozice:
<button class="move-primary-image-left">←</button>
<button class="move-primary-image-up">↑</button>
<button class="move-primary-image-right">→</button>
<button class="move-primary-image-down">↓</button>
<button class="move-primary-image-reset">Reset</button>
<br>
<small>(Také možno změnit tažením obrázku)</small>
</b>
<br>
<b>
Přiblížení:
<input
type="range"
min="25"
max="300"
value="100"
class="zoom-primary-image-input slider"
autocomplete="off"
>
<button class="zoom-primary-image-reset">Reset</button>
</b>
</section>
<section id="logo-image-wrapper">
<h3>Logo</h3>
<div id="logo-is-center-wrapper">
<input type="checkbox" id="logo-is-center" name="logo-is-center">
<label for="logo-is-center">Na střed</label>
<br><br>
</div>
<div id="logo-additional-image-wrapper">
<label for="logo-additional-image">
<b>Prosím, nepoužívej jiné varianty pirátského loga! U svého vlastního pamatuj na průhledné pozadí.</b><br>
Přidat vlastní:
</label>
<input type="file" accept="image/*" id="logo-additional-image" name="logo-additional-image">
<br>
<button id="logo-additional-image-reset">Resetovat</button>
</div>
<div id="logo-size-wrapper">
<label for="logo-image-zoom"><b>Velikost loga:</b></label>
<input
type="range"
min="25"
max="300"
value="100"
id="logo-image-zoom"
name="logo-image-zoom"
class="slider" autocomplete="off"
>
<button id="logo-image-zoom-reset">Reset</button>
</div>
</section>
<section id="background-has-pattern-wrapper">
<h3>Vzor na pozadí</h3>
<input type="checkbox" id="background-has-pattern" name="background-has-pattern">
<label for="background-has-pattern" checked>Zobrazit</label>
</section>
<h3>Nastavení barev</h3>
<section id="pro-usti-color-scheme-wrapper">
<h4>Barvy PRO! Ústí</h4>
<select id="pro-usti-color-scheme-selection">
<option
data-image-source="{{ url_for('static', filename='images/color-samples/blue-on-orange.png') }}"
data-color-scheme="blue-on-orange"
>Modrá na oranžové</option>
<option
data-image-source="{{ url_for('static', filename='images/color-samples/purple-on-pink.png') }}"
data-color-scheme="purple-on-pink"
>Fialová na růžové</option>
<option
data-image-source="{{ url_for('static', filename='images/color-samples/orange-on-brown.png') }}"
data-color-scheme="orange-on-brown"
>Oranžová na hnědé</option>
<option
data-image-source="{{ url_for('static', filename='images/color-samples/pink-on-orange.png') }}"
data-color-scheme="pink-on-orange"
>Růžová na oranžové</option>
<option
data-image-source="{{ url_for('static', filename='images/color-samples/blue-on-white.png') }}"
data-color-scheme="blue-on-white"
>Modrá na bílé</option>
<option
data-image-source="{{ url_for('static', filename='images/color-samples/green-on-pink.png') }}"
data-color-scheme="green-on-pink"
>Zelená na růžové</option>
</select>
</section>
<section id="primary-color-scheme-wrapper">
<section id="coalition-wrapper">
<h4>Podle koalice</h4>
<select id="coalition-selection">
<option>Žádná koalice</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/forum_jihlava_purple_dark.png') }}"
data-coalition="forum-jihlava-purple-dark"
>Piráti a Fórum Jihlava - fialové barvy, tmavé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/forum_jihlava_purple_light.png') }}"
data-coalition="forum-jihlava-purple-light"
>Piráti a Fórum Jihlava - fialové barvy, světlé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/forum_jihlava.png') }}"
data-coalition="forum-jihlava-dark"
>Piráti a Fórum Jihlava - původní barvy</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/zeleni_most_green_dark.png') }}"
data-coalition="zeleni-most-green-dark"
>Piráti a Zelení pro Most - zelené barvy, tmavé pozadí</option>
<option data-image-source="{{ url_for('static', filename='images/examples/zeleni_most_green_light.png') }}"
data-coalition="zeleni-most-green-light"
>Piráti a Zelení pro Most - zelené barvy, světlé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/zeleni_most.png') }}"
data-coalition="zeleni-most-dark"
>Piráti a Zelení pro Most - původní barvy</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/zeleni_praha14_green_dark.png') }}"
data-coalition="zeleni-praha14-green-dark"
>Piráti, Nezávislí a Zelení, Praha 14 - zelené barvy, tmavé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/zeleni_praha14_green_light.png') }}"
data-coalition="zeleni-praha14-green-light"
>Piráti, Nezávislí a Zelení, Praha 14 - zelené barvy, světlé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/zeleni14_praha.png') }}"
data-coalition="zeleni-praha14-dark"
>Piráti, Nezávislí a Zelení, Praha 14 - původní barvy</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/zeleni_praha13_green_dark.png') }}"
data-coalition="zeleni-praha13-green-dark"
>Piráti a Zelení, Praha 13 - zelené barvy, tmavé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/zeleni_praha13_green_light.png') }}"
data-coalition="zeleni-praha13-green-light"
>Piráti a Zelení, Praha 13 - zelené barvy, světlé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/zeleni_praha13.png') }}"
data-coalition="zeleni-praha13-dark"
>Piráti a Zelení, Praha 13 - původní barvy</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/volary_green_dark.png') }}"
data-coalition="volary-green-dark"
>Odvážně pro Volary - zelené barvy, tmavé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/volary_green_light.png') }}"
data-coalition="volary-green-light"
>Odvážně pro Volary - zelené barvy, světlé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/volary.png') }}"
data-coalition="volary-dark"
>Odvážně pro Volary - původní barvy</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/louny_spolecne_purple_dark.png') }}"
data-coalition="louny-spolecne-purple-dark"
>Louny Společně - fialové barvy, tmavé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/louny_spolecne_purple_light.png') }}"
data-coalition="louny-spolecne-purple-light"
>Louny Společně - fialové barvy, světlé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/louny_spolecne.png') }}"
data-coalition="spolecne-s-piraty-dark"
>Louny Společně - původní barvy</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/vice_litomerice_blue_dark.png') }}"
data-coalition="vice-litomerice-blue-dark"
>Více pro Litoměřice - modré barvy, tmavé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/vice_litomerice_blue_light.png') }}"
data-coalition="vice-litomerice-blue-light"
>Více pro Litoměřice - modré barvy, světlé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/vice_litomerice.png') }}" data-coalition="vice-litomerice-dark"
>Více pro Litoměřice - původní barvy</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/stranane_yellow_white.png') }}"
data-coalition="stranane-yellow-white"
>Straňané - žlutá na bílé</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/stranane_white_yellow.png') }}"
data-coalition="stranane-white-yellow"
>Straňané - bílá na žluté</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/stranane_gray_yellow.png') }}"
data-coalition="stranane-gray-yellow"
>Straňané - šedá na žluté</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/stranane_base.png') }}"
data-coalition="stranane-base"
>Straňané - původní barvy</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/prusanky_yellow_white.png') }}"
data-coalition="prusanky-yellow-white"
>Mladí pro Prušánky - žlutá na bílé</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/prusanky_white_yellow.png') }}"
data-coalition="prusanky-white-yellow"
>Mladí pro Prušánky - bílá na žluté</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/prusanky_black_yellow.png') }}"
data-coalition="prusanky-black-yellow"
>Mladí pro Prušánky - černá na žluté</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/prusanky_base.png') }}"
data-coalition="prusanky-base"
>Mladí pro Prušánky - původní barvy</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/ujezd_white_green.png') }}"
data-coalition="ujezd-white-green"
>Újezd Žije - bílá na zelené</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/ujezd_green_white.png') }}"
data-coalition="ujezd-green-white"
>Újezd Žije - zelená na bílé</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/ujezd_base.png') }}"
data-coalition="ujezd-base"
>Újezd Žije - původní barvy</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/cssd_black_red.png') }}"
data-coalition="cssd-rychnov-black-red"
>Piráti a ČSSD Rychnov - černá na červené</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/cssd_red_black.png') }}"
data-coalition="cssd-rychnov-red-black"
>Piráti a ČSSD Rychnov - červená na černé</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/cssd_base.png') }}"
data-coalition="cssd-rychnov-base"
>Piráti a ČSSD Rychnov - původní barvy</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/jilemnice_purple_black.png') }}"
data-coalition="jilemnice-black-purple"
>Jílemnice Budoucnosti - černá na fialové</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/jilemnice_black_purple.png') }}"
data-coalition="jilemnice-purple-black" >Jílemnice Budoucnosti - fialová na černé</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/jilemnice_base.png') }}"
data-coalition="jilemnice-base"
>Jílemnice Budoucnosti - původní barvy</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/novarole_white_green.png') }}"
data-coalition="novarole-white-green"
>Novorolští Piráti - bílá na zelené</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/novarole_green_white.png') }}"
data-coalition="novarole-green-white"
>Novorolští Piráti - zelená na bílé</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/novarole_green_black.png') }}"
data-coalition="novarole-green-black"
>Novorolští Piráti - zelená na černé</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/novarole_base.png') }}"
data-coalition="novarole-base"
>Novorolští Piráti - původní barvy</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/pirati_spolecne_blue_dark.png') }}"
data-coalition="spolecne-s-piraty-blue-dark"
>Společně s Piráty - modré barvy, tmavé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/pirati_spolecne_blue_light.png') }}"
data-coalition="spolecne-s-piraty-blue-light"
>Společně s Piráty - modré barvy, světlé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/pirati_spolecne.png') }}"
data-coalition="spolecne-s-piraty-dark"
>Společně s Piráty - původní barvy</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/nezavisli_light.png') }}"
data-coalition="nezavisli-light"
>Piráti a Nezávislí kandidáti, světlé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/nezavisli_dark.png') }}"
data-coalition="nezavisli-dark"
>Piráti a Nezávislí kandidáti, tmavé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/dana_balcarova_light.png') }}"
data-coalition="balcarova-light"
>Dana Balcarová - fialové logo, světlé pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/examples/dana_balcarova_dark.png') }}"
data-coalition="balcarova-dark"
>Dana Balcarová - fialové logo, tmavé pozadí</option>
</select>
<section id="litomerice-corner" style="display:none">
<h4>Typ rohu</h4>
<select id="litomerice-corner-type-selection">
<option value="none">Žádný roh</option>
<option value="#000000">Piráti - černá</option>
<option value="#a22de6">TOP 09 - fialová</option>
<option value="#ffe05d">KDU-ČSL - žlutá</option>
<option value="#94da58">Zelení - zelená</option>
</select>
</section>
</section>
<h4>Hlavní barvy</h4>
<select id="primary-color-scheme-selection">
<option
data-image-source="{{ url_for('static', filename='images/black-on-white.png') }}"
data-color-scheme="black-on-white"
>Černý text na bílém pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/white-on-black.png') }}"
data-color-scheme="white-on-black"
>Bílý text na černém pozadí</option>
</select>
</section>
<section id="name-color-scheme-wrapper">
<h4>Barvy boxu se jménem</h4>
<select id="name-color-scheme-selection">
<option
data-image-source="{{ url_for('static', filename='images/white-on-black.png') }}"
data-color-scheme="white-on-black"
value="white-on-black"
>Bílý text na černém pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/black-on-white.png') }}"
data-color-scheme="black-on-white"
value="black-on-white"
>Černý text na bílém pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/black-on-gold.png') }}"
data-color-scheme="black-on-gold"
value="black-on-gold"
>Černý text na zlatém pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/black-on-blue.png') }}"
data-color-scheme="black-on-blue"
value="black-on-blue"
>Černý text na modrém pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/black-on-gray.png') }}"
data-color-scheme="black-on-gray"
value="black-on-gray"
>Černý text na šedém pozadí</option>
</select>
</section>
<section id="secondary-color-scheme-wrapper">
<h4>Barvy boxu se sekundárním textem</h4>
<select id="secondary-color-scheme-selection">
<option
data-image-source="{{ url_for('static', filename='images/black-on-gray.png') }}"
data-color-scheme="black-on-gray"
value="black-on-gray"
>Černý text na šedém pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/white-on-black.png') }}"
data-color-scheme="white-on-black"
value="white-on-black"
>Bílý text na černém pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/black-on-white.png') }}"
data-color-scheme="black-on-white"
value="black-on-white"
>Černý text na bílém pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/black-on-blue.png') }}"
data-color-scheme="black-on-blue"
value="black-on-blue"
>Černý text na modrém pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/black-on-gold.png') }}"
data-color-scheme="black-on-gold" value="black-on-gold"
>Černý text na zlatém pozadí</option>
</select>
</section>
<section id="terciary-color-scheme-wrapper">
<h4>Barvy boxu s terciárním textem</h4>
<select id="terciary-color-scheme-selection">
<option
data-image-source="{{ url_for('static', filename='images/white-on-black.png') }}"
data-color-scheme="white-on-black"
value="white-on-black"
>Bílý text na černém pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/black-on-white.png') }}"
data-color-scheme="black-on-white"
value="black-on-white"
>Černý text na bílém pozadí</option>
<option
data-image-source="{{ url_for('static', filename='images/black-on-gold.png') }}"
data-color-scheme="black-on-gold"
value="black-on-gold"
>Černý text na zlatém pozadí</option>
</select>
</section>
<section id="color-palette-wrapper">
<h4>Paleta - vlastní barvy</h4>
<div id="primary-text-color-wrapper" class="color-picker-wrapper">
Primární text
<select class="colorPickSelector" id="primary-text-color"></select>
</div>
<div id="icon-text-color-wrapper" class="color-picker-wrapper">
Text u ikon
<select class="colorPickSelector" id="icon-text-color"></select>
</div>
<div id="background-color-wrapper" class="color-picker-wrapper">
Pozadí
<select class="colorPickSelector" id="background-color"></select>
</div>
<div id="foreground-color-wrapper" class="color-picker-wrapper">
Popředí
<select class="colorPickSelector" id="foreground-color"></select>
</div>
<div id="background-gradient-color1-wrapper" class="color-picker-wrapper">
První barva gradientu na pozadí
<select class="colorPickSelector" id="background-gradient-color1"></select>
</div>
<div id="background-gradient-color2-wrapper" class="color-picker-wrapper">
Druhá barva gradientu na pozadí
<select class="colorPickSelector" id="background-gradient-color2"></select>
</div>
<div id="name-background-color-wrapper" class="color-picker-wrapper">
Pozadí jména
<select class="colorPickSelector" id="name-background-color"></select>
</div>
<div id="name-text-color-wrapper" class="color-picker-wrapper">
Jméno
<select class="colorPickSelector" id="name-text-color"></select>
</div>
<div id="under-name-text-color-wrapper" class="color-picker-wrapper">
Text pod jménem <select class="colorPickSelector" id="under-name-text-color"></select>
</div>
<div id="secondary-text-background-color-wrapper" class="color-picker-wrapper">
Pozadí sekundárního textu
<select class="colorPickSelector" id="secondary-text-background-color"></select>
</div>
<div id="secondary-text-color-wrapper" class="color-picker-wrapper">
Sekundární text
<select class="colorPickSelector" id="secondary-text-color"></select>
</div>
<div id="terciary-text-background-color-wrapper" class="color-picker-wrapper">
Pozadí terciárního textu
<select class="colorPickSelector" id="terciary-text-background-color"></select>
</div>
<div id="terciary-text-color-wrapper" class="color-picker-wrapper">
Terciární text
<select class="colorPickSelector" id="terciary-text-color"></select>
</div>
<div id="primary-text-highlight-color-wrapper" class="color-picker-wrapper">
Zvýraznění primárního textu
<select class="colorPickSelector" id="primary-text-highlight-color"></select>
</div>
<div id="secondary-text-highlight-color-wrapper" class="color-picker-wrapper">
Zvýraznění sekundárního textu
<select class="colorPickSelector" id="secondary-text-highlight-color"></select>
</div>
<div id="reaction-text-color-wrapper" class="color-picker-wrapper">
Text u reakcí
<select class="colorPickSelector" id="reaction-text-color"></select>
</div>
<div id="qr-code-color-wrapper" class="color-picker-wrapper">
QR Kód
<select class="colorPickSelector" id="qr-code-color"></select>
</div>
<div id="quote-color-wrapper" class="color-picker-wrapper">
Uvozovky
<select class="colorPickSelector" id="quote-color"></select>
</div>
<div id="requester-text-color-wrapper" class="color-picker-wrapper">
Zadavatel a zpracovatel
<select class="colorPickSelector" id="requester-text-color"></select>
</div>
</section>
<h3>Pokročilé nastavení</h3>
<input
type="number"
id="resolution"
placeholder="Rozlišení, v pixelech - běžně 2000"
>
</section>
</main>
<script type="text/javascript" src="{{ url_for('static', filename='js/ui.js') }}"></script>
<script type="text/javascript" src="{{ url_for('static', filename='js/concept.js') }}"></script>
</body>
</html>