Skip to content
Snippets Groups Projects
Commit 9d1ff719 authored by Alexa Valentová's avatar Alexa Valentová
Browse files

Merge branch 'feat/redesign' into 'master'

Feat/redesign

See merge request !29
parents 1fb615d1 b8e332f9
Branches master
No related tags found
1 merge request!29Feat/redesign
Pipeline #19907 passed
Showing
with 327 additions and 21 deletions
<div class="flex justify-center">
<div class="container--wide w-full">
<div class="flex flex-col gap-8 mb-16">
<div class="grid grid-cols-1 md:grid-cols-2 gap-12">
{% include 'patterns/molecules/articles/article_title_preview.html' %}
{% include 'patterns/molecules/articles/article_title_preview.html' %}
{% include 'patterns/molecules/articles/article_title_preview.html' %}
{% include 'patterns/molecules/articles/article_title_preview.html' %}
{% include 'patterns/molecules/articles/article_title_preview.html' %}
{% include 'patterns/molecules/articles/article_title_preview.html' %}
</div>
<div class="flex justify-center">
{% include 'patterns/atoms/buttons/round_button.html' with button_text='Další články' %}
</div>
</div>
</div>
</div>
{% extends 'patterns/organisms/articles/articles_section.html' %}
{% block description_classes %}max-w-[400px] text-xl{% endblock %}
{% block button_wrapper_classes %}
flex justify-center pt-12 pb-20
xl:py-24
{% endblock %}
<ul
class="candidate-primary-list __js-root"
id="{{ id }}"
>
{% include "patterns/molecules/candidates/candidate_primary_box.html" %}
{% include "patterns/molecules/candidates/candidate_primary_box.html" %}
{% include "patterns/molecules/candidates/candidate_primary_box.html" %}
{% include "patterns/molecules/candidates/candidate_primary_box.html" %}
{% include "patterns/molecules/candidates/candidate_primary_box.html" %}
{% include "patterns/molecules/candidates/candidate_primary_box.html" %}
</ul>
......@@ -18,7 +18,7 @@
<div
class="
flex font-bold justify-center items-center rounded-full
flex grow-1 shrink-0 font-bold justify-center items-center rounded-full
"
>
<img
......@@ -27,18 +27,31 @@
>
</div>
<div
class="
flex gap-2 flex-col
lg:gap-6 lg:flex-row
"
>
<h4
class="text-xl font-bold w-64"
>{{ candidate.name }}</h4>
{% if candidate.position %}
<p class="ml-6">
<p class="lg:ml-6">
{{ candidate.position }}
</p>
{% endif %}
{% if candidate.party_membership %}
<div class="ml-auto font-bold flex items-center gap-1">
<div
class="
font-bold flex items-center gap-1
lg:ml-auto
"
>
{% if candidate.party_membership == "Pirátská strana" %}
<img
class="w-8"
......@@ -49,6 +62,7 @@
{{ candidate.party_membership }}
</div>
{% endif %}
</div>
</a>
</li>
{% endfor %}
......
<ul
class="candidate-primary-list __js-root"
id="{{ id }}"
>
{% include "patterns/molecules/candidates/elections/candidate_primary_box.html" %}
{% include "patterns/molecules/candidates/elections/candidate_primary_box.html" %}
{% include "patterns/molecules/candidates/elections/candidate_primary_box.html" %}
{% include "patterns/molecules/candidates/elections/candidate_primary_box.html" %}
{% include "patterns/molecules/candidates/elections/candidate_primary_box.html" %}
{% include "patterns/molecules/candidates/elections/candidate_primary_box.html" %}
</ul>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 content-stretch gap-4">
{% for card in cards %}
{% include 'patterns/molecules/boxes/flip_card_box.html' with title=card.title image_url=card.image_url content=card.content button_text=card.button_text %}
{% include 'patterns/molecules/boxes/flip_card_box.html' with title=card.title image_url=card.image_url background_url=card.background_url title_color=card.title_color content=card.content button_text=card.button_text %}
{% endfor %}
</div>
......@@ -4,7 +4,8 @@ context:
title: |-
Staň se členkou
nebo členem
image_url: '../../../../../static/images/onboarding/member.webp'
title_color: 'red'
background_url: '../../../../../static/images/onboarding/member.webp'
content: |-
<h2>
Chceš se aktivně zapojit do politiky? Rád bys byl součástí pozitivních změn? Staň se naším členem!
......
......@@ -4,4 +4,9 @@
{% include 'patterns/atoms/header/navigation.html' with classes='mb-6' first_text=first_nav_text second_text=second_nav_text second_link=second_link %}
{% endblock %}
{% block after_heading %}
{% include 'patterns/atoms/articles/header_author.html' %}
{% include 'patterns/molecules/tags/tags.html' with classes='mb-4 mt-4' %}
{% endblock %}
{% block heading_classes %}head-8xl{% endblock %}
{% extends 'patterns/organisms/header/simple_header_with_tags.html' %}
{% block header_margin_class %}
mb-10
{% endblock %}
{% block classes %}
bg-black flex items-center w-full mb-10 pt-28 pb-8
bg-black flex items-center w-full pt-28 pb-8
md:mb-16
......@@ -11,7 +15,7 @@
{% endblock %}
{% block after_heading %}
{% include 'patterns/molecules/tags/tags.html' with classes='mb-4' %}
{% include 'patterns/molecules/tags/tags.html' with classes='mb-4' size_classes='' %}
<div class="flex justify-start">
<input
......
{% extends 'patterns/organisms/header/simple_header.html' %}
{% block header_margin_class %}{% endblock %}
{% block after_header %}
<div
class="
bg-pirati-yellow py-4
"
>
<div class="container--wide">
{% include "patterns/atoms/buttons/round_button.html" with button_text="Zobrazit na mapě" id="map-opener" %}
</div>
</div>
<div
class="
opacity-0 absolute top-0 left-0 overflow-hidden
py-8
bg-pirati-yellow
"
id="address-popup"
data-is-open="false"
>
<div
class="
container--wide flex flex-col gap-4
lg:flex-row lg:justify-between
"
>
<div
class="prose prose-black leading-6"
>
<address>
<div class="mb-3">
<strong>
K Pirátskému centru je možné se dostat autobusy č. 13, 15 a 17,<br>
s výstupem na stanici Želivského.
</strong>
</div>
<div class="whitespace-pre-line">Mozilla Foundation
331 E Evelyn Ave
Mountain View, CA 94041
USA</div>
</address>
</div>
<div
class="
w-full [&_*]:mt-0
lg:w-[35rem]
"
>
<!-- Placeholder instead of map -->
<img
class="w-full mt-8"
src="https://picsum.photos/536/354"
>
</div>
</div>
</div>
<script>
document.getElementById("map-opener").addEventListener(
"click",
(event) => {
const addressPopup = document.getElementById("address-popup");
if (addressPopup.dataset.isOpen === "false") {
document.getElementById(`${event.currentTarget.id}-inner-text`).innerHTML = "Uzavřít mapu"
addressPopup.dataset.isOpen = "true";
addressPopup.classList.remove("absolute");
addressPopup.classList.remove("top-0");
addressPopup.classList.remove("left-0");
addressPopup.classList.add("duration-300");
addressPopup.classList.remove("opacity-0");
// For some reason, this can't run immediately
setTimeout(
() => { addressPopup.scrollIntoView() },
1
)
} else {
document.getElementById(`${event.currentTarget.id}-inner-text`).innerHTML = "Zobrazit na mapě"
addressPopup.dataset.isOpen = "false";
addressPopup.classList.add("absolute");
addressPopup.classList.add("top-0");
addressPopup.classList.add("left-0");
addressPopup.classList.remove("duration-300");
addressPopup.classList.add("opacity-0");
}
}
)
</script>
{% endblock %}
{% extends 'patterns/organisms/header/simple_header_with_ui_switch.html' %}
{% block header_margin_class %}{% endblock %}
{% block classes %}
bg-black flex items-center w-full pt-28 pb-8
......
<header
class="
flex items-center mb-4 w-full pt-96 pb-16
bg-no-repeat bg-cover bg-center bg-blend-darken bg-[top_right_-7rem] bg-[#00000088]
xl:mb-20 xl:bg-center xl:py-52
"
style="background-image: url('../../../../../static/images/background-images/bg-bartos.jpg')"
>
<div class="container--wide w-full">
<div class="text-white flex flex-col">
{% include 'patterns/atoms/header/navigation.html' with classes='mb-10' first_text='Lidé' second_text='Sněmovna' %}
<div
class="
flex gap-12 flex-nowrap flex-col
lg:flex-row
"
>
<img
class="rounded-full w-52 h-52"
src="../../../../../static/images/person-table.png"
alt="Profilový obrázek"
>
<div class="flex flex-col">
<span
class="
text-xl font-alt
sm:text-4xl
"
>{{ degree_before }}</span>
<div class="flex items-baseline flex-col xl:flex-row font-alt">
<h1 class="font-alt text-6xl xl:text-9xl grow xl:grow-0">{{ name }}</h1>
<span class="text-2xl xl:text-4xl">
<span class="hidden xl:inline">, </span>{{ degree_after }}
</span>
</div>
<span
class="
text-lg font-bold mt-8
xl:mt-[-0.7rem]
"
>{{ function }}</span>
<span
class="
text-lg font-bold mt-8
"
>
{% if is_pirate %}
<div class="flex gap-3 items-center">
<img
src="../../../../../static/images/badge.png"
alt="Logo Pirátské strany"
width="35"
height="35"
>
Člen(ka) Pirátské strany
</div>
{% else %}
<div class="flex gap-3 items-center">
<img
src="../../../../../static/images/badge_other.png"
alt="Logo strany '{{ other_party_name }}'"
width="35"
height="35"
>
{{ other_party_name }}
</div>
{% endif %}
</div>
</div>
</div>
</span>
</div>
</div>
</header>
context:
degree_before: 'Ing.'
name: 'Ivan Bartoš'
degree_after: 'PhDr. et PhD'
function: 'Poslanec PSP ČR za Ústecký kraj, lídr Pirátů a ministr pro místní rozvoj'
is_pirate: False
other_party_name: 'Strana Zelených'
{% extends 'patterns/organisms/header/elections/simple_header_with_tags.html' %}
{% block header_margin_class %}
mb-10
{% endblock %}
{% block classes %}
bg-pirati-yellow flex items-center w-full mb-10 pt-28 pb-8
bg-pirati-yellow flex items-center w-full pt-28 pb-8
md:mb-16
......@@ -11,7 +15,7 @@
{% endblock %}
{% block after_heading %}
{% include 'patterns/molecules/tags/tags.html' with classes='mb-4' tag_color_classes='bg-black text-white' %}
{% include 'patterns/molecules/tags/tags.html' with classes='mb-4' tag_color_classes='bg-black text-white' size_classes='' %}
<div class="flex justify-start">
<input
......
{% extends 'patterns/organisms/header/elections/simple_header.html' %}
{% block header_margin_class %}{% endblock %}
{% block classes %}
bg-pirati-yellow flex items-center w-full pt-28 pb-8
......
{% extends 'patterns/organisms/header/elections/simple_header.html' %}
{% block header_margin_class %}{% endblock %}
{% block classes %}
bg-pirati-yellow flex items-center w-full pt-28 pb-8
......
{% extends 'patterns/organisms/header/simple_header.html' %}
{% block classes %}
bg-pirati-yellow flex items-center w-full mb-20 pt-28 pb-8
bg-pirati-yellow flex items-center w-full pt-28 pb-8
xl:pt-48 xl:pb-24
......@@ -14,7 +14,7 @@
{% if is_short %}head-short{% endif %}
{% if description %}
head-8xl
{% if title|length <= 100 %}head-8xl{% else %}head-7xl{% endif %}
{% else %}
head-14xl
{% endif %}
......
{% extends 'patterns/organisms/header/simple_header_with_ui_switch.html' %}
{% block extra_classes %}xl:pt-32 xl:pb-16{% endblock %}
{% block extra_classes %}xl:pt-32 xl:pb-16 mb-20{% endblock %}
{% block description %}
<div
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment