Skip to content
Snippets Groups Projects
Commit f0f235cd authored by OndraRehounek's avatar OndraRehounek
Browse files

Merge branch 'feature/pirati-cz' into feature/pirati-cz-dan 

# Conflicts:
#	main/static/main/css/styles.css
parents 22f2bc0c 8cc08b70
No related branches found
No related tags found
3 merge requests!607Pirati.cz,!603[FIX]Headerstyle,!575Feature/pirati cz
Pipeline #9591 passed
Stage: build
Show whitespace changes
Inline Side-by-side
Showing
with 64 additions and 224 deletions
main/static/main/css/styles.css
+ 21
− 193
View file @ f0f235cd
......@@ -1273,6 +1273,11 @@ video {
color: #000000;
}
.btn--violet-500 .btn__icon{
border-color: rgb(93, 0, 64);
background-color: #670047;
}
.btn--violet-500.btn--hoveractive:not([class^="btn--to-"]):hover .btn__body, .btn--violet-500.btn--hoveractive:not([class^="btn--to-"]):hover .btn__icon{
background-color: rgb(82, 0, 57);
color: #fff;
......@@ -1301,44 +1306,6 @@ video {
color: #000000 !important;
}
.btn--violet-700 .btn__body, .btn--violet-700 .btn__icon{
background-color: #7D347D;
color: #000000;
}
.btn--violet-700 .btn__icon{
border-color: rgb(113, 47, 113);
background-color: #7D347D;
}
.btn--violet-700.btn--hoveractive:not([class^="btn--to-"]):hover .btn__body, .btn--violet-700.btn--hoveractive:not([class^="btn--to-"]):hover .btn__icon{
background-color: rgb(100, 42, 100);
color: #fff;
}
.btn--violet-700.btn--hoveractive:not([class^="btn--to-"]):hover .btn__icon{
border-color: rgb(88, 36, 88);
}
.btn--violet-700.btn--hoveractive:not([class^="btn--to-"]):hover .btn__icon svg, .btn--violet-700.btn--hoveractive:not([class^="btn--to-"]):hover .btn__icon i{
color: #fff;
fill: #fff;
}
.btn--hoveractive.btn--to-violet-700:hover .btn__body, .btn--to-violet-700.btn--activated .btn__body{
background-color: #7D347D !important;
color: #000000 !important;
}
.btn--hoveractive.btn--to-violet-700:hover .btn__icon, .btn--to-violet-700.btn--activated .btn__icon{
border-color: rgb(113, 47, 113) !important;
background-color: #7D347D !important;
}
.btn--hoveractive.btn--to-violet-700:hover .btn__inline-icon, .btn--to-violet-700.btn--activated .btn__inline-icon{
color: #000000 !important;
}
.btn--red-600 .btn__body, .btn--red-600 .btn__icon{
background-color: #d60d53;
color: #ffffff;
......@@ -2790,6 +2757,14 @@ p{
display: none;
}
.background-hover-zoom {
background-position: center;
background-size: 100%;
transition: background-size 0.3s ease-in;
}
.background-hover-zoom:hover {background-size: 110%}
.article-timeline-grid{
display: grid;
gap: 0.5rem;
......@@ -3001,7 +2976,7 @@ p{
.main-menu__main .menu-link{
--tw-bg-opacity: 1;
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
}
.main-menu__main .menu-link{
......@@ -3018,7 +2993,7 @@ p{
.main-menu__main .menu-link{
--tw-text-opacity: 1;
color: rgb(0 0 0 / var(--tw-text-opacity));
color: rgb(255 255 255 / var(--tw-text-opacity));
}
.main-menu__main .menu-link:hover{
......@@ -3026,14 +3001,6 @@ p{
text-decoration-line: none;
}
@media (min-width: 1200px){
.main-menu__main .menu-link{
--tw-bg-opacity: 1;
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
}
}
@media (min-width: 1200px){
.main-menu__main .menu-link{
......@@ -3048,14 +3015,6 @@ p{
}
}
@media (min-width: 1200px){
.main-menu__main .menu-link{
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
}
}
.navbar-background {
background: linear-gradient(180deg, rgb(0, 0, 0) 8%, rgba(255, 255, 255, 0) 100%);
min-height: 63px;
......@@ -3073,24 +3032,11 @@ p{
width: 209px;
}
.main-menu__external{
--tw-bg-opacity: 1;
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: rgb(0 0 0 / var(--tw-text-opacity));
}
@media (min-width: 1200px){
.main-menu__external{
--tw-bg-opacity: 1;
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
}
}
.main-menu__external {
grid-area: external;
}
......@@ -3121,31 +3067,6 @@ p{
}
}
.container {
display: inline-block;
cursor: pointer;
}
.bar1, .bar2, .bar3 {
width: 35px;
height: 5px;
background-color: white;
margin: 6px 0;
transition: 0.4s;
}
#menuToggle:checked + label .bar1 {
transform: rotate(-45deg) translate(-9px, 6px);
background-color: black;
}
#menuToggle:checked + label .bar2 {opacity: 0;}
#menuToggle:checked + label .bar3 {
transform: rotate(45deg) translate(-8px, -8px);
background-color: black;
}
.newsletter-grid{
display: grid;
......@@ -3251,14 +3172,6 @@ p{
z-index: 10;
}
.z-50{
z-index: 50;
}
.z-40{
z-index: 40;
}
.col-span-4{
grid-column: span 4 / span 4;
}
......@@ -3287,10 +3200,6 @@ p{
grid-column-end: 3;
}
.m-0{
margin: 0px;
}
.mx-1{
margin-left: 0.25rem;
margin-right: 0.25rem;
......@@ -3386,10 +3295,6 @@ p{
margin-bottom: 2.5rem;
}
.-mt-20{
margin-top: -5rem;
}
.mt-20{
margin-top: 5rem;
}
......@@ -3622,16 +3527,6 @@ p{
margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-x-10 > :not([hidden]) ~ :not([hidden]){
--tw-space-x-reverse: 0;
margin-right: calc(2.5rem * var(--tw-space-x-reverse));
margin-left: calc(2.5rem * calc(1 - var(--tw-space-x-reverse)));
}
.overflow-auto{
overflow: auto;
}
.rounded-full{
border-radius: 9999px;
}
......@@ -3836,14 +3731,6 @@ p{
padding-top: 1rem;
}
.pt-20{
padding-top: 5rem;
}
.pb-8{
padding-bottom: 2rem;
}
.pb-32{
padding-bottom: 8rem;
}
......@@ -4010,12 +3897,6 @@ p{
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-2xl{
--tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
--tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.drop-shadow-xl{
--tw-drop-shadow: drop-shadow(0 20px 13px rgb(0 0 0 / 0.03)) drop-shadow(0 8px 5px rgb(0 0 0 / 0.08));
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
......@@ -4446,10 +4327,6 @@ a.icon-link:hover span{
@media (min-width: 1200px){
.xl\:static{
position: static;
}
.xl\:absolute{
position: absolute;
}
......@@ -4520,14 +4397,6 @@ a.icon-link:hover span{
margin-bottom: 7rem;
}
.xl\:mr-0{
margin-right: 0px;
}
.xl\:-mt-0{
margin-top: -0px;
}
.xl\:mt-0{
margin-top: 0px;
}
......@@ -4560,8 +4429,8 @@ a.icon-link:hover span{
height: 100vh;
}
.xl\:h-auto{
height: auto;
.xl\:min-h-screen{
min-height: 100vh;
}
.xl\:w-36{
......@@ -4580,10 +4449,6 @@ a.icon-link:hover span{
width: 100%;
}
.xl\:w-auto{
width: auto;
}
.xl\:max-w-xl{
max-width: 36rem;
}
......@@ -4600,10 +4465,6 @@ a.icon-link:hover span{
flex-direction: column;
}
.xl\:flex-wrap{
flex-wrap: wrap;
}
.xl\:items-start{
align-items: flex-start;
}
......@@ -4612,10 +4473,6 @@ a.icon-link:hover span{
align-items: center;
}
.xl\:justify-start{
justify-content: flex-start;
}
.xl\:justify-end{
justify-content: flex-end;
}
......@@ -4628,12 +4485,6 @@ a.icon-link:hover span{
gap: 1.25rem;
}
.xl\:space-x-3 > :not([hidden]) ~ :not([hidden]){
--tw-space-x-reverse: 0;
margin-right: calc(0.75rem * var(--tw-space-x-reverse));
margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));
}
.xl\:justify-self-end{
justify-self: end;
}
......@@ -4669,18 +4520,6 @@ a.icon-link:hover span{
padding-bottom: 9rem;
}
.xl\:pt-0{
padding-top: 0px;
}
.xl\:pb-0{
padding-bottom: 0px;
}
.xl\:pr-5{
padding-right: 1.25rem;
}
.xl\:pt-8{
padding-top: 2rem;
}
......@@ -4689,8 +4528,8 @@ a.icon-link:hover span{
padding-top: 3.5rem;
}
.xl\:text-left{
text-align: left;
.xl\:pb-0{
padding-bottom: 0px;
}
.xl\:text-center{
......@@ -4713,17 +4552,6 @@ a.icon-link:hover span{
font-size: 7.5rem;
}
.xl\:text-white{
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
}
.xl\:shadow-none{
--tw-shadow: 0 0 #0000;
--tw-shadow-colored: 0 0 #0000;
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.xl\:duration-200{
transition-duration: 200ms;
}
......
main/styleguide/source/_patterns/molecules/how-we-work/work-article-preview.mustache
+ 2
− 2
View file @ f0f235cd
......@@ -3,8 +3,8 @@
class="mb-7">
<h2 class="head-2xl mb-4">Konec mezinárodní ostudy. Evropská komise uzavřela řízení o střetu zájmů</h2>
<div class="flex font-bold mb-4 text-xs text-white uppercase">
<span class="bg-green-400 mr-1 p-2">Duben 2022</span>
<span class="bg-violet-400 mr-1 p-2">#ENERGETIKA</span>
<span class="bg-green-500 mr-1 p-2">Duben 2022</span>
<span class="bg-violet-600 mr-1 p-2">#ENERGETIKA</span>
</div>
<p class="mb-8">
Zachránili jsme 180 miliard korun pro naše občany. Ostuda, kterou Česká republika musela podstupovat, je u konce.
......
main/styleguide/source/_patterns/molecules/representative-box.mustache
+ 1
− 1
View file @ f0f235cd
<div class="w-96 h-60 flex bg-white flex-col items-center bg-cover justify-center drop-shadow-xl xl:m-0 sm:w-80 sm:h-80"
<div class="background-hover-zoom w-96 h-60 flex bg-white flex-col items-center justify-center drop-shadow-xl xl:m-0 sm:w-80 sm:h-80"
style="background-image: url('https://i.picsum.photos/id/261/350/350.jpg?hmac=GOGR4Va2TTfzr3sxRHwTlAxqhpu4M_pl_oKex2O7fcQ')">
<h5 class="head-alt-md text-white mt-24 mb-8">poslanci za piráty</h5>
{{> atoms-button-animated(btn-text: "Poslanecký klub") }}
......
main/styleguide/source/_patterns/organisms/box-links-section.mustache
+ 1
− 1
View file @ f0f235cd
<div class="bg-cover bg-no-repeat section-clip py-16 xl:h-screen lg:py-36"
<div class="bg-cover bg-no-repeat section-clip py-16 xl:min-h-screen lg:py-36"
style="background-image: url('../../images/background-images/bg-join-us.jpg')">
<div class="container--wide mx-auto z-10">
<h2 class="head-7xl xl:text-center mb-6 xl:mb-28">
......
main/styleguide/source/_patterns/organisms/main-articles-timeline.mustache
+ 4
− 4
View file @ f0f235cd
......@@ -8,8 +8,8 @@
<div class="article-timeline-grid__left-article xl:pt-8">
{{> molecules-work-article-preview }}
</div>
<div class="article-timeline-grid__timeline relative border border-violet-400 hidden xl:block">
<div class="article-timeline--month absolute bg-violet-400 p-1 text-white font-bold">
<div class="article-timeline-grid__timeline relative border border-violet-600 hidden xl:block">
<div class="article-timeline--month absolute bg-violet-600 p-1 text-white font-bold">
Červenec
</div>
</div>
......@@ -26,8 +26,8 @@
<div class="article-timeline-grid__left-article xl:pt-8">
{{> molecules-work-article-preview }}
</div>
<div class="article-timeline-grid__timeline relative border border-violet-400 hidden xl:block">
<div class="article-timeline--month absolute bg-violet-400 p-1 text-white font-bold">
<div class="article-timeline-grid__timeline relative border border-violet-600 hidden xl:block">
<div class="article-timeline--month absolute bg-violet-600 p-1 text-white font-bold">
Srpen
</div>
</div>
......
main/styleguide/source/_patterns/organisms/newsletter-section.mustache
+ 1
− 1
View file @ f0f235cd
<div class="section-clip bg-cover bg-no-repeat flex pb-32 xl:pb-0 xl:h-screen relative z-10">
<div class="section-clip bg-cover bg-no-repeat flex pb-32 xl:pb-0 xl:min-h-screen relative z-10">
<img src="../../images/background-images/bg-bartos-newsletter.jpg" alt="" class="absolute h-full w-full object-cover">
<div class="grid-container mt-20 xl:mt-0 xl:items-center z-10">
<div class="grid-full newsletter-grid">
......
main/styleguide/source/_patterns/organisms/representatives-section.mustache
+ 11
− 9
View file @ f0f235cd
<div class="container--medium mb-8 xl:h-screen flex flex-col justify-center lg:mb-16">
<div class="bg-cover bg-no-repeat section-clip py-16 xl:min-h-screen lg:py-36">
<div class="container--wide mx-auto z-10">
<h2 class="head-7xl xl:text-center mb-6 xl:mb-28">
Piráti zastupují občany
</h2>
<div class="flex flex-wrap space-x-1 justify-center gap-2 md:gap-1 items-center">
<div class="flex flex-wrap gap-2 md:gap-1 justify-center items-center md:flex-row">
{{> molecules-representative-box }}
{{> molecules-representative-box }}
{{> molecules-representative-box }}
{{> molecules-representative-box }}
</div>
</div>
</div>
main/styleguide/source/css/molecules/representative_box.pcss 0 → 100644
+ 7
− 0
View file @ f0f235cd
.background-hover-zoom {
background-position: center;
background-size: 100%;
transition: background-size 0.3s ease-in;
}
.background-hover-zoom:hover {background-size: 110%}
main/styleguide/source/css/style.pcss
+ 1
− 0
View file @ f0f235cd
......@@ -30,6 +30,7 @@
@import "./molecules/contact_box.pcss";
@import "./molecules/sliding_button.pcss";
@import "./molecules/switch.pcss";
@import "./molecules/representative_box.pcss";
@import "./organisms/article-timeline.pcss";
@import "./organisms/footer.pcss";
......
main/templates/main/blocks/articles_timeline_block.html
+ 3
− 3
View file @ f0f235cd
......@@ -11,8 +11,8 @@
<div class="p-7 flex flex-col max-w-xl mb-8"/>
{% endfor %}
</div>
<div class="article-timeline-grid__timeline relative border border-violet-400 hidden xl:block">
<div class="article-timeline--month absolute bg-violet-400 p-1 text-white font-bold">
<div class="article-timeline-grid__timeline relative border border-violet-600 hidden xl:block">
<div class="article-timeline--month absolute bg-violet-600 p-1 text-white font-bold">
{{ month_article_data.month_text }}
</div>
......
main/templates/main/blocks/boxes_block.html
+ 1
− 1
View file @ f0f235cd
{% load static wagtailimages_tags %}
<div class="bg-cover bg-no-repeat section-clip py-16 xl:h-screen lg:py-36"
<div class="bg-cover bg-no-repeat section-clip py-16 xl:min-h-screen lg:py-36"
style="background-image:
{% if self.image %}
{% image self.image original as original_image %}
......
main/templates/main/blocks/people_overview_block.html
+ 2
− 2
View file @ f0f235cd
{% load wagtailimages_tags %}
<div class="container--medium mb-8 xl:h-screen flex flex-col justify-center lg:mb-16">
<div class="container--medium mb-8 xl:min-h-screen flex flex-col justify-center lg:mb-16">
<h2 class="head-7xl xl:text-center mb-6 xl:mb-28">
{{ self.title }}
</h2>
<div class="flex flex-wrap space-x-1 justify-center gap-2 md:gap-1 items-center">
{% for box in self.list %}
{% image box.image fill-500x500 as box_image %}
<div class="w-96 h-60 flex bg-white flex-col items-center bg-cover justify-center drop-shadow-xl xl:m-0 sm:w-80 sm:h-80"
<div class="background-hover-zoom w-96 h-60 flex bg-white flex-col items-center justify-center drop-shadow-xl xl:m-0 sm:w-80 sm:h-80"
style="background-image: url('{{ box_image.url }}')">
<h5 class="head-alt-md text-white mt-24 mb-8">
{{ box.title }}
......
main/templates/main/includes/layout/footer.html
+ 2
− 2
View file @ f0f235cd
......@@ -61,8 +61,8 @@
{% else %}
{{ person.value.position }}
{% endif %}</strong>
<span>{{ person.value.person.phone }}</span>
<span class="text-turquoise-500 text-sm">{{ person.value.person.email }}</span>
<span>{{ person.value.person.phone | default_if_none:'' }}</span>
<span class="text-turquoise-500 text-sm">{{ person.value.person.email | default_if_none:'' }}</span>
</div>
</div>
{% endfor %}
......
main/templates/main/includes/newsletter_section.html
+ 1
− 1
View file @ f0f235cd
{% load static %}
<div class="section-clip bg-cover bg-no-repeat flex pb-32 xl:pb-0 xl:h-screen relative z-10">
<div class="section-clip bg-cover bg-no-repeat flex pb-32 xl:pb-0 xl:min-h-screen relative z-10">
<img src="{% static 'main/images/background-images/bg-bartos-newsletter.jpg' %}" alt="" class="absolute h-full w-full object-cover">
<div class="grid-container mt-20 xl:mt-0 xl:items-center z-10">
<div class="grid-full newsletter-grid">
......
main/templates/main/includes/person_article_preview.html
+ 4
− 2
View file @ f0f235cd
{% for article_page in article_data_list %}
<div class="flex flex-col justify-between items-start mb-9">
<div class="flex font-bold mb-4 text-xs text-white uppercase">
<span class="bg-green-500 mr-1 px-1">Duben 2022</span>
<span class="bg-violet-600 mr-1 px-1">#ENERGETIKA</span>
<span class="bg-green-500 mr-1 px-1">{{ article_page.date }}</span>
{% for tag in article_page.tags.all %}
<span class="bg-violet-600 mr-1 px-1">{{ tag }}</span>
{% endfor %}
</div>
<h4 class="head-3xl mb-4">
{{ article_page.title }}
......
main/templates/main/includes/work_article_preview.html
+ 2
− 2
View file @ f0f235cd
......@@ -10,9 +10,9 @@
{{ article_page.title }}
</h2>
<div class="flex font-bold mb-4 text-xs text-white uppercase">
<span class="bg-green-400 mr-1 p-2">{{ article_page.date }}</span>
<span class="bg-green-500 mr-1 p-2">{{ article_page.date }}</span>
{% for tag in article_page.tags.all %}
<span class="bg-violet-400 mr-1 p-2">{{ tag }}</span>
<span class="bg-violet-600 mr-1 p-2">{{ tag }}</span>
{% endfor %}
</div>
<p class="mb-8">
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment

Pirátský GitLab - Home of the CopyLeft