diff --git a/content/index.html b/content/index.html
index 1fd61aa9d7604a61c3274be1da38dc79487b849b..831951a28cf836fdc58124129bb90e380791fcc1 100644
--- a/content/index.html
+++ b/content/index.html
@@ -7,17 +7,17 @@
<!-- Author: Tomáš Valenta, https://blog.imaniti.org -->
<title>Voličské průkazy</title>
- <meta name="description" content="Vol si jak chceš, kde chceš. My ti to zjednodušíme.">
+ <meta name="description" content="Již za dva měsíce nás čekají prezidentské volby a Piráti znovu nabízí možnost, jak si vyřídit voličský průkaz - tedy potvrzení, že můžeš volit i na jiném místě, než v trvalém bydlišti.">
<meta property="og:type" content="website">
<meta property="og:title" content="Voličské průkazy">
- <meta property="og:description" content="Vol si jak chceš, kde chceš. My ti to zjednodušíme.">
+ <meta property="og:description" content="Již za dva měsíce nás čekají prezidentské volby a Piráti znovu nabízí možnost, jak si vyřídit voličský průkaz - tedy potvrzení, že můžeš volit i na jiném místě, než v trvalém bydlišti.">
<meta property="og:image" content="https://prukazy.pirati.cz/static/images/banner.webp">
<meta name="twitter:card" content="summary_large_image">
<meta property="twitter:domain" content="prukazy.pirati.cz">
<meta name="twitter:title" content="Voličské průkazy">
- <meta name="twitter:description" content="Vol si jak chceš, kde chceš. My ti to zjednodušíme.">
+ <meta name="twitter:description" content="Již za dva měsíce nás čekají prezidentské volby a Piráti znovu nabízí možnost, jak si vyřídit voličský průkaz - tedy potvrzení, že můžeš volit i na jiném místě, než v trvalém bydlišti.">
<meta name="twitter:image" content="https://prukazy.pirati.cz/static/images/banner.webp">
<link
@@ -70,10 +70,10 @@
<main>
<div id="step1">
- <h1>Vyřiďte si svůj voličský průkaz na prezidentské volby!</h1>
+ <h1>Vyřiď si svůj voličský průkaz na prezidentské volby!</h1>
<p id="intro-text">
Již za dva měsíce nás čekají prezidentské volby a Piráti znovu nabízí možnost, jak si vyřídit voličský průkaz - tedy potvrzení, že můžeš volit i na jiném místě, než v trvalém bydlišti.<br>
- Vyplň náš jednoduchý formulář, stáhni si ho v PDF a pošli ho datovkou nebo dones osobně na úřad. Neboj se - vážíme si tvého soukromí, nesbíráme žádná osobní data a vše zpracovává tvůj prohlížeč.
+ Vyplň náš jednoduchý formulář, stáhni si ho v PDF a pošli ho datovkou nebo dones osobně na úřad. Neboj se - vážíme si tvého soukromí, nesbíráme žádná osobní data a vše zpracovává výhradně tvůj prohlížeč.
</p>
<div id="form-wrapper">
diff --git a/content/static/css/base.css b/content/static/css/base.css
index f0cb436a4d37403d9c3fb16be2c1ca36114aeb96..af36a28c8aea791896dc7e505bb8be197a3c9b9e 100644
--- a/content/static/css/base.css
+++ b/content/static/css/base.css
@@ -1,99 +1,59 @@
-html, body {
- padding:0;
- margin:0
+#address-autocomplete {
+ position:relative;
+ text-align:center
}
-body {
- background:#000;
- font-family:"Open Sans",sans-serif;
+#canvas-wrapper {
+ display:none;
+ object-fit:contain
}
-a {
- color:#000
+#canvas-wrapper canvas {
+ width:100%
}
-a:hover,a:visited {
- color:#000
+#finish,#download-pdf {
+ margin-top:20px
}
-header {
- height:70px;
- padding:10px;
- background:#000;
+#form-wrapper {
display:flex;
- justify-content:center;
- color:#fff
-}
-
-main {
- border-top-left-radius:40px;
- border-top-right-radius:40px;
- background:#fff;
- min-height:calc(100vh - 90px);
-}
-
-
-input,[aria-role="textbox"],textarea,select {
- border:0;
- font-size:unset;
- padding:10px;
- font-family:"Open Sans",sans-serif;
- background: #dddcdc;
-}
-
-button,
-input[type="submit"],
-[aria-role="button"] {
- background:#2f2f2f;
- border:none;
- color:#fff;
- cursor:pointer;
- display:inline-block;
- font-size:unset;
- padding:12px;
- text-decoration:none;
- transition:.15s
-}
-
-button[disabled],
-input[type="submit"][disabled],
-[aria-role="button"][disabled] {
- background:#737373;
- cursor:unset
+ flex-direction:column;
+ gap:14px;
+ margin-left:auto;
+ margin-right:auto;
+ max-width:750px;
+ padding-bottom:20px
}
-button:not([disabled]):hover,
-input[type="submit"]:not([disabled]):hover,
-[aria-role="button"]:not([disabled]):hover {
- background:#333
+#found-office,#not-found-office,#step3 {
+ display:none
}
-textarea {
- resize:none
+#intro-text {
+ border-bottom:1px solid #000;
+ font-size:large;
+ margin-bottom:14px;
+ padding-bottom:14px
}
-
#logo {
+ align-items:center;
display:flex;
flex-direction:row;
- gap:12px;
- align-items:center
-}
-
-#step1,#step2,#step3,#canvas-wrapper {
- max-width:1000px;
- margin-left:auto;
- margin-right:auto;
- padding-top:40px
+ gap:12px
}
-#found-office,#not-found-office {
- display:none
+#show-document {
+ display:block;
+ margin-bottom:17.5px
}
-#step2 {
- display:none;
- text-align:center
+#signature-bottom {
+ align-items:flex-end;
+ display:flex;
+ justify-content:space-between;
+ margin:5px
}
#signature-info-wrapper {
@@ -103,13 +63,11 @@ textarea {
justify-content:center
}
-#signature-info-wrapper input,
-#signature-info-wrapper [aria-role="textbox"],
-#signature-info-wrapper textarea,
-#signature-info-wrapper select,
-#current-date {
+#signature-info-wrapper input,#signature-info-wrapper [aria-role="textbox"],#signature-info-wrapper textarea,#signature-info-wrapper select,#current-date {
background:unset;
border-bottom:1px dotted #000;
+ flex:1 1 0;
+ min-width:0;
padding:12px
}
@@ -121,55 +79,21 @@ textarea {
max-width:600px
}
-#signature-bottom {
- align-items:flex-end;
- display:flex;
- justify-content:space-between;
- margin:5px
-}
-
-#intro-text {
- border-bottom:1px solid #000;
- font-size:large;
- margin-bottom:14px;
- padding-bottom:14px
-}
-
-#form-wrapper {
- display:flex;
- flex-direction:column;
- gap:14px;
- max-width:750px;
+#step1,#step2,#step3,#canvas-wrapper {
margin-left:auto;
margin-right:auto;
- padding-bottom:20px
-}
-
-#address-autocomplete {
- position:relative;
- text-align:center
-}
-
-#show-document {
- display:block;
- margin-bottom:17.5px
+ max-width:1000px;
+ padding-top:40px
}
-#canvas-wrapper {
+#step2 {
display:none;
- object-fit:contain;
-}
-
-#step3 {
- display:none
-}
-
-#canvas-wrapper canvas {
- width:100%;
+ text-align:center
}
-#finish,#download-pdf {
- margin-top:20px
+.button-small {
+ font-size:small;
+ padding:4px 7px
}
.input-group {
@@ -180,7 +104,7 @@ textarea {
}
.input-group input {
- flex:1 1 0px;
+ flex:1 1 0;
min-width:0
}
@@ -189,16 +113,84 @@ textarea {
}
.input-single-with-label {
+ align-items:center;
display:flex;
- gap:14px;
- align-items:center
+ gap:14px
}
.input-single-with-label input {
- flex:1 1 0px
+ flex:1 1 0
}
-.button-small {
- font-size:small;
- padding:4px 7px
+a,a:hover,a:visited {
+ color:#000
+}
+
+body {
+ background:#000;
+ font-family:"Open Sans",sans-serif
+}
+
+button,input[type="submit"],[aria-role="button"] {
+ background:#2f2f2f;
+ border:none;
+ color:#fff;
+ cursor:pointer;
+ display:inline-block;
+ font-size:unset;
+ padding:12px;
+ text-decoration:none;
+ transition:.15s
+}
+
+button:not([disabled]):hover,input[type="submit"]:not([disabled]):hover,[aria-role="button"]:not([disabled]):hover {
+ background:#333
+}
+
+button[disabled],input[type="submit"][disabled],[aria-role="button"][disabled] {
+ background:#737373;
+ cursor:unset
+}
+
+header {
+ background:#000;
+ color:#fff;
+ display:flex;
+ height:70px;
+ justify-content:center;
+ padding:10px
+}
+
+html,body {
+ margin:0;
+ padding:0
+}
+
+input,[aria-role="textbox"],textarea,select {
+ background:#dddcdc;
+ border:0;
+ font-family:"Open Sans",sans-serif;
+ font-size:medium;
+ padding:10px
+}
+
+main {
+ background:#fff;
+ border-top-left-radius:40px;
+ border-top-right-radius:40px;
+ min-height:calc(100vh - 90px)
+}
+
+textarea {
+ resize:none
+}
+
+@media screen and (max-width:1200px) {
+ #step1,#step2,#step3,#canvas-wrapper {
+ padding-top:0
+ }
+
+ main {
+ padding:20px
+ }
}