Skip to content
Snippets Groups Projects
Commit 2ae6acc9 authored by xaralis's avatar xaralis
Browse files

feat: adjust cf2021 layout, adjust -alt head lineheight

parent 87fedaa2
No related branches found
Tags 2.0.1
No related merge requests found
Pipeline #1922 passed
Stage: build
Hide whitespace changes
Inline Side-by-side
source/_patterns/03-templates/cf2021/anonymous.mustache
+ 4
− 7
View file @ 2ae6acc9
{{> organisms-simplified-navbar-with-actions }}
<article class="container container--wide pt-8 lg:py-24 cf2021">
<div class="cf2021__title flex justify-between">
<h1 class="head-alt-md lg:head-alt-lg mb-0">Bod č. 1: Programové priority Pirátské strany pro sněmovní volby 2021</h1>
</div>
<section class="cf2021__video space-y-8">
<div class="flex items-center justify-between mb-4 lg:mb-8">
<h1 class="head-alt-md lg:head-alt-lg mb-0">Bod č. 1: Programové priority Pirátské strany pro sněmovní volby 2021</h1>
</div>
<div class="container-padding--zero md:container-padding--auto">
<div class="iframe-container">
<iframe width="100%" height="500" src="https://www.youtube.com/embed/73jJLspL8o8" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
......@@ -19,10 +20,6 @@
<section class="cf2021__notifications">
<div class="lg:card lg:elevation-10">
<div class="lg:card__body pb-2 lg:py-6">
<h2 class="head-heavy-sm">Oznámení</h2>
</div>
<div class="container-padding--zero lg:container-padding--auto">
{{> organisms-event-feed(itemPadding: "px-4 py-2 lg:px-8 lg:py-3") }}
</div>
......
source/_patterns/03-templates/cf2021/chairman.mustache
+ 17
− 21
View file @ 2ae6acc9
{{> organisms-simplified-navbar-with-avatar }}
<article class="container container--wide pt-8 lg:py-24 cf2021">
<section class="cf2021__video space-y-8">
<div class="flex items-center justify-between mb-4 lg:mb-8">
<h1 class="head-alt-md lg:head-alt-lg mb-0">Bod č. 1: Programové priority Pirátské strany pro sněmovní volby 2021</h1>
<div class="dropdown dropdown--right mt-4">
<i class="ico--dots-three-vertical cursor-pointer pl-2 text-lg"></i>
<ul class="dropdown__content whitespace-no-wrap">
<li class="dropdown__content-item bg-white hover:bg-grey-125">
<a class="block px-3 py-3" href="#"><i class="ico--pencil mr-2"></i>Přejmenovat bod programu</a>
</li>
<li class="dropdown__content-item bg-white hover:bg-grey-125">
<a class="block px-3 py-3" href="#" id="js-end-discussion"><i class="ico--bubbles mr-2"></i>Ukončit rozpravu</a>
</li>
<li class="dropdown__content-item bg-white hover:bg-grey-125">
<a class="block px-3 py-3" href="#"><i class="ico--switch mr-2"></i>Ukončit bod programu</a>
</li>
</ul>
</div>
<div class="cf2021__title flex justify-between">
<h1 class="head-alt-md lg:head-alt-lg mb-0">Bod č. 1: Programové priority Pirátské strany pro sněmovní volby 2021</h1>
<div class="dropdown dropdown--right pl-4 pt-1 lg:pt-5">
<i class="ico--dots-three-vertical cursor-pointer pl-2 text-lg"></i>
<ul class="dropdown__content whitespace-no-wrap">
<li class="dropdown__content-item bg-white hover:bg-grey-125">
<a class="block px-3 py-3" href="#"><i class="ico--pencil mr-2"></i>Přejmenovat bod programu</a>
</li>
<li class="dropdown__content-item bg-white hover:bg-grey-125">
<a class="block px-3 py-3" href="#" id="js-end-discussion"><i class="ico--bubbles mr-2"></i>Ukončit rozpravu</a>
</li>
<li class="dropdown__content-item bg-white hover:bg-grey-125">
<a class="block px-3 py-3" href="#"><i class="ico--switch mr-2"></i>Ukončit bod programu</a>
</li>
</ul>
</div>
</div>
<section class="cf2021__video space-y-8">
<div class="container-padding--zero md:container-padding--auto">
<div class="iframe-container">
<iframe width="100%" height="500" src="https://www.youtube.com/embed/73jJLspL8o8" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
......@@ -34,10 +34,6 @@
<section class="cf2021__notifications">
<div class="lg:card lg:elevation-10">
<div class="lg:card__body pb-2 lg:py-6">
<h2 class="head-heavy-sm">Oznámení</h2>
</div>
<div class="container-padding--zero lg:container-padding--auto">
{{> organisms-event-feed-with-action-menu(itemPadding: "px-4 py-2 lg:px-8 lg:py-3") }}
</div>
......
source/_patterns/03-templates/cf2021/user.mustache
+ 4
− 8
View file @ 2ae6acc9
{{> organisms-simplified-navbar-with-avatar }}
<article class="container container--wide pt-8 lg:py-24 cf2021">
<section class="cf2021__video space-y-8">
<div class="flex items-center justify-between mb-4 lg:mb-8">
<h1 class="head-alt-md lg:head-alt-lg mb-0">Bod č. 1: Programové priority Pirátské strany pro sněmovní volby 2021</h1>
</div>
<div class="cf2021__title flex justify-between">
<h1 class="head-alt-md lg:head-alt-lg mb-0">Bod č. 1: Programové priority Pirátské strany pro sněmovní volby 2021</h1>
</div>
<section class="cf2021__video space-y-8">
<div class="container-padding--zero md:container-padding--auto">
<div class="iframe-container">
<iframe width="100%" height="500" src="https://www.youtube.com/embed/73jJLspL8o8" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
......@@ -20,10 +20,6 @@
<section class="cf2021__notifications">
<div class="lg:card lg:elevation-10">
<div class="lg:card__body pb-2 lg:py-6">
<h2 class="head-heavy-sm">Oznámení</h2>
</div>
<div class="container-padding--zero lg:container-padding--auto">
{{> organisms-event-feed(itemPadding: "px-4 py-2 lg:px-8 lg:py-3") }}
</div>
......
source/css/atoms/heading.pcss
+ 16
− 8
View file @ 2ae6acc9
......@@ -3,7 +3,8 @@
}
.h-alt {
@apply font-alt font-normal leading-negative;
@apply font-alt font-normal;
line-height: 0.96;
}
.h-allcaps {
......@@ -14,37 +15,44 @@
@responsive {
.head-alt-xl,
.content-block .head-alt-xl {
@apply text-7xl font-alt font-normal leading-negative;
@apply text-7xl font-alt font-normal;
line-height: 0.96;
}
.head-alt-lg,
.content-block .head-alt-lg {
@apply text-6xl font-alt font-normal leading-negative;
@apply text-6xl font-alt font-normal;
line-height: 0.96;
}
.head-alt-md,
.content-block .head-alt-md {
@apply text-4xl font-alt font-normal leading-negative;
@apply text-4xl font-alt font-normal;
line-height: 0.96;
}
.head-alt-base,
.content-block .head-alt-base {
@apply text-3xl font-alt font-normal leading-negative;
@apply text-3xl font-alt font-normal;
line-height: 0.96;
}
.head-alt-sm,
.content-block .head-alt-sm {
@apply text-2xl font-alt font-normal leading-negative;
@apply text-2xl font-alt font-normal;
line-height: 0.96;
}
.head-alt-xs,
.content-block .head-alt-xs {
@apply text-xl font-alt font-normal leading-negative;
@apply text-xl font-alt font-normal;
line-height: 0.96;
}
.head-alt-2xs,
.content-block .head-alt-2xs {
@apply text-lg font-alt font-normal leading-negative;
@apply text-lg font-alt font-normal;
line-height: 0.96;
}
......
source/css/templates/cf2021.pcss
+ 8
− 3
View file @ 2ae6acc9
.cf2021 {
@apply grid gap-8;
grid-template-areas: "video"
grid-template-areas: "title"
"video"
"notifications"
"posts";
@screen lg {
grid-template-areas: "video notifications"
grid-template-areas: "title title"
"video notifications"
"posts notifications";
grid-template-rows: auto auto 1fr;
grid-template-rows: auto auto auto 1fr;
grid-template-columns: theme("width.7/12") 1fr;
}
......@@ -18,6 +20,9 @@
}
}
.cf2021__title {
grid-area: title;
}
.cf2021__video {
grid-area: video;
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Pirátský GitLab - Home of the CopyLeft