Skip to content
Snippets Groups Projects
Commit 17371f88 authored by quido.zientek's avatar quido.zientek
Browse files

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

parents 7bfd2751 5c7ffa50
No related branches found
No related tags found
3 merge requests!607Pirati.cz,!604Feature/pirati cz quidecek,!575Feature/pirati cz
Show whitespace changes
Inline Side-by-side
Showing
with 244 additions and 147 deletions
main/static/main/css/pattern-scaffolding.css deleted 100644 → 0
+ 0
− 70
View file @ 7bfd2751
/**
* This stylesheet is for styles you want to include only when displaying demo
* styles for grids, animations, color swatches, etc.
* These styles will not be your production CSS.
*/
#sg-patterns {
-webkit-box-sizing: border-box !important;
box-sizing: border-box !important;
max-width: 100%;
padding: 0 0.5em;
}
.demo-animate {
background: #ddd;
padding: 1em;
margin-bottom: 1em;
text-align: center;
border-radius: 8px;
cursor: pointer;
}
.sg-colors {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
list-style: none !important;
padding: 0 !important;
margin: 0 !important;
}
.sg-colors li {
-webkit-box-flex: 1;
-ms-flex: auto;
flex: auto;
padding: 0.3em;
margin: 0 0.5em 0.5em 0;
min-width: 5em;
max-width: 14em;
border: 1px solid #ddd;
border-radius: 0;
}
.sg-swatch {
display: block;
height: 8rem;
margin-bottom: 0.5rem;
border-radius: 0;
}
.sg-label {
font-size: 1rem;
}
.sg-pattern-example {
font-family: "Roboto", "Helvetica", "Arial", sans-serif !important;
}
.sg-pattern-head .sg-pattern-title a {
font-family: "Roboto", "Helvetica", "Arial", sans-serif !important;
font-weight: bold !important;
font-size: 1.2rem !important;
color: #202020 !important;
}
.sg-pattern-category-title a {
font-family: "Bebas Neue", "Helvetica", "Arial", sans-serif !important;
font-weight: 400 !important;
font-size: 3.5rem !important;
}
main/static/main/css/styles.css
+ 197
− 23
View file @ 17371f88
......@@ -1273,11 +1273,6 @@ 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;
......@@ -1306,6 +1301,44 @@ 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;
......@@ -2976,7 +3009,7 @@ p{
.main-menu__main .menu-link{
--tw-bg-opacity: 1;
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}
.main-menu__main .menu-link{
......@@ -2993,7 +3026,7 @@ p{
.main-menu__main .menu-link{
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
color: rgb(0 0 0 / var(--tw-text-opacity));
}
.main-menu__main .menu-link:hover{
......@@ -3001,6 +3034,14 @@ 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{
......@@ -3015,6 +3056,14 @@ 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;
......@@ -3032,11 +3081,24 @@ 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;
}
......@@ -3067,6 +3129,31 @@ 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;
......@@ -3172,6 +3259,14 @@ p{
z-index: 10;
}
.z-50{
z-index: 50;
}
.z-40{
z-index: 40;
}
.col-span-4{
grid-column: span 4 / span 4;
}
......@@ -3200,6 +3295,10 @@ p{
grid-column-end: 3;
}
.m-0{
margin: 0px;
}
.mx-1{
margin-left: 0.25rem;
margin-right: 0.25rem;
......@@ -3295,6 +3394,10 @@ p{
margin-bottom: 2.5rem;
}
.-mt-20{
margin-top: -5rem;
}
.mt-20{
margin-top: 5rem;
}
......@@ -3527,6 +3630,16 @@ 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;
}
......@@ -3549,9 +3662,9 @@ p{
border-color: rgb(236 236 236 / var(--tw-border-opacity));
}
.border-violet-400{
.border-violet-600{
--tw-border-opacity: 1;
border-color: rgb(132 0 72 / var(--tw-border-opacity));
border-color: rgb(125 51 127 / var(--tw-border-opacity));
}
.bg-black{
......@@ -3584,16 +3697,6 @@ p{
background-color: rgb(125 51 127 / var(--tw-bg-opacity));
}
.bg-green-400{
--tw-bg-opacity: 1;
background-color: rgb(76 169 113 / var(--tw-bg-opacity));
}
.bg-violet-400{
--tw-bg-opacity: 1;
background-color: rgb(132 0 72 / var(--tw-bg-opacity));
}
.bg-grey-100{
--tw-bg-opacity: 1;
background-color: rgb(243 243 243 / var(--tw-bg-opacity));
......@@ -3731,6 +3834,14 @@ p{
padding-top: 1rem;
}
.pt-20{
padding-top: 5rem;
}
.pb-8{
padding-bottom: 2rem;
}
.pb-32{
padding-bottom: 8rem;
}
......@@ -3897,6 +4008,12 @@ 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);
......@@ -4327,6 +4444,10 @@ a.icon-link:hover span{
@media (min-width: 1200px){
.xl\:static{
position: static;
}
.xl\:absolute{
position: absolute;
}
......@@ -4397,6 +4518,14 @@ 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;
}
......@@ -4425,6 +4554,10 @@ a.icon-link:hover span{
display: none;
}
.xl\:h-auto{
height: auto;
}
.xl\:h-screen{
height: 100vh;
}
......@@ -4449,6 +4582,10 @@ a.icon-link:hover span{
width: 100%;
}
.xl\:w-auto{
width: auto;
}
.xl\:max-w-xl{
max-width: 36rem;
}
......@@ -4465,6 +4602,10 @@ a.icon-link:hover span{
flex-direction: column;
}
.xl\:flex-wrap{
flex-wrap: wrap;
}
.xl\:items-start{
align-items: flex-start;
}
......@@ -4473,6 +4614,10 @@ a.icon-link:hover span{
align-items: center;
}
.xl\:justify-start{
justify-content: flex-start;
}
.xl\:justify-end{
justify-content: flex-end;
}
......@@ -4485,6 +4630,12 @@ 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;
}
......@@ -4520,6 +4671,18 @@ 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;
}
......@@ -4528,8 +4691,8 @@ a.icon-link:hover span{
padding-top: 3.5rem;
}
.xl\:pb-0{
padding-bottom: 0px;
.xl\:text-left{
text-align: left;
}
.xl\:text-center{
......@@ -4552,6 +4715,17 @@ 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/static/main/images/background-images/50632006293_2001701fa0_o.jpg deleted 100644 → 0
+ 0
− 0
View file @ 7bfd2751
main/static/main/images/background-images/50632006293_2001701fa0_o.jpg

687 KiB

main/static/main/images/background-images/bartos-2.jpg deleted 100644 → 0
+ 0
− 0
View file @ 7bfd2751
main/static/main/images/background-images/bartos-2.jpg

411 KiB

main/static/main/images/background-images/bartos-newsletter.png deleted 100644 → 0
+ 0
− 0
View file @ 7bfd2751
main/static/main/images/background-images/bartos-newsletter.png

1.45 MiB

main/styleguide/source/_patterns/organisms/footer.mustache
+ 2
− 2
View file @ 17371f88
......@@ -9,7 +9,7 @@
class="w-32 md:w-40 pb-6"
/>
</section>
<section class="footer__social lg:text-right lg:mb-10">
<section class="footer__social mb-5 lg:text-right lg:mb-10">
<div class="font-alt text-2xl mb-4">
Zůstaňte s námi v konaktu
</div>
......@@ -34,7 +34,7 @@
</div>
</section>
<section class="footer__main-links text-white lg:flex lg:flex-wrap lg:justify-between gap-8">
<div class="pt-8 pb-4 lg:py-0">
<div class="py-4 lg:py-0">
<ui-footer-collapsible label="Navigace">
<ul class="text-white py-8">
<li>
......
main/styleguide/source/_patterns/organisms/header.mustache
+ 5
− 5
View file @ 17371f88
......@@ -12,11 +12,11 @@
<!-- Hamburger Icon -->
<input class="hidden" type="checkbox" id="menuToggle"/>
<label class="p-3 z-50 hamb mr-3 text-white col-start-2 xl:mr-0 xl:hidden" for="menuToggle">
<div class="container">
<div class="bar1"></div>
<div class="bar2"></div>
<div class="bar3"></div>
</div>
<span class="container">
<span class="bar1"></span>
<span class="bar2"></span>
<span class="bar3"></span>
</span>
</label>
<!-- Menu -->
......
main/templates/main/blocks/articles_timeline_block.html
+ 20
− 25
View file @ 17371f88
......@@ -7,21 +7,16 @@
<div class="article-timeline-grid__left-article xl:pt-8">
{% for article_page in month_article_data.left_column %}
{% include 'main/includes/work_article_preview.html' %}
{% empty %}
<div class="p-7 flex flex-col max-w-xl mb-8"/>
{% endfor %}
</div>
<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>
</div>
<div class="article-timeline-grid__right-article xl:pt-14">
{% for article_page in month_article_data.right_column %}
{% include 'main/includes/work_article_preview.html' %}
{% empty %}
<div class="p-7 flex flex-col max-w-xl mb-8"/>
{% endfor %}
</div>
</div>
......
main/templates/main/includes/layout/footer.html
+ 2
− 2
View file @ 17371f88
......@@ -10,7 +10,7 @@
class="w-32 md:w-40 pb-6"
/>
</section>
<section class="footer__social lg:text-right lg:mb-10">
<section class="footer__social mb-5 lg:text-right lg:mb-10">
{% if page.root_page.social_links %}
<div class="font-alt text-2xl mb-4">
Zůstaňte s námi v konaktu
......@@ -28,7 +28,7 @@
</section>
<section class="footer__main-links text-white lg:flex lg:flex-wrap lg:justify-between gap-8">
{% for other_link in page.root_page.footer_other_links %}
<div class="{% if forloop.first %}pt-8 pb-4 {% else %}pt-4 {% endif %}lg:py-0">
<div class="py-4 lg:py-0">
<ui-footer-collapsible label="{{ other_link.value.title }}">
<ul class="text-white py-8">
{% for link_list in other_link.value.list %}
......
main/templates/main/includes/layout/header.html
+ 18
− 20
View file @ 17371f88
{% load static wagtailcore_tags %}
<!-- Navbar -->
<nav
class="navbar-background bg-black xl:duration-200 relative xl:bg-transparent xl:static xl:absolute z-50 xl:z-50 xl:w-full hover:bg-black">
<nav class="navbar-background bg-black xl:duration-200 relative xl:bg-transparent xl:static xl:absolute z-50 xl:z-50 xl:w-full hover:bg-black">
<!-- Logo -->
<a href="/" class="menu-flag flex justify-center z-50 flag bg-white p-1 main-menu__logo xl:my-2 xl:my-3">
<img src="{% static "shared/img/logo-full-black.svg" %}" alt="">
</a>
<!-- Flex container -->
<div class="grid-container main-menu-grid m-0 w-full xl:w-auto absolute xl:static">
<div
class="main-menu grid-content-with-right-side grid justify-between items-center shadow-2xl xl:shadow-none xl:py-6">
<div class="main-menu grid-content-with-right-side grid justify-between items-center shadow-2xl xl:shadow-none xl:py-6">
<!-- Hamburger Icon -->
<input class="hidden" type="checkbox" id="menuToggle"/>
<label class="p-3 z-50 hamb mr-3 text-white col-start-2 xl:mr-0 xl:hidden" for="menuToggle">
<div class="container">
<div class="bar1"></div>
<div class="bar2"></div>
<div class="bar3"></div>
</div>
<span class="container">
<span class="bar1"></span>
<span class="bar2"></span>
<span class="bar3"></span>
</span>
</label>
<!-- Menu -->
<div
class="main-menu__main main-menu-items justify-center pt-20 xl:pt-0 xl:flex-wrap z-40 space-x-3 overflow-auto bg-white -mt-20 xl:-mt-0 xl:h-auto xl:bg-transparent text-center xl:text-left xl:space-x-3 xl:mt-0 2xl:space-x-6 xl:flex">
<div class="main-menu__main main-menu-items justify-center pt-20 xl:pt-0 xl:flex-wrap z-40 space-x-3 overflow-auto bg-white -mt-20 xl:-mt-0 xl:h-auto xl:bg-transparent text-center xl:text-left xl:space-x-3 xl:mt-0 2xl:space-x-6 xl:flex">
{% for block in page.root_page.menu %}
{% include_block block %}
{% endfor %}
</div>
<!-- Buttons & Social-->
<div
class="main-menu__external main-menu-items items-center justify-center xl:justify-start space-x-1 2xl:space-x-3 xl:flex">
{% for social_link_block in page.root_page.social_links %}
<div class="main-menu__external main-menu-items items-center justify-center xl:justify-start space-x-1 2xl:space-x-3 xl:flex">
<div class="flex py-4 space-x-10 xl:space-x-3 mb-2 xl:mb-0 justify-center xl:justify-start xl:mr-2">
{% for social_link_block in page.root_page.social_links %}
<a href="{{ social_link_block.value.link }}"
class="text-lg xl:text-base text-black xl:text-white hover:no-underline">
<i class="{{ social_link_block.value.icon }}"></i>
</a>
{% endfor %}
</div>
<div class="flex-row flex pb-8 xl:pb-0 gap-4 xl:pr-5">
{% if page.root_page.donation_page %}
<a href="{{ page.root_page.donation_page }}"
......
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