Skip to content
Snippets Groups Projects
Commit 2a860c26 authored by Daniel Kriz's avatar Daniel Kriz
Browse files

[FIX] 

Header style
parent 4dd5ab22
Branches
No related tags found
3 merge requests!607Pirati.cz,!603[FIX]Headerstyle,!575Feature/pirati cz
Pipeline #9584 passed
Stage: build
Show whitespace changes
Inline Side-by-side
Showing
with 379 additions and 112 deletions
main/static/main/css/styles.css
+ 262
− 49
View file @ 2a860c26
......@@ -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;
......@@ -2265,6 +2298,21 @@ video {
}
}
.head-9xl{
font-family: Bebas Neue, Helvetica, Arial, sans-serif;
font-size: 3rem;
font-weight: 500;
text-transform: uppercase;
letter-spacing: -0.025em;
}
@media (min-width: 1200px){
.head-9xl{
font-size: 6.25rem;
}
}
p{
font-size: .875rem;
line-height: 1.5rem;
......@@ -2670,9 +2718,8 @@ p{
}
.switch{
display: flex;
flex-wrap: wrap;
justify-content: center;
padding-top: 1.25rem;
padding-bottom: 1.25rem;
}
.switch__item{
......@@ -2681,8 +2728,8 @@ p{
cursor: pointer;
--tw-bg-opacity: 1;
background-color: rgb(236 236 236 / var(--tw-bg-opacity));
padding-left: 1rem;
padding-right: 1rem;
padding-left: 1.25rem;
padding-right: 1.25rem;
padding-top: 0.5rem;
padding-bottom: 0.5rem;
text-align: center;
......@@ -2709,6 +2756,39 @@ p{
background-color: rgb(146 210 219 / var(--tw-bg-opacity));
}
/* HORIZONTAL SCROLLABLE */
.horizontal-scrolling {
display: block;
margin-left: -15px;
margin-right: -15px;
max-width: calc(100% + 30px);
overflow-x: scroll;
overflow-y: hidden;
padding: 0 15px;
text-align: center;
white-space: nowrap;
}
.horizontal-scrolling.draggable {
cursor: -webkit-grab;
cursor: grab;
}
.horizontal-scrolling.draggable.active, .horizontal-scrolling.draggable.active a {
cursor: -webkit-grabbing;
cursor: grabbing;
}
.no-scrollbars {
-ms-overflow-style: -ms-autohiding-scrollbar;
scrollbar-width: none;
}
.no-scrollbars::-webkit-scrollbar {
display: none;
}
.article-timeline-grid{
display: grid;
gap: 0.5rem;
......@@ -2792,36 +2872,21 @@ p{
grid-area: main-links;
}
.footer__main-links .footer__main--link{
margin-top: 1.5rem;
}
.footer__main-links .footer__main--link{
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
}
@media (min-width: 1200px){
.footer__main-links .footer__main--link{
margin-right: 0.5rem;
}
}
.footer__main-links ul {
display: grid;
grid-auto-columns: minmax(160px, auto);
grid-auto-flow: column;
grid-gap: 10px;
grid-template-rows: repeat(12, 40px);
display: flex;
flex-flow: row wrap;
max-height: 320px;
writing-mode: vertical-lr;
}
@media (min-width: 576px) {
/* workaround for long-living bug https://stackoverflow.com/a/39102894/7113416 */
.footer__main-links ul {
grid-template-rows: repeat(6, 40px)
}
.footer__main-links ul li {
display: block;
height: 40px;
line-height: 40px;
min-width: 150px;
writing-mode: initial; /* workaround revert from above */
}
.footer-collapsible__toggle{
......@@ -2928,7 +2993,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{
......@@ -2945,7 +3010,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{
......@@ -2953,6 +3018,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{
......@@ -2967,6 +3040,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;
......@@ -2984,11 +3065,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;
}
......@@ -3019,6 +3113,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;
......@@ -3124,6 +3243,14 @@ p{
z-index: 10;
}
.z-50{
z-index: 50;
}
.z-40{
z-index: 40;
}
.col-span-4{
grid-column: span 4 / span 4;
}
......@@ -3152,6 +3279,10 @@ p{
grid-column-end: 3;
}
.m-0{
margin: 0px;
}
.mx-1{
margin-left: 0.25rem;
margin-right: 0.25rem;
......@@ -3247,6 +3378,10 @@ p{
margin-bottom: 2.5rem;
}
.-mt-20{
margin-top: -5rem;
}
.mt-20{
margin-top: 5rem;
}
......@@ -3479,6 +3614,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;
}
......@@ -3688,6 +3833,14 @@ p{
padding-top: 1rem;
}
.pt-20{
padding-top: 5rem;
}
.pb-8{
padding-bottom: 2rem;
}
.pb-32{
padding-bottom: 8rem;
}
......@@ -3854,6 +4007,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);
......@@ -4100,13 +4259,6 @@ a.icon-link:hover span{
flex-direction: column;
}
@media (min-width: 576px){
.sm\:sm\:flex-col{
flex-direction: column;
}
}
.sm\:pt-0{
padding-top: 0px;
}
......@@ -4146,6 +4298,10 @@ a.icon-link:hover span{
grid-column: span 2 / span 2;
}
.md\:mt-20{
margin-top: 5rem;
}
.md\:mt-0{
margin-top: 0px;
}
......@@ -4287,6 +4443,10 @@ a.icon-link:hover span{
@media (min-width: 1200px){
.xl\:static{
position: static;
}
.xl\:absolute{
position: absolute;
}
......@@ -4357,6 +4517,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;
}
......@@ -4389,6 +4557,10 @@ a.icon-link:hover span{
height: 100vh;
}
.xl\:h-auto{
height: auto;
}
.xl\:w-36{
width: 9rem;
}
......@@ -4405,6 +4577,10 @@ a.icon-link:hover span{
width: 100%;
}
.xl\:w-auto{
width: auto;
}
.xl\:max-w-xl{
max-width: 36rem;
}
......@@ -4421,6 +4597,10 @@ a.icon-link:hover span{
flex-direction: column;
}
.xl\:flex-wrap{
flex-wrap: wrap;
}
.xl\:items-start{
align-items: flex-start;
}
......@@ -4429,6 +4609,10 @@ a.icon-link:hover span{
align-items: center;
}
.xl\:justify-start{
justify-content: flex-start;
}
.xl\:justify-end{
justify-content: flex-end;
}
......@@ -4441,6 +4625,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;
}
......@@ -4476,6 +4666,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;
}
......@@ -4484,8 +4686,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{
......@@ -4508,6 +4710,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/js/main.bundle.js
+ 1
− 1
View file @ 2a860c26
Source diff could not be displayed: it is too large. Options to address this: view the blob.
main/styleguide/source/_patterns/organisms/header.mustache
+ 41
− 29
View file @ 2a860c26
<!-- Navbar -->
<nav class="navbar-background bg-black xl:duration-200 xl:bg-transparent xl:absolute 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 flag bg-white p-1 main-menu__logo xl:my-2 xl:my-3">
<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="../../images/logo-full-black.svg" alt="">
</a>
<!-- Flex container -->
<div class="grid-container main-menu-grid">
<div class="main-menu grid-content-with-right-side grid justify-between items-center xl:py-6">
<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">
<!-- Hamburger Icon -->
<input class="hidden" type="checkbox" id="menuToggle"/>
<label class="p-3 hamb text-white col-start-2 xl:hidden" for="menuToggle">
<i class="ico--menu text-3xl"></i>
<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>
</label>
<!-- Menu -->
<div class="main-menu__main main-menu-items mt-4 space-x-3 xl:mt-0 2xl:space-x-6 xl:flex">
<a href="#" class="menu-link">Jak pracujeme</a>
<a href="#" class="menu-link">Program</a>
<a href="#" class="menu-link">O nás</a>
<a href="#" class="menu-link">Naloď se</a>
<a href="#" class="menu-link">Kontakty</a>
<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">
<a href="#" class="text-2xl xl:text-base menu-link">Jak pracujeme</a>
<a href="#" class="text-2xl xl:text-base menu-link">Program</a>
<a href="#" class="text-2xl xl:text-base menu-link">O nás</a>
<a href="#" class="text-2xl xl:text-base menu-link">Naloď se</a>
<a href="#" class="text-2xl xl:text-base menu-link">Kontakty</a>
<a href="#" class="text-2xl xl:text-base menu-link">Naloď se</a>
</div>
<!-- Buttons & Social-->
<div class="main-menu__external main-menu-items items-center space-x-1 2xl:space-x-3 xl:flex">
<div class="flex space-x-3 mb-2 xl:mb-0 xl:mr-2">
<a href="" class="text-white hover:no-underline">
<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">
<a href="" class="text-lg xl:text-base text-black xl:text-white hover:no-underline">
<i class="ico--facebook"></i>
</a>
<a href="" class="text-white hover:no-underline">
<a href="" class="text-lg xl:text-base text-black xl:text-white hover:no-underline">
<i class="ico--twitter"></i>
</a>
<a href="" class="text-white hover:no-underline">
<a href="" class="text-lg xl:text-base text-black xl:text-white hover:no-underline">
<i class="ico--instagram"></i>
</a>
</div>
<div class="flex-row flex pb-8 xl:pb-0 gap-4 xl:pr-5">
<a href="#"
class="btn btn--green-500 btn--hoveractive font-condensed uppercase max-w-sm w-full">
<div class="btn__body-wrap h-full">
<div class="btn__body ">Dary</div>
class="btn btn--green-500 btn--hoveractive font-condensed uppercase">
<div class="btn__body-wrap w-32 h-11">
<div class="btn__body w-32 h-11 xl:w-auto">Dary</div>
</div>
</a>
<a href="#"
class="btn btn--violet-500 btn--hoveractive font-condensed uppercase max-w-sm w-full">
<div class="btn__body-wrap h-full">
<div class="btn__body ">Nalodění</div>
class="btn btn--violet-700 btn--hoveractive font-condensed xl:w-auto uppercase">
<div class="btn__body-wrap w-32 h-11">
<div class="btn__body w-32 h-11 xl:w-auto">Nalodění</div>
</div>
</a>
</div>
</div>
</div>
</div>
</nav>
main/styleguide/source/css/organisms/navbar.pcss
+ 28
− 2
View file @ 2a860c26
......@@ -32,7 +32,7 @@
grid-area: main;
.menu-link {
@apply bg-black text-white font-condensed uppercase leading-loose cursor-pointer hover:no-underline xl:text-lg xl:bg-transparent;
@apply bg-white text-black font-condensed uppercase leading-loose cursor-pointer xl:bg-black xl:text-white hover:no-underline xl:text-lg xl:bg-transparent;
}
}
......@@ -53,7 +53,7 @@
}
.main-menu__external {
@apply bg-black text-white;
@apply bg-white text-black xl:bg-black xl:text-white;
grid-area: external;
}
......@@ -74,3 +74,29 @@
width: 260px;
}
}
.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 {
-webkit-transform: rotate(45deg) translate(-9px, 6px);
transform: rotate(-45deg) translate(-9px, 6px);
background-color: black;
}
#menuToggle:checked + label .bar2 {opacity: 0;}
#menuToggle:checked + label .bar3 {
-webkit-transform: rotate(-45deg) translate(-8px, -8px);
transform: rotate(45deg) translate(-8px, -8px);
background-color: black;
}
main/styleguide/tailwind.config.js
+ 5
− 0
View file @ 2a860c26
......@@ -137,6 +137,7 @@ module.exports = {
'400': '#840048',
'500': '#670047',
'600': '#7D337F',
'700': '#7D347D',
},
},
container: {
......@@ -221,6 +222,10 @@ module.exports = {
text: 'black',
background: 'violet.500',
},
'violet-700': {
text: 'black',
background: 'violet.700',
},
'red-600': {
text: 'white',
background: 'red.600',
......
main/templates/main/blocks/news_block.html
+ 1
− 1
View file @ 2a860c26
{% load static %}
{% load wagtailcore_tags wagtailimages_tags shared_filters %}
<div class="bg-cover bg-no-repeat section-clip mb-8 py-16 lg:py-36 lg:mb-16"
style="background-image: url('{% static 'main/images/background-images/bg-join-us.jpg' %}')">
......@@ -15,7 +16,6 @@
{% include 'main/includes/button_animated.html' with btn_link=article_data_list.0.url btn_text="Číst dále" %}
</div>
</div>
<div class="__js-root">
<ui-article-carousel></ui-article-carousel>
</div>
......
main/templates/main/includes/layout/header.html
+ 40
− 29
View file @ 2a860c26
{% load static wagtailcore_tags %}
<!-- Navbar -->
<nav class="navbar-background bg-black xl:duration-200 xl:bg-transparent xl:absolute 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 flag bg-white my-2 p-1 main-menu__logo xl:my-3">
<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">
<div class="main-menu grid-content-with-right-side grid justify-between items-center xl:py-6">
<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">
<!-- Hamburger Icon -->
<input class="hidden" type="checkbox" id="menuToggle"/>
<label class="p-3 hamb text-white col-start-2 xl:hidden" for="menuToggle">
<i class="ico--menu text-3xl"></i>
<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>
</label>
<!-- Menu -->
<div class="main-menu__main main-menu-items space-x-3 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 space-x-1 2xl:space-x-3 xl:flex">
<div class="flex space-x-3 mb-2 xl:mb-0 xl:mr-2">
<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 %}
<a href="{{ social_link_block.value.link }}" class="text-white hover:no-underline">
<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">
<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 }}"
class="btn btn--green-500 btn--hoveractive font-condensed uppercase max-w-sm w-full" target="_blank">
<div class="btn__body-wrap h-full">
<div class="btn__body ">Dary</div>
class="btn btn--green-500 btn--hoveractive font-condensed uppercase" target="_blank">
<div class="btn__body-wrap w-32 h-11">
<div class="btn__body w-32 h-11 xl:w-auto">Dary</div>
</div>
</a>
{% endif %}
{% if page.root_page.contact_newcomers %}
<a href="{{ page.root_page.contact_newcomers }}"
class="btn btn--violet-500 btn--hoveractive font-condensed uppercase max-w-sm w-full" target="_blank">
<div class="btn__body-wrap h-full">
<div class="btn__body ">Nalodění</div>
class="btn btn--violet-700 btn--hoveractive font-condensed xl:w-auto uppercase" target="_blank">
<div class="btn__body-wrap w-32 h-11">
<div class="btn__body w-32 h-11 xl:w-auto ">Nalodění</div>
</div>
</a>
{% endif %}
</div>
</div>
</div>
</div>
</nav>
main/templates/main/includes/menu_item.html
+ 1
− 1
View file @ 2a860c26
{% firstof self.page.url self.link as target %}
<a href="{{ target }}" class="menu-link">
<a href="{{ target }}" class="text-2xl xl:text-base menu-link">
{{ self.title }}
</a>
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please to comment

Pirátský GitLab - Home of the CopyLeft