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

Add pirate center page

parent 69264835
No related branches found
No related tags found
No related merge requests found
Pipeline #757 passed
Stage: build
Expand all Hide whitespace changes
Inline Side-by-side
Showing
with 192 additions and 39 deletions
package.json
+ 1
− 0
View file @ c5341509
...@@ -43,6 +43,7 @@ ...@@ -43,6 +43,7 @@
"devDependencies": { "devDependencies": {
"@fullhuman/postcss-purgecss": "^1.3.0", "@fullhuman/postcss-purgecss": "^1.3.0",
"autoprefixer": "^9.5.1", "autoprefixer": "^9.5.1",
"color": "^3.1.2",
"gulp-postcss": "^8.0.0", "gulp-postcss": "^8.0.0",
"gulp-rename": "^2.0.0", "gulp-rename": "^2.0.0",
"postcss-assets": "^5.0.0", "postcss-assets": "^5.0.0",
......
source/_meta/_00-head.mustache
+ 18
− 18
View file @ c5341509
<!DOCTYPE html> <!DOCTYPE html>
<html class="{{ htmlClass }}"> <html class="{{ htmlClass }}">
<head> <head>
<title>{{ title }}</title> <title>{{ title }}</title>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width" /> <meta name="viewport" content="width=device-width" />
<link rel="stylesheet" href="../../css/style.pkgd.css?{{ cacheBuster }}" media="all" /> <link rel="stylesheet" href="../../css/style.pkgd.css?{{ cacheBuster }}" media="all" />
<link rel="stylesheet" href="../../css/pattern-scaffolding.css?{{ cacheBuster }}" media="all" /> <link rel="stylesheet" href="../../css/pattern-scaffolding.css?{{ cacheBuster }}" media="all" />
<script src="https://kit.fontawesome.com/cbdc6198f3.js" crossorigin="anonymous"></script> <script src="https://kit.fontawesome.com/cbdc6198f3.js" crossorigin="anonymous"></script>
<!-- Begin Pattern Lab (Required for Pattern Lab to run properly) --> <!-- Begin Pattern Lab (Required for Pattern Lab to run properly) -->
{{{ patternLabHead }}} {{{ patternLabHead }}}
<!-- End Pattern Lab --> <!-- End Pattern Lab -->
</head> </head>
<body class="{{ bodyClass }}"> <body class="{{ bodyClass }}">
source/_patterns/00-atoms/00-global/02-utility-colors.mustache
+ 7
− 0
View file @ c5341509
...@@ -6,4 +6,11 @@ ...@@ -6,4 +6,11 @@
<p>#d6151b</p> <p>#d6151b</p>
</div> </div>
</div> </div>
<div class="card flex flex-col">
<div class="h-32 bg-red-200"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">Red 200</p>
<p>#d6151b</p>
</div>
</div>
</div> </div>
source/_patterns/00-atoms/03-buttons/02-button-colors.mustache
+ 2
− 0
View file @ c5341509
...@@ -6,6 +6,7 @@ ...@@ -6,6 +6,7 @@
{{> atoms-basic-button(classes: "btn--white") }} {{> atoms-basic-button(classes: "btn--white") }}
{{> atoms-basic-button(classes: "btn--white btn--fading") }} {{> atoms-basic-button(classes: "btn--white btn--fading") }}
{{> atoms-basic-button(classes: "btn--green-100") }} {{> atoms-basic-button(classes: "btn--green-100") }}
{{> atoms-basic-button(classes: "btn--red-100") }}
</div> </div>
<div class="inline-flex flex-col space-y-2"> <div class="inline-flex flex-col space-y-2">
{{> atoms-icon-button(classes: "btn--black") }} {{> atoms-icon-button(classes: "btn--black") }}
...@@ -14,5 +15,6 @@ ...@@ -14,5 +15,6 @@
{{> atoms-icon-button(classes: "btn--white") }} {{> atoms-icon-button(classes: "btn--white") }}
{{> atoms-icon-button(classes: "btn--white btn--fading") }} {{> atoms-icon-button(classes: "btn--white btn--fading") }}
{{> atoms-icon-button(classes: "btn--green-100") }} {{> atoms-icon-button(classes: "btn--green-100") }}
{{> atoms-icon-button(classes: "btn--red-100") }}
</div> </div>
</div> </div>
source/_patterns/00-atoms/03-buttons/04-button-with-hover-effect.mustache
+ 2
− 0
View file @ c5341509
...@@ -6,6 +6,7 @@ ...@@ -6,6 +6,7 @@
{{> atoms-basic-button(classes: "btn--white btn--hoveractive") }} {{> atoms-basic-button(classes: "btn--white btn--hoveractive") }}
{{> atoms-basic-button(classes: "btn--white btn--fading btn--hoveractive") }} {{> atoms-basic-button(classes: "btn--white btn--fading btn--hoveractive") }}
{{> atoms-basic-button(classes: "btn--green-100 btn--hoveractive") }} {{> atoms-basic-button(classes: "btn--green-100 btn--hoveractive") }}
{{> atoms-basic-button(classes: "btn--red-100 btn--hoveractive") }}
</div> </div>
<div class="inline-flex flex-col space-y-2"> <div class="inline-flex flex-col space-y-2">
{{> atoms-icon-button(classes: "btn--black btn--hoveractive") }} {{> atoms-icon-button(classes: "btn--black btn--hoveractive") }}
...@@ -14,5 +15,6 @@ ...@@ -14,5 +15,6 @@
{{> atoms-icon-button(classes: "btn--white btn--hoveractive") }} {{> atoms-icon-button(classes: "btn--white btn--hoveractive") }}
{{> atoms-icon-button(classes: "btn--white btn--fading btn--hoveractive") }} {{> atoms-icon-button(classes: "btn--white btn--fading btn--hoveractive") }}
{{> atoms-icon-button(classes: "btn--green-100 btn--hoveractive") }} {{> atoms-icon-button(classes: "btn--green-100 btn--hoveractive") }}
{{> atoms-icon-button(classes: "btn--red-100 btn--hoveractive") }}
</div> </div>
</div> </div>
source/_patterns/01-molecules/00-badge/condensed-badge-no-occupation.mustache 0 → 100644
+ 1
− 0
View file @ c5341509
{{> molecules-condensed-badge(hideOccupation: true) }}
source/_patterns/01-molecules/00-badge/condensed-badge.mustache
+ 5
− 1
View file @ c5341509
<div class="badge badge--condensed {{ classes }}"> <div class="badge badge--condensed {{ classes }}">
{{> atoms-basic-avatar(classes: "avatar--sm") }} {{> atoms-basic-avatar(classes: "avatar--sm") }}
<div class="badge__body"> <div class="badge__body">
<span class="head-xs badge__title">Mikuláš Peksa</span> <span class="head-heavy-xs badge__title">{{ person.first }} {{ person.last }}</span>
{{^ hideOccupation }}
<p class="badge__occupation">{{ occupation }}{{^ occupation }}{{ person.occupation }}{{/ occupation }}</p>
{{/ hideOccupation }}
{{> atoms-responsive-contact-line(icon: "fas fa-phone", caption: "+420 777 123 123", classes: "badge__link") }}
{{> atoms-responsive-contact-line(icon: "fas fa-envelope", classes: "badge__link") }} {{> atoms-responsive-contact-line(icon: "fas fa-envelope", classes: "badge__link") }}
</div> </div>
</div> </div>
source/_patterns/01-molecules/calendar/calendar-table-row.mustache
+ 1
− 1
View file @ c5341509
<div class="grid grid-cols-12 items-center calendar-table-row"> <div class="grid grid-cols-12 items-center calendar-table-row {{ classes }}">
<div class="col-span-2 text-red-100 head-alt-md calendar-table-row__col"><span>10.</span></div> <div class="col-span-2 text-red-100 head-alt-md calendar-table-row__col"><span>10.</span></div>
<div class="col-span-8 grid grid-cols-3 calendar-table-row__col"> <div class="col-span-8 grid grid-cols-3 calendar-table-row__col">
<div class="col-span-3 md:col-span-1"> <div class="col-span-3 md:col-span-1">
......
source/_patterns/02-organisms/00-global/footer.mustache
+ 3
− 3
View file @ c5341509
...@@ -102,9 +102,9 @@ ...@@ -102,9 +102,9 @@
<section class="footer-section bg-black"> <section class="footer-section bg-black">
<div class="container container--default"> <div class="container container--default">
<div class="footer-contacts"> <div class="footer-contacts">
{{> molecules-condensed-badge(classes: "footer-contacts__item") }} {{> molecules-condensed-badge(classes: "footer-contacts__item", hideOccupation: true) }}
{{> molecules-condensed-badge(classes: "footer-contacts__item") }} {{> molecules-condensed-badge(classes: "footer-contacts__item", hideOccupation: true) }}
{{> molecules-condensed-badge(classes: "footer-contacts__item") }} {{> molecules-condensed-badge(classes: "footer-contacts__item", hideOccupation: true) }}
<div class="mt-8 lg:mt-0 lg:text-right footer-contacts__item"> <div class="mt-8 lg:mt-0 lg:text-right footer-contacts__item">
{{> atoms-basic-button(cta: "Kontakt", classes: "btn--white btn--hoveractive btn--fullwidth md:btn--autowidth text-lg btn--fading") }} {{> atoms-basic-button(cta: "Kontakt", classes: "btn--white btn--hoveractive btn--fullwidth md:btn--autowidth text-lg btn--fading") }}
</div> </div>
......
source/_patterns/03-templates/pirate-center.mustache 0 → 100644
+ 103
− 0
View file @ c5341509
{{> organisms-header }}
<aside
class="hero hero--image py-16 {{ classes }}"
style="--image-url: url({{ img.landscape-16x9-fullhd.src }})"
>
<div class="container container--default">
<h1 class="head-alt-md md:head-alt-lg max-w-2xl">
Zbrusu nové krajské<br />pirátské centrum!
</h1>
<h2 class="head-xs mt-2">
V Pardubicích jsme otevřeli nové pirátské centrum pod zkratkou ParduPiCe
</h2>
</div>
</aside>
<div class="container container--default py-16">
<article>
<div class="lg:flex lg:space-x-8 xl:space-x-16">
<div class="lg:w-3/5 xl:w-2/3 content-block">
<h2>Cowork</h2>
<p>
Pirátské centrum nabízí bezplatný prostor pro coworking, tedy sdílenou
kancelář. K dispozici jsou 4 pracovní místa a sdílená konferenční
místnost s projektorem. Samozřejmostí je připojení k internetu a
možnost tisku. Není problém domluvit i dlouhodobé využívání sdílené
kanceláře, v takovém případě velmi oceníme účelový dar na provoz
centra.
</p>
{{> atoms-icon-button(cta: "Provozní řád", icon: "fas fa-chevron-right", classes: "btn--black btn--hoveractive btn--fullwidth md:btn--autowidth") }}
<h2>Chci podpořit provoz</h2>
<p>
Pokud chcete ParduPiCe podpořit, můžete nám poslat účelový dar na jeho provoz převodem na účet. Pro platbu použijte následující údaje:
</p>
<table class="w-full">
<tbody>
<tr>
<td class="font-bold">Číslo transparentního účtu</td>
<td>2100048174/2010</td>
</tr>
<tr>
<td class="font-bold">Specifický symbol</td>
<td>400802</td>
</tr>
</tbody>
</table>
<h2>Dětský koutek</h2>
<p>Pro rodiče nabízíme vybavený dětský koutek s pracovním místem. Dětský koutek je vybaven hračkami pro děti všech věkových kategorií.</p>
<h2>Pořádání akcí</h2>
<p>V rámci pirátského centra probíhají akce všeho druhu:</p>
<ul>
<li>Přednášky</li>
<li>Vzdělávací akce</li>
<li>Workshopy</li>
<li>Přednášky</li>
<li>Kulturní akce</li>
</ul>
<p>Máte námět na vlastní akci? Dejte nám vědět. ParduPiCe je zdarma k dispozici pro akce nekomerční povahy.</p>
<h2>Kalendář akcí</h2>
<p>
{{> molecules-calendar-table-row(classes: "calendar-table-row--standalone") }}
{{> molecules-calendar-table-row(classes: "calendar-table-row--standalone") }}
{{> molecules-calendar-table-row(classes: "calendar-table-row--standalone") }}
{{> molecules-calendar-table-row(classes: "calendar-table-row--standalone") }}
</p>
{{> atoms-icon-button(cta: "Další akce", icon: "fas fa-chevron-right", classes: "btn--red-100 btn--hoveractive btn--fullwidth md:btn--autowidth") }}
</div>
<div class="pt-8 lg:w-2/5 xl:w-1/3 lg:pt-0">
<div class="card elevation-10">
<div class="card__body content-block">
<h2>Kde to najdu?</h2>
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d82007.99920528589!2d15.688131074078123!3d50.034780639742856!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x470dc94b239307b5%3A0x12d59894ccf624ae!2sPardubice!5e0!3m2!1scs!2scz!4v1589382658695!5m2!1scs!2scz" width="100%" height="300" id="mapa-mobile" frameborder="0" style="border:0;" allowfullscreen="" aria-hidden="false" tabindex="0"></iframe>
<p>
Pardubické pirátské centrum<br>
Budova T-STRING<br>
Masarykovo náměstí 1484<br>
530 02 Pardubice I
</p>
<p><small>Vstup do pirátského centra naleznete z boku budovy T-STRING naproti „AFI paláci“, vedle kadeřnictví. Vchod je v prostoru vjezdu na parkoviště ve vnitrobloku.</small></p>
<hr>
<h2>Kontakt</h2>
{{> molecules-condensed-badge(occupation: "Správce coworku")}}
{{> molecules-condensed-badge(occupation: "Produkce a program akcí", classes: "mt-4")}}
</div>
</div>
<div class="flex flex-col pt-16 space-y-8">
{{> atoms-super-button(cta: "Sledujte nás na Facebooku", icon: "fab fa-facebook", classes: "bg-brands-facebook text-white w-full") }}
{{> atoms-super-button(cta: "Sledujte naše fórum", icon: "fa fa-comments", classes: "bg-black text-white w-full") }}
</div>
</div>
</div>
</article>
</div>
{{> organisms-footer }}
source/css/atoms/button.pcss
+ 11
− 0
View file @ c5341509
...@@ -139,6 +139,17 @@ ...@@ -139,6 +139,17 @@
} }
} }
.btn.btn--red-100 {
.btn__body,
.btn__icon {
@apply bg-red-100 text-white;
}
.btn__icon {
@apply border-red-200;
}
}
.btn.btn--white { .btn.btn--white {
.btn__body, .btn__body,
.btn__icon { .btn__icon {
......
source/css/atoms/figure.pcss
+ 2
− 1
View file @ c5341509
.figure { .figure,
.content-block figure {
@apply relative; @apply relative;
img { img {
......
source/css/atoms/list.pcss
+ 6
− 3
View file @ c5341509
.ordered-list { .ordered-list,
.content-block ol {
@apply pl-4; @apply pl-4;
} }
.unordered-list { .unordered-list,
.content-block ul {
li { li {
@apply relative flex items-center; @apply relative flex items-center;
...@@ -36,6 +38,7 @@ ...@@ -36,6 +38,7 @@
} }
} }
.ordered-list { .ordered-list,
.content-block ol {
@apply list-decimal; @apply list-decimal;
} }
source/css/atoms/paragraph.pcss
+ 2
− 1
View file @ c5341509
.para { .para,
.content-block p {
@apply font-body font-normal leading-normal; @apply font-body font-normal leading-normal;
} }
source/css/atoms/quotation.pcss
+ 2
− 1
View file @ c5341509
.quote { .quote,
.content-block blockquote {
@apply italic leading-relaxed border-l-2 border-black pl-4 py-2 ml-6; @apply italic leading-relaxed border-l-2 border-black pl-4 py-2 ml-6;
width: 80%; width: 80%;
......
source/css/atoms/table.pcss
+ 6
− 3
View file @ c5341509
.table { .table,
.content-block table {
th, th,
thead td, thead td,
td { td {
...@@ -11,13 +12,15 @@ ...@@ -11,13 +12,15 @@
} }
} }
.table--striped { .table--striped,
.content-block table {
tr:nth-child(even) td { tr:nth-child(even) td {
@apply bg-grey-100; @apply bg-grey-100;
} }
} }
.table--bordered { .table--bordered,
.content-block table {
th, th,
thead td { thead td {
@apply border border-grey-500; @apply border border-grey-500;
......
source/css/molecules/badge.pcss
+ 8
− 4
View file @ c5341509
...@@ -15,15 +15,19 @@ ...@@ -15,15 +15,19 @@
.badge__link { .badge__link {
@apply text-sm font-light block w-full; @apply text-sm font-light block w-full;
&:not(:first-child) {
@apply pt-1;
}
} }
} }
.badge.badge--condensed { .badge.badge--condensed {
.badge__title {
@apply mb-2;
}
.badge__body { .badge__body {
@apply ml-4; @apply ml-4;
} }
.badge__occupation {
@apply uppercase text-sm max-w-sm my-0;
}
} }
source/css/molecules/calendar.pcss
+ 5
− 1
View file @ c5341509
.calendar-table-row { .calendar-table-row {
@apply border-b border-grey-150; @apply border-b border-grey-150;
&:first-child { &:first-of-type {
@apply border-t; @apply border-t;
} }
} }
.calendar-table-row--standalone {
@apply border-l;
}
.calendar-table-row__col { .calendar-table-row__col {
@apply h-full border-r border-grey-150 p-2 flex justify-center items-center; @apply h-full border-r border-grey-150 p-2 flex justify-center items-center;
......
source/css/molecules/content-block.pcss
+ 6
− 1
View file @ c5341509
...@@ -50,11 +50,16 @@ ...@@ -50,11 +50,16 @@
@apply font-bold; @apply font-bold;
} }
small {
@apply text-sm;
}
ul, ul,
ol, ol,
table, table,
blockquote, blockquote,
figure { figure,
iframe {
&:not(:first-child) { &:not(:first-child) {
margin-top: 1em; margin-top: 1em;
} }
......
source/dist/style.pkgd.css
+ 1
− 1
View file @ c5341509
This diff is collapsed.
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