From 12603d81696ca0a905262d03fed2a034b4938eae Mon Sep 17 00:00:00 2001
From: "fanky.eu" <jakub.webisti@gmail.com>
Date: Wed, 28 Apr 2021 22:21:22 +0200
Subject: [PATCH] contrasts update throughout web, incomplete program point
detail, menu black, hide switch map mobile
---
.../article-card-pirati-stan.mustache | 2 +-
.../banner-bookmark-compressed.mustache | 4 +-
.../06-banner/banner-bookmark.mustache | 4 +-
.../25-problems/problems-pirati-stan.mustache | 2 +-
.../00-global/footer-pirati-stan.mustache | 18 +--
...ate-table-collapsible-pirati-stan.mustache | 2 +-
.../01-navbar/navbar-pirati-stan.mustache | 13 +-
.../03-hero/hero-pirati-stan.mustache | 5 +
.../strategic-documents-list.mustache | 4 +-
.../homepage-pirati-stan.mustache | 4 +-
.../article-detail-pirati-stan.mustache | 2 +-
...tegic-document-detail-pirati-stan.mustache | 2 +-
...gic-documents-listing-pirati-stan.mustache | 4 +-
...andidate-detail-no-bg-pirati-stan.mustache | 2 +-
.../candidate-detail-pirati-stan.mustache | 2 +-
...didate-detail-socials-pirati-stan.mustache | 2 +-
...candidate-listing-map-pirati-stan.mustache | 2 +-
.../candidate-listing-pirati-stan.mustache | 2 +-
.../detail-program-pirati-stan.mustache | 121 +++++++++++++++++-
...tions-program-listing-pirati-stan.mustache | 2 +-
source/css/atoms/form-field-pirati-stan.pcss | 14 +-
.../molecules/article-card-pirati-stan.pcss | 4 +-
source/css/molecules/switch.pcss | 8 +-
source/css/organisms/navbar-pirati-stan.pcss | 12 +-
.../css/organisms/region-map-pirati-stan.pcss | 3 -
source/css/style.pcss | 8 +-
.../js/components/RegionMap-pirati-stan.vue | 2 +-
tailwind.config.js | 2 +
28 files changed, 198 insertions(+), 54 deletions(-)
diff --git a/source/_patterns/01-molecules/04-article-card/article-card-pirati-stan.mustache b/source/_patterns/01-molecules/04-article-card/article-card-pirati-stan.mustache
index f558215..15f7a96 100644
--- a/source/_patterns/01-molecules/04-article-card/article-card-pirati-stan.mustache
+++ b/source/_patterns/01-molecules/04-article-card/article-card-pirati-stan.mustache
@@ -1,7 +1,7 @@
<article class="card card--hoveractive article-card article-card-pirati-stan {{ classes }}">
<div class="article-card-cover">
{{# articleLabel }}
- <div class="absolute text-white head-alt-sm bg-acidgreen px-6 pb-3 pt-4 -left-2 top-4">
+ <div class="absolute text-black head-alt-sm bg-acidgreen px-6 pb-3 pt-4 -left-2 top-4">
{{ articleLabel }}
</div>
{{/ articleLabel }}
diff --git a/source/_patterns/01-molecules/06-banner/banner-bookmark-compressed.mustache b/source/_patterns/01-molecules/06-banner/banner-bookmark-compressed.mustache
index def335e..0bb7cc1 100644
--- a/source/_patterns/01-molecules/06-banner/banner-bookmark-compressed.mustache
+++ b/source/_patterns/01-molecules/06-banner/banner-bookmark-compressed.mustache
@@ -1,11 +1,11 @@
<aside class="banner flex-column sm:flex-row px-0 {{ classes }}">
<div class="bg-acidgreen text-white w-14 h-14 flex items-center justify-center">
- <i class="text-3xl {{ icon }}"></i>
+ <i class="text-3xl text-black {{ icon }}"></i>
</div>
<div class="bg-lemon banner__body p-4 px-8 py-8 flex-grow">
<h1 class="{{ headClasses }}{{^ headClasses }}head-alt-md sm:head-alt-lg{{/ headClasses }} banner__cta mt-0 mb-2">{{ cta }}</h1>
<div class="space-x-4 flex">
- {{> atoms-icon-button(icon: "ico--chevron-right", classes: "text-lg btn--hoveractive", bodyClasses: "bg-acidgreen hover:bg-black py-4 leading-5", iconClasses: "bg-black border-grey-500" )}}
+ {{> atoms-icon-button(icon: "ico--chevron-right", classes: "text-lg btn--hoveractive", bodyClasses: "bg-acidgreen text-black hover:bg-black hover:text-white py-4 leading-5", iconClasses: "bg-black border-grey-500" )}}
{{# secondCta }}
{{> atoms-icon-button(icon: "ico--chevron-right", classes: "text-lg border border-black border-solid btn--hoveractive", bodyClasses: "bg-transparent text-black", iconClasses: "bg-transparent border-black border-opacity-20 text-black" )}}
{{/ secondCta }}
diff --git a/source/_patterns/01-molecules/06-banner/banner-bookmark.mustache b/source/_patterns/01-molecules/06-banner/banner-bookmark.mustache
index 173eee1..023219a 100644
--- a/source/_patterns/01-molecules/06-banner/banner-bookmark.mustache
+++ b/source/_patterns/01-molecules/06-banner/banner-bookmark.mustache
@@ -1,11 +1,11 @@
<aside class="banner flex-column sm:flex-row {{ classes }}">
<div class="bg-acidgreen text-white w-32 h-32 flex items-center justify-center">
- <i class="text-5xl {{ icon }}"></i>
+ <i class="text-5xl text-black {{ icon }}"></i>
</div>
<div class="bg-lemon banner__body p-4 md:px-16 md:pt-16 md:pb-20 flex-grow">
<h1 class="{{ headClasses }}{{^ headClasses }}head-alt-lg{{/ headClasses }} banner__cta mt-0 mb-14">{{ cta }}</h1>
<div class="space-x-4 flex">
- {{> atoms-icon-button(icon: "ico--chevron-right", classes: "text-lg btn--hoveractive", bodyClasses: "py-8 leading-4", iconClasses: "px-8 bg-grey-800 border-grey-500" )}}
+ {{> atoms-icon-button(icon: "ico--chevron-right", classes: "text-lg btn--hoveractive", bodyClasses: "py-8 leading-4 hover:bg-black hover:text-white", iconClasses: "px-8 bg-grey-800 border-grey-500" )}}
{{# secondCta }}
{{> atoms-icon-button(icon: "ico--chevron-right", classes: "text-lg border border-black border-solid btn--hoveractive", bodyClasses: "py-8 leading-4 bg-transparent text-black", iconClasses: "px-8 bg-transparent border-black border-opacity-20 text-black" )}}
{{/ secondCta }}
diff --git a/source/_patterns/01-molecules/25-problems/problems-pirati-stan.mustache b/source/_patterns/01-molecules/25-problems/problems-pirati-stan.mustache
index bfa297a..dabffb5 100644
--- a/source/_patterns/01-molecules/25-problems/problems-pirati-stan.mustache
+++ b/source/_patterns/01-molecules/25-problems/problems-pirati-stan.mustache
@@ -5,7 +5,7 @@
<p class="text-base mb-8">Dezinformování je taktika šmejdů 21. století. Cíleně mísí pravdu s konspiracemi, šíří chaos a nenávist, ohrožují svobodu, [2] ústavní pořádek a mezinárodní závazky ČR.[3] Dezinformace zasáhly alespoň jednou v životě více než polovinu Čechů.[4]</p>
{{> atoms-accordeon-row-preview }}
</div>
- <div class="ideal-check"><i class="ico--check text-xs sm:text-xl text-white"></i></div>
+ <div class="ideal-check"><i class="ico--check text-xs sm:text-xl text-black"></i></div>
<div class="ideal-inner bg-lemon content-block">
<h2 class="head-alt-sm md:head-alt-md mb-9">Ideál</h2>
<p class="text-base">Dezinformování je taktika šmejdů 21. století. Cíleně mísí pravdu s konspiracemi, šíří chaos a nenávist, ohrožují svobodu, [2] ústavní pořádek a mezinárodní závazky ČR.[3] Dezinformace zasáhly alespoň jednou v životě více než polovinu Čechů.[4]</p>
diff --git a/source/_patterns/02-organisms/00-global/footer-pirati-stan.mustache b/source/_patterns/02-organisms/00-global/footer-pirati-stan.mustache
index 45221b8..30d9590 100644
--- a/source/_patterns/02-organisms/00-global/footer-pirati-stan.mustache
+++ b/source/_patterns/02-organisms/00-global/footer-pirati-stan.mustache
@@ -8,7 +8,7 @@
alt="Piráti a Starostové"
class="w-32 mb-6 pr-8 border-r border-grey-400 border-solid"
/>
- <p class="para hidden md:block md:mb-4 lg:mb-0 text-grey-200">
+ <p class="para hidden md:block md:mb-4 lg:mb-0 text-grey-50">
Piráti, 2020. Všechna práva vyhlazena. Sdílejte a nechte
ostatní sdílet za stejných podmínek.
</p>
@@ -16,7 +16,7 @@
<section class="footer__main-links text-white lg:grid lg:grid-cols-3 2xl:grid-cols-4 gap-4">
<div class="pt-8 pb-4 lg:py-0">
<ui-footer-collapsible label="Odkazy">
- <ul class="mt-4 md:mt-6 space-y-2 text-grey-200">
+ <ul class="mt-4 md:mt-6 space-y-2 text-grey-50">
<li>
<a href="#">Aktality</a>
</li>
@@ -35,7 +35,7 @@
<div class="py-4 lg:py-0 border-t border-grey-400 lg:border-t-0 2xl:col-span-2">
<ui-footer-collapsible label="Připoj se">
<div class="2xl:space-x-3">
- <ul class="mt-6 space-y-2 text-grey-200 block 2xl:inline-block">
+ <ul class="mt-6 space-y-2 text-grey-50 block 2xl:inline-block">
<li>
{{> atoms-basic-contact-line(icon: "ico--facebook", caption: "Starostové") }}
</li>
@@ -49,7 +49,7 @@
{{> atoms-basic-contact-line(icon: "ico--youtube", caption: "Starostové a nezávislí") }}
</li>
</ul>
- <ul class="mt-6 space-y-2 text-grey-200 block 2xl:inline-block">
+ <ul class="mt-6 space-y-2 text-grey-50 block 2xl:inline-block">
<li>
{{> atoms-basic-contact-line(icon: "ico--facebook", caption: "Česká pirátská strana") }}
</li>
@@ -68,24 +68,24 @@
</div>
<div class="pt-4 lg:py-0 border-t border-grey-400 lg:border-t-0">
<ui-footer-collapsible label="Kontakt">
- <ul class="mt-6 space-y-2 text-grey-200 inline-block">
+ <ul class="mt-6 space-y-2 text-grey-50 inline-block">
<li>Informační linka:</li>
- <li class="text-grey-200"><a href="tel:00420608963111">+420 608 963 111</a></li>
- <li class="text-grey-200"><a href="mailto:info@piratiastarostove.cz">info@piratiastarostove.cz</a></li>
+ <li class="text-grey-50"><a href="tel:00420608963111">+420 608 963 111</a></li>
+ <li class="text-grey-50"><a href="mailto:info@piratiastarostove.cz">info@piratiastarostove.cz</a></li>
</ul>
</ui-footer-collapsible>
</div>
</section>
<section class="footer__social lg:text-right">
<div class="flex flex-col md:flex-row lg:flex-col lg:items-end space-y-2 md:space-y-0 md:space-x-2 lg:space-x-0 lg:space-y-2">
- {{> atoms-icon-button(cta: "Programová aplikace", icon: "ico--app", classes: "btn--hoveractive btn--autowidth lg:text-sm xl:text-base focus:outline-none", bodyClasses: "bg-acidgreen hover:bg-darkacidgreen px-4 py-4", iconClasses: "bg-darkacidgreen") }}
+ {{> atoms-icon-button(cta: "Programová aplikace", icon: "ico--app", classes: "btn--hoveractive btn--autowidth lg:text-sm xl:text-base focus:outline-none", bodyClasses: "bg-acidgreen text-black hover:bg-darkacidgreen px-4 py-4", iconClasses: "bg-darkacidgreen text-black") }}
</div>
</section>
</div>
<section class="footer__sub-links">
<div class="container container--wide">
<div class="flex flex-col lg:flex-row lg:space-x-4 lg:items-center pt-4 pb-8 lg:pt-8 border-t border-grey-400 lg:border-t-0" slotWrapperclass="lg:w-2/4">
- <ul class="lg:w-full lg:pr-8 items-center mt-6 space-y-2 lg:mt-0 lg:space-y-0 md:space-x-4 text-grey-200">
+ <ul class="lg:w-full lg:pr-8 items-center mt-6 space-y-2 lg:mt-0 lg:space-y-0 md:space-x-4 text-grey-50">
<li class="block md:inline-block">
{{> atoms-basic-contact-line(icon: "ico--home", caption: "pirati.cz") }}
</li>
diff --git a/source/_patterns/02-organisms/01-candidates/candidate-table-collapsible-pirati-stan.mustache b/source/_patterns/02-organisms/01-candidates/candidate-table-collapsible-pirati-stan.mustache
index eaa2cce..0bb271d 100644
--- a/source/_patterns/02-organisms/01-candidates/candidate-table-collapsible-pirati-stan.mustache
+++ b/source/_patterns/02-organisms/01-candidates/candidate-table-collapsible-pirati-stan.mustache
@@ -17,7 +17,7 @@
</div>
</div>
<div class="pt-11 text-center">
- {{> atoms-icon-button(icon: "ico--chevron-right", classes: "showfulltable text-xl btn--hoveractive btn--to-black", bodyClasses: "py-4 px-11 leading-5 bg-acidgreen" ) }}
+ {{> atoms-icon-button(icon: "ico--chevron-right", classes: "showfulltable text-xl btn--hoveractive btn--to-black", bodyClasses: "py-4 px-11 leading-5 bg-acidgreen text-black hover:text-white" ) }}
</div>
<script>
//collapse toggle
diff --git a/source/_patterns/02-organisms/01-navbar/navbar-pirati-stan.mustache b/source/_patterns/02-organisms/01-navbar/navbar-pirati-stan.mustache
index 921cd5e..dc661c8 100644
--- a/source/_patterns/02-organisms/01-navbar/navbar-pirati-stan.mustache
+++ b/source/_patterns/02-organisms/01-navbar/navbar-pirati-stan.mustache
@@ -19,9 +19,9 @@
</a>
</div>
<div v-if="show || isLgScreenSize" class="navbar__external navbar__section navbar__section--expandable container-padding--zero lg:container-padding--auto lg:flex lg:space-x-8 lg:pb-2">
- <div class="text-grey-200 text-sm lg:space-x-8 leading-loose lg:leading-normal">
- {{> atoms-basic-contact-line(caption: "pirati.cz", href: "https://www.pirati.cz", icon: "ico--home", classes: "block lg:inline-block opacity-60 hover:opacity-90", targetBlank: true) }}
- {{> atoms-basic-contact-line(caption: "starostove-nezavisli.cz", href: "https://www.starostove-nezavisli.cz", icon: "ico--home", classes: "block lg:inline-block opacity-60 hover:opacity-90", targetBlank: true) }}
+ <div class="text-sm lg:space-x-8 leading-loose lg:leading-normal">
+ {{> atoms-basic-contact-line(caption: "pirati.cz", href: "https://www.pirati.cz", icon: "ico--home", classes: "block lg:inline-block", targetBlank: true) }}
+ {{> atoms-basic-contact-line(caption: "starostove-nezavisli.cz", href: "https://www.starostove-nezavisli.cz", icon: "ico--home", classes: "block lg:inline-block", targetBlank: true) }}
</div>
</div>
<div v-if="show || isLgScreenSize" class="navbar__main navbar__section navbar__section--expandable container-padding--zero lg:container-padding--auto">
@@ -29,7 +29,10 @@
<li class="navbar-menu__item">
<a href="#" data-href="{{ link.templates-article-listing-pirati-stan }}" class="navbar-menu__link">Aktuality</a>
</li>
- <li class="navbar-menu__item">
+ <li class="navbar-menu__item md:hidden">
+ <a href="#" data-href="{{ link.templates-candidate-listing-pirati-stan }}" class="navbar-menu__link">Kandidáti</a>
+ </li>
+ <li class="navbar-menu__item hidden md:inline-block">
<ui-navbar-subitem label="Kandidáti" href="{{ link.templates-candidate-listing-pirati-stan }}">
<ul class="navbar-menu__submenu">
<li><a href="#" data-href="{{ link.templates-candidate-listing-pirati-stan }}" class="navbar-menu__link">Výpis kandidátů</a></li>
@@ -46,7 +49,7 @@
</ul>
</div>
<div class="navbar__actions navbar__section lg:container-padding--auto self-start flex flex-col sm:flex-row lg:flex-col sm:space-x-4 space-y-2 sm:space-y-0 lg:space-y-2 xl:flex-row xl:space-x-2 xl:space-y-0 h-full justify-center">
- {{> atoms-icon-button(cta: "Programová aplikace", icon: "ico--app", classes: "btn--hoveractive btn--autowidth lg:text-sm xl:text-base focus:outline-none", bodyClasses: "bg-acidgreen hover:bg-darkacidgreen px-1 sm:px-4 py-2 sm:py-4", iconClasses: "bg-darkacidgreen") }}
+ {{> atoms-icon-button(cta: "Programová aplikace", icon: "ico--app", classes: "btn--hoveractive btn--autowidth lg:text-sm xl:text-base focus:outline-none", bodyClasses: "bg-acidgreen text-black hover:bg-darkacidgreen px-1 sm:px-4 py-2 sm:py-4", iconClasses: "bg-darkacidgreen text-black") }}
</div>
</div>
</div>
diff --git a/source/_patterns/02-organisms/03-hero/hero-pirati-stan.mustache b/source/_patterns/02-organisms/03-hero/hero-pirati-stan.mustache
index 07a1377..cbc546e 100644
--- a/source/_patterns/02-organisms/03-hero/hero-pirati-stan.mustache
+++ b/source/_patterns/02-organisms/03-hero/hero-pirati-stan.mustache
@@ -20,6 +20,11 @@
{{> molecules-binary-switch }}
</div>
{{/ showSwitch }}
+ {{# showSwitchDesktopOnly }}
+ <div class="hidden md:block pt-8">
+ {{> molecules-binary-switch }}
+ </div>
+ {{/ showSwitchDesktopOnly }}
</div>
{{/ simpleHero}}
<div class="hidden lg:block lg:row-span-2 lg:col-span-3 order-2 h-full 2xl:absolute 2xl:right-0 2xl:w-1/3">
diff --git a/source/_patterns/02-organisms/12-strategic-documents/strategic-documents-list.mustache b/source/_patterns/02-organisms/12-strategic-documents/strategic-documents-list.mustache
index 2a07370..c5d61e2 100644
--- a/source/_patterns/02-organisms/12-strategic-documents/strategic-documents-list.mustache
+++ b/source/_patterns/02-organisms/12-strategic-documents/strategic-documents-list.mustache
@@ -1,11 +1,11 @@
<div class="article-card-list grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 lg:gap-8">
{{> atoms-colored-card(cardColor: "white", classes: "border-b border-solid border-grey-125 card--min-square card--hoveractive", bodyClasses: "p-4", title: "Otevřenost a zapojení občanů" )}}
- {{> atoms-colored-card(cardColor: "acidgreen", classes: "border-b border-solid border-acidgreen card--min-square text-white card--hoveractive", bodyClasses: "p-4", title: "Smart city" )}}
+ {{> atoms-colored-card(cardColor: "acidgreen", classes: "border-b border-solid border-acidgreen card--min-square text-black card--hoveractive", bodyClasses: "p-4", title: "Smart city" )}}
{{> atoms-colored-card(cardColor: "lemon", classes: "border-b border-solid border-lemon card--min-square card--hoveractive", bodyClasses: "p-4", title: "Smart city" )}}
{{^ onlyThree }}
{{> atoms-colored-card(cardColor: "black", classes: "border-b border-solid border-black card--min-square text-white card--hoveractive", bodyClasses: "p-4", title: "Smart city" )}}
{{> atoms-colored-card(cardColor: "white", classes: "border-b border-solid border-grey-125 card--min-square card--hoveractive", bodyClasses: "p-4", title: "Otevřenost a zapojení občanů" )}}
- {{> atoms-colored-card(cardColor: "acidgreen", classes: "border-b border-solid border-acidgreen card--min-square text-white border-card--hoveractive", bodyClasses: "p-4", title: "Smart city" )}}
+ {{> atoms-colored-card(cardColor: "acidgreen", classes: "border-b border-solid border-acidgreen card--min-square text-black border-card--hoveractive", bodyClasses: "p-4", title: "Smart city" )}}
{{> atoms-colored-card(cardColor: "lemon", classes: "border-b border-solid border-lemon card--min-square card--hoveractive", bodyClasses: "p-4", title: "Smart city" )}}
{{> atoms-colored-card(cardColor: "black", classes: "border-b border-solid border-black card--min-square text-white card--hoveractive", bodyClasses: "p-4", title: "Smart city" )}}
{{/ onlyThree }}
diff --git a/source/_patterns/03-templates/coalition-HP-and-other/homepage-pirati-stan.mustache b/source/_patterns/03-templates/coalition-HP-and-other/homepage-pirati-stan.mustache
index 4e2ec09..0a73ccd 100644
--- a/source/_patterns/03-templates/coalition-HP-and-other/homepage-pirati-stan.mustache
+++ b/source/_patterns/03-templates/coalition-HP-and-other/homepage-pirati-stan.mustache
@@ -7,7 +7,7 @@
{{> organisms-article-card-list-pirati-stan(onlyThree: true) }}
<nav class="text-center">
- {{> atoms-icon-button(cta: "Zobrazit vše", icon: "ico--chevron-right", classes: "text-xl pt-8", bodyClasses: "bg-acidgreen") }}
+ {{> atoms-icon-button(cta: "Zobrazit vše", icon: "ico--chevron-right", classes: "text-xl pt-8 btn--hoveractive", bodyClasses: "bg-acidgreen text-black hover:bg-black hover:text-white") }}
</nav>
</section>
@@ -32,7 +32,7 @@
<section>
<h1 class="head-alt-md pb-4 lg:pb-8 mt-10 md:mt-24">FAQ</h1>
{{> molecules-accordeon }}
- {{> atoms-icon-button(cta: "Zobrazit vše", icon: "ico--chevron-right", bodyClasses: "bg-acidgreen px-12", classes: "text-xl pt-16") }}
+ {{> atoms-icon-button(cta: "Zobrazit vše", icon: "ico--chevron-right", bodyClasses: "bg-acidgreen text-black px-12 hover:bg-black hover:text-white", classes: "text-xl pt-16 btn--hoveractive") }}
</section>
<section class="my-16 lg:my-20 container-padding--zero lg:container-padding--auto">
diff --git a/source/_patterns/03-templates/coalition-articles/article-detail-pirati-stan.mustache b/source/_patterns/03-templates/coalition-articles/article-detail-pirati-stan.mustache
index 90c0186..6cbd360 100644
--- a/source/_patterns/03-templates/coalition-articles/article-detail-pirati-stan.mustache
+++ b/source/_patterns/03-templates/coalition-articles/article-detail-pirati-stan.mustache
@@ -32,7 +32,7 @@
<h1 class="head-alt-base md:head-alt-md pb-4 pt-1">Další podobné články</h1>
{{> organisms-article-card-list-pirati-stan(onlyThree: true) }}
<div class="text-center mt-8 md:mt-16">
- {{> atoms-icon-button(icon: "ico--chevron-right", classes: "showfulltable text-xl btn--hoveractive btn--to-black", bodyClasses: "py-4 px-11 leading-5 bg-acidgreen" ) }}
+ {{> atoms-icon-button(icon: "ico--chevron-right", classes: "showfulltable text-xl btn--hoveractive btn--to-black", bodyClasses: "py-4 px-11 leading-5 bg-acidgreen text-black") }}
</div>
</section>
diff --git a/source/_patterns/03-templates/coalition-articles/strategic-document-detail-pirati-stan.mustache b/source/_patterns/03-templates/coalition-articles/strategic-document-detail-pirati-stan.mustache
index b24fb72..5ea7fbe 100644
--- a/source/_patterns/03-templates/coalition-articles/strategic-document-detail-pirati-stan.mustache
+++ b/source/_patterns/03-templates/coalition-articles/strategic-document-detail-pirati-stan.mustache
@@ -21,7 +21,7 @@
<h1 class="head-alt-base md:head-alt-md pb-4 pt-1">Další podobné strategické dokumenty</h1>
{{> organisms-strategic-documents-list(onlyThree: true) }}
<div class="text-center mt-8 md:mt-16">
- {{> atoms-icon-button(icon: "ico--chevron-right", cta: "Zobrazit vše", classes: "showfulltable text-xl btn--hoveractive btn--to-black", bodyClasses: "py-4 px-11 leading-5 bg-acidgreen" ) }}
+ {{> atoms-icon-button(icon: "ico--chevron-right", cta: "Zobrazit vše", classes: "showfulltable text-xl btn--hoveractive btn--to-black", bodyClasses: "py-4 px-11 leading-5 bg-acidgreen text-black hover:text-white" ) }}
</div>
</section>
diff --git a/source/_patterns/03-templates/coalition-articles/strategic-documents-listing-pirati-stan.mustache b/source/_patterns/03-templates/coalition-articles/strategic-documents-listing-pirati-stan.mustache
index c97b17f..1f905ac 100644
--- a/source/_patterns/03-templates/coalition-articles/strategic-documents-listing-pirati-stan.mustache
+++ b/source/_patterns/03-templates/coalition-articles/strategic-documents-listing-pirati-stan.mustache
@@ -6,11 +6,11 @@
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
{{> atoms-colored-card(cardColor: "white", classes: "border-b border-solid border-grey-125 card--min-square card--hoveractive", bodyClasses: "p-4", title: "Otevřenost a zapojení občanů" )}}
- {{> atoms-colored-card(cardColor: "acidgreen", classes: "border-b border-solid border-acidgreen card--min-square text-white card--hoveractive", bodyClasses: "p-4", title: "Smart city" )}}
+ {{> atoms-colored-card(cardColor: "acidgreen", classes: "border-b border-solid border-acidgreen card--min-square text-black card--hoveractive", bodyClasses: "p-4", title: "Smart city" )}}
{{> atoms-colored-card(cardColor: "lemon", classes: "border-b border-solid border-lemon card--min-square card--hoveractive", bodyClasses: "p-4", title: "Smart city" )}}
{{> atoms-colored-card(cardColor: "black", classes: "border-b border-solid border-black card--min-square text-white card--hoveractive", bodyClasses: "p-4", title: "Smart city" )}}
{{> atoms-colored-card(cardColor: "white", classes: "border-b border-solid border-grey-125 card--min-square card--hoveractive", bodyClasses: "p-4", title: "Otevřenost a zapojení občanů" )}}
- {{> atoms-colored-card(cardColor: "acidgreen", classes: "border-b border-solid border-acidgreen card--min-square text-white border-card--hoveractive", bodyClasses: "p-4", title: "Smart city" )}}
+ {{> atoms-colored-card(cardColor: "acidgreen", classes: "border-b border-solid border-acidgreen card--min-square text-black border-card--hoveractive", bodyClasses: "p-4", title: "Smart city" )}}
{{> atoms-colored-card(cardColor: "lemon", classes: "border-b border-solid border-lemon card--min-square card--hoveractive", bodyClasses: "p-4", title: "Smart city" )}}
{{> atoms-colored-card(cardColor: "black", classes: "border-b border-solid border-black card--min-square text-white card--hoveractive", bodyClasses: "p-4", title: "Smart city" )}}
</div>
diff --git a/source/_patterns/03-templates/coalition-candidates/candidate-detail-no-bg-pirati-stan.mustache b/source/_patterns/03-templates/coalition-candidates/candidate-detail-no-bg-pirati-stan.mustache
index b7bc333..ec63ccb 100644
--- a/source/_patterns/03-templates/coalition-candidates/candidate-detail-no-bg-pirati-stan.mustache
+++ b/source/_patterns/03-templates/coalition-candidates/candidate-detail-no-bg-pirati-stan.mustache
@@ -2,7 +2,7 @@
<article class="hero hero--image pt-24 pb-20 lg:pt-28 pb-10 candidate-detail__hero {{ classes }}">
<div class="container container--default text-center lg:text-left">
- {{> atoms-button(classes: "text-sm btn--hoveractive btn--to-black", bodyClasses: "leading-5 bg-acidgreen px-10 py-3" ) }}
+ {{> atoms-button(classes: "text-sm btn--hoveractive btn--to-black", bodyClasses: "leading-5 bg-acidgreen text-black hover:text-white px-10 py-3" ) }}
<h1 class="head-alt-md md:head-alt-xl mt-9 text-black">{{ person.first }} {{ person.last }}</h1>
</div>
</article>
diff --git a/source/_patterns/03-templates/coalition-candidates/candidate-detail-pirati-stan.mustache b/source/_patterns/03-templates/coalition-candidates/candidate-detail-pirati-stan.mustache
index 9953d00..866eeb6 100644
--- a/source/_patterns/03-templates/coalition-candidates/candidate-detail-pirati-stan.mustache
+++ b/source/_patterns/03-templates/coalition-candidates/candidate-detail-pirati-stan.mustache
@@ -2,7 +2,7 @@
<article class="hero hero--image pt-24 pb-20 lg:pt-28 pb-10 candidate-detail__hero {{ classes }}" style="--image-url: url({{ img.landscape-16x9-fullhd.src }})">
<div class="container container--default text-center lg:text-left">
- {{> atoms-button(classes: "text-sm btn--hoveractive btn--to-black", bodyClasses: "leading-5 bg-acidgreen px-10 py-3" ) }}
+ {{> atoms-button(classes: "text-sm btn--hoveractive btn--to-black", bodyClasses: "leading-5 bg-acidgreen text-black hover:text-white px-10 py-3" ) }}
<h1 class="head-alt-md md:head-alt-xl mt-9">{{ person.first }} {{ person.last }}</h1>
</div>
</article>
diff --git a/source/_patterns/03-templates/coalition-candidates/candidate-detail-socials-pirati-stan.mustache b/source/_patterns/03-templates/coalition-candidates/candidate-detail-socials-pirati-stan.mustache
index 7a20014..6ea1710 100644
--- a/source/_patterns/03-templates/coalition-candidates/candidate-detail-socials-pirati-stan.mustache
+++ b/source/_patterns/03-templates/coalition-candidates/candidate-detail-socials-pirati-stan.mustache
@@ -2,7 +2,7 @@
<article class="hero hero--image pt-24 pb-20 lg:pt-28 pb-10 candidate-detail__hero {{ classes }}" style="--image-url: url({{ img.landscape-16x9-fullhd.src }})">
<div class="container container--default text-center lg:text-left">
- {{> atoms-button(classes: "text-sm btn--hoveractive btn--to-black", bodyClasses: "leading-5 bg-acidgreen px-10 py-3" ) }}
+ {{> atoms-button(classes: "text-sm btn--hoveractive btn--to-black", bodyClasses: "leading-5 bg-acidgreen text-black hover:text-white px-10 py-3" ) }}
<h1 class="head-alt-md md:head-alt-xl mt-9">{{ person.first }} {{ person.last }}</h1>
</div>
</article>
diff --git a/source/_patterns/03-templates/coalition-candidates/candidate-listing-map-pirati-stan.mustache b/source/_patterns/03-templates/coalition-candidates/candidate-listing-map-pirati-stan.mustache
index 468d8a6..9621fa3 100644
--- a/source/_patterns/03-templates/coalition-candidates/candidate-listing-map-pirati-stan.mustache
+++ b/source/_patterns/03-templates/coalition-candidates/candidate-listing-map-pirati-stan.mustache
@@ -1,6 +1,6 @@
{{> organisms-navbar-pirati-stan }}
-{{> organisms-hero-pirati-stan(showSwitch: true) }}
+{{> organisms-hero-pirati-stan(showSwitchDesktopOnly: true) }}
<main>
{{> organisms-candidate-map-pirati-stan }}
diff --git a/source/_patterns/03-templates/coalition-candidates/candidate-listing-pirati-stan.mustache b/source/_patterns/03-templates/coalition-candidates/candidate-listing-pirati-stan.mustache
index e8fa204..1507ebd 100644
--- a/source/_patterns/03-templates/coalition-candidates/candidate-listing-pirati-stan.mustache
+++ b/source/_patterns/03-templates/coalition-candidates/candidate-listing-pirati-stan.mustache
@@ -1,6 +1,6 @@
{{> organisms-navbar-pirati-stan }}
-{{> organisms-hero-pirati-stan(showSwitch: true) }}
+{{> organisms-hero-pirati-stan(showSwitchDesktopOnly: true) }}
<div class="container container--default py-8 lg:py-24">
<section class="text-center relative">
<h1 class="head-alt-md pt-1 mb-8">Výpis kandidátů</h1>
diff --git a/source/_patterns/03-templates/coalition-program-points/detail-program-pirati-stan.mustache b/source/_patterns/03-templates/coalition-program-points/detail-program-pirati-stan.mustache
index d2c1263..7120302 100644
--- a/source/_patterns/03-templates/coalition-program-points/detail-program-pirati-stan.mustache
+++ b/source/_patterns/03-templates/coalition-program-points/detail-program-pirati-stan.mustache
@@ -1,18 +1,131 @@
-<div class="program-detail container container--default py-8">
+{{> organisms-navbar-pirati-stan }}
+<div class="program-detail container container--default pt-8">
{{> molecules-floating-nav-pirati-stan}}
<header class="w-full md:w-1/2">
<h1 class="head-alt-md md:head-alt-lg head-alt-highlighted">konstruktivní boj <br>proti dezinformacím</h1>
- <h2 class="head-alt-sm md:head-alt-md mb-20 mt-9">Dezinformacím věří až čtvrtina občanů České republiky. Prosadíme větší osvětu a reálnou právní odpovědnost dezinformátorů.</h2>
+ <h2 class="head-alt-sm md:head-alt-md mb-20 mt-9"><div class="leading-tight">Dezinformacím věří až čtvrtina občanů České republiky. Prosadíme větší osvětu a reálnou právní odpovědnost dezinformátorů.</div></h2>
</header>
+</div>
+<div class="program-detail container container-padding--zero pr-0 md:container-padding--auto md:mx-auto md:pr-4 container--default">
<div class="w-full md:w-4/6 problem-pack">
{{> molecules-problems-pirati-stan}}
</div>
+</div>
+<div class="program-detail container container--default pb-8">
+
+
+
+
+
+
+ <div class="w-full md:w-4/6">
+
+
+
+
+
+
+
+ <h3 class="head-alt-base mb-8">Navrhovaná opatření:</h3>
+
+ {{> atoms-unordered-list-checks-pirati-stan(label: "Profesní vzdělávání učitelů a ředitelů:")}}
+
+ {{> atoms-unordered-list-checks-pirati-stan}}
+
+ {{> atoms-unordered-list-checks-pirati-stan}}
+
+ <div class="grid grid-cols-1 gap-8 mt-20">
+
+
+ {{> organisms-countdown-small-pirati-stan }}
+
+ {{> atoms-colored-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Časový horizont:" )}}
+
+
+ </div>
+
+ <h3 class="head-alt-base mb-4">Časový horizont v krocích:</h3>
+
+
+ {{> atoms-figure(caption: "Popisek fotky") }}
+
+
<h3 class="head-alt-base mb-4">BENEFITY</h3>
- <div class="program-detail-benefity w-full md:w-4/6">
+ <div class="program-detail-benefity">
{{> molecules-benefits-pirati-stan}}
{{> molecules-benefits-pirati-stan}}
{{> molecules-benefits-pirati-stan}}
{{> molecules-benefits-pirati-stan}}
</div>
-</div>
\ No newline at end of file
+ <h3 class="head-alt-base mb-4">BENEFITY</h3>
+ <div class="article-card-list grid grid-cols-1 sm:grid-cols-2 gap-4 lg:gap-8">
+ {{> molecules-article-card-pirati-stan(classes: "emphasized-acidgreen") }}
+ {{> molecules-article-card-pirati-stan(classes: "emphasized-acidgreen") }}
+ {{> molecules-article-card-pirati-stan(classes: "emphasized-acidgreen") }}
+ {{> molecules-article-card-pirati-stan(classes: "emphasized-acidgreen") }}
+ {{> molecules-article-card-pirati-stan(classes: "emphasized-acidgreen") }}
+ {{> molecules-article-card-pirati-stan(classes: "emphasized-acidgreen") }}
+ </div>
+
+
+
+
+
+
+
+
+ <h3 class="head-alt-base mb-4">V dlouhodobém horizontu přinese kriticky smýšlející společnost snížení nákladů, které jsou následkem dezinformací (soudy, veřejné zdraví).</h3>
+
+
+ <h3 class="head-alt-base mb-4">Co už jsme udělali:</h3>
+
+ <h4 class="mb-4">Profesní vzdělávání učitelů a ředitelů:</h4>
+ {{> atoms-unordered-list-checks-pirati-stan}}
+
+ <h4 class="mb-4">Profesní vzdělávání učitelů a ředitelů:</h4>
+ {{> atoms-unordered-list-checks-pirati-stan}}
+
+
+ <h3 class="head-alt-base mb-4">FAQ</h3>
+ {{> molecules-accordeon }}
+
+ <h3 class="head-alt-base mb-4">Související body:</h3>
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
+ {{> atoms-colored-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Otevřenost a zapojení občanů" )}}
+ {{> atoms-colored-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Smart city" )}}
+ {{> atoms-colored-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Řízení a organizační struktura města" )}}
+ {{> atoms-colored-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Rozvoj města a bydlení" )}}
+ {{> atoms-colored-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Doprava" )}}
+ {{> atoms-colored-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Veřejný prostor a zeleň" )}}
+ {{> atoms-colored-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Vzdělávání" )}}
+ {{> atoms-colored-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Kultura a volný čas" )}}
+ </div>
+
+ <h3 class="head-alt-base mb-4">paging bodů</h3>
+
+ <h3 class="head-alt-base mb-4">Zdroje:</h3>
+
+ <h3 class="head-alt-base mb-4">Které části jsou závazné</h3>
+ </div>
+</div>
+
+
+{{> organisms-footer-pirati-stan }}
+<script>
+/*copied from molecules/accordeon-preview.mustache.*/
+/*should run once on any page accordeon rows with previews are present*/
+document.addEventListener("DOMContentLoaded", setMaxHeightsPreviews);
+window.addEventListener('resize', setMaxHeightsPreviews);
+function setMaxHeightsPreviews(){
+ // set height for css transition
+ var accordeonRowBodies = document.getElementsByClassName('accordeon-row-body--preview');
+
+ if(accordeonRowBodies !== null) {
+ for (var i = 0; i < accordeonRowBodies.length; i++) {
+ accordeonRowBodies[i].style.maxHeight=accordeonRowBodies[i].getElementsByClassName("clampedcontent")[0]
+.scrollHeight + "px";
+ };
+ }
+}
+</script>
diff --git a/source/_patterns/03-templates/coalition-program-points/elections-program-listing-pirati-stan.mustache b/source/_patterns/03-templates/coalition-program-points/elections-program-listing-pirati-stan.mustache
index ef055c0..eb38058 100644
--- a/source/_patterns/03-templates/coalition-program-points/elections-program-listing-pirati-stan.mustache
+++ b/source/_patterns/03-templates/coalition-program-points/elections-program-listing-pirati-stan.mustache
@@ -10,7 +10,7 @@
<a class="switch__item" data-chosen="celyprogram">Celý program</a>
</div>
<div class="filters">
- {{> atoms-select(wrapClasses: "inline-flex w-auto text-white", classes: "bg-black block", placeholder: "Podle resortu", selected: "Životní prostředí") }}
+ {{> atoms-select(wrapClasses: "inline-flex w-auto text-black", classes: "bg-black block", placeholder: "Podle resortu", selected: "Životní prostředí") }}
{{> atoms-select(wrapClasses: "inline-flex w-auto text-white", classes: "bg-black block", placeholder: "Podle plánu") }}
</div>
</div>
diff --git a/source/css/atoms/form-field-pirati-stan.pcss b/source/css/atoms/form-field-pirati-stan.pcss
index 61f32c2..10176b6 100644
--- a/source/css/atoms/form-field-pirati-stan.pcss
+++ b/source/css/atoms/form-field-pirati-stan.pcss
@@ -1,6 +1,18 @@
+.select__control {
+
+ &:active,
+ &:focus {
+ &:not([disabled]):not([readonly]) {
+ @apply border-black;
+ }
+ }
+
+}
+
select:not([data-chosen='']) {
background-color: theme("colors.fxactivecolor");
}
option[value=""] {
@apply hidden;
-}
\ No newline at end of file
+}
+
diff --git a/source/css/molecules/article-card-pirati-stan.pcss b/source/css/molecules/article-card-pirati-stan.pcss
index 5a5322a..6b26a7d 100644
--- a/source/css/molecules/article-card-pirati-stan.pcss
+++ b/source/css/molecules/article-card-pirati-stan.pcss
@@ -32,12 +32,12 @@
a,
.card-headline,
.card-body-text{
- @apply text-white;
+ @apply text-black;
}
}
.article-card__category-button{
.btn__body{
- @apply text-white;
+ @apply text-black;
background-color: rgba(240,240,240,0.2);
}
}
diff --git a/source/css/molecules/switch.pcss b/source/css/molecules/switch.pcss
index 1e99965..05f3374 100644
--- a/source/css/molecules/switch.pcss
+++ b/source/css/molecules/switch.pcss
@@ -9,7 +9,11 @@
@apply no-underline bg-grey-500;
}
}
-.switch__item--active,
-.switch__item--active:hover {
+.switch__item--active{
background-color: theme('colors.fxactivecolor');
+ color: theme('colors.fxtextonactivecolor');
+}
+.switch__item--active:hover {
+ background-color: theme('colors.fxactivecolorhover');
+ color: theme('colors.fxtextonactivecolor');
}
\ No newline at end of file
diff --git a/source/css/organisms/navbar-pirati-stan.pcss b/source/css/organisms/navbar-pirati-stan.pcss
index 23090da..0a45899 100644
--- a/source/css/organisms/navbar-pirati-stan.pcss
+++ b/source/css/organisms/navbar-pirati-stan.pcss
@@ -1,7 +1,15 @@
+.navbar-pirati-stan{
+ @apply bg-black;
+}
+
+.navbar-pirati-stan .navbar-menu__submenu-wrap {
+ @apply bg-grey-800;
+}
.navbar-pirati-stan .navbar-menu__link,
.navbar-pirati-stan .navbar-menu__submenu li a,
-.navbar-pirati-stan .navbar-menu__item a{
- @apply opacity-60 hover:opacity-90;
+.navbar-pirati-stan .navbar-menu__item a,
+.navbar-pirati-stan .icon-link.contact-line {
+ @apply text-grey-50;
}
.navbar-pirati-stan .navbar__content {
diff --git a/source/css/organisms/region-map-pirati-stan.pcss b/source/css/organisms/region-map-pirati-stan.pcss
index 47f1612..97ce033 100644
--- a/source/css/organisms/region-map-pirati-stan.pcss
+++ b/source/css/organisms/region-map-pirati-stan.pcss
@@ -21,7 +21,4 @@
filter:url(#dropshadow);
}
- .select::after {
- @apply text-white;
- }
}
\ No newline at end of file
diff --git a/source/css/style.pcss b/source/css/style.pcss
index 868ef3d..e55d865 100644
--- a/source/css/style.pcss
+++ b/source/css/style.pcss
@@ -92,13 +92,13 @@
@import "tailwindcss/utilities";
::-moz-selection {
- color: theme("colors.white");
- background: theme("colors.cyan.300");
+ color: theme("colors.black");
+ background: theme("colors.acidgreen");
}
::selection {
- color: theme("colors.white");
- background: theme("colors.cyan.300");
+ color: theme("colors.black");
+ background: theme("colors.fxactivecolor");
}
:root {
diff --git a/source/js/components/RegionMap-pirati-stan.vue b/source/js/components/RegionMap-pirati-stan.vue
index 08207a2..dc1039f 100644
--- a/source/js/components/RegionMap-pirati-stan.vue
+++ b/source/js/components/RegionMap-pirati-stan.vue
@@ -4,7 +4,7 @@
<div class="w-full text-center">
<div class="inline-block">
<div class="select">
- <select class="select__control form-field__control bg-acidgreen text-white" value="">
+ <select class="select__control form-field__control bg-acidgreen text-black" value="">
<option v-for="region in regions" :key="region.id" @click="selectRegion(region)" @mouseover="mouseOver(region)" @mouseout="current = null">{{ region.name }}</option>
</select>
</div>
diff --git a/tailwind.config.js b/tailwind.config.js
index 4f64772..b6114cc 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -175,6 +175,8 @@ module.exports = {
'500': '#670047',
},
'fxactivecolor': '#adc90e', // used in switch active state, acidgreen
+ 'fxactivecolorhover': '#92AC00', // used in switch active state, darkacidgreen
+ 'fxtextonactivecolor': '#000000', // used in switch active state, black
},
container: {
center: true,
--
GitLab