interkollektives/lichterei-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Design adjustments, new content and more

Browse Source
This commit is contained in:
Bastian Allgeier
2020-12-10 16:10:45 +01:00
parent c378376bc9
commit 4d7b192c94
103 changed files with 1695 additions and 1003 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
site/snippets/blocks/image.php Executable file
View File

@@ -0,0 +1,59 @@
<?php
/*
Snippets are a great way to store code snippets for reuse
or to keep your templates clean.
Block snippets control the HTML for individual blocks
in the blocks field. This image snippet overwrites
Kirby's default image block to add custom classes
and data attributes.
More about snippets:
https://getkirby.com/docs/guide/templates/snippets
*/
$alt = $block->alt();
$caption = $block->caption();
$contain = $block->crop()->isFalse();
$link = $block->link();
$ratio = $block->ratio()->or('auto');
$class = $ratio != 'auto' ? 'img' : 'auto';
$src = null;
$lightbox = $link->isEmpty();
if ($block->location() == 'web') {
$src = $block->src();
} elseif ($image = $block->image()->toFile()) {
$alt = $alt ?? $image->alt();
$src = $image->url();
}
if ($ratio !== 'auto') {
$ratio = Str::split($ratio, '/');
$w = $ratio[0] ?? 1;
$h = $ratio[1] ?? 1;
}
$attrs = attr([
'class' => $class,
'data-contain' => $contain,
'data-lightbox' => $lightbox,
'href' => $link->or($src),
'style' => '--w:' . $w . '; --h:' . $h,
]);
?>
<?php if ($src): ?>
<figure>
<a <?= $attrs ?>>
<img src="<?= $src ?>" alt="<?= $alt ?>">
</a>
<?php if ($caption->isNotEmpty()): ?>
<figcaption class="img-caption">
<?= $caption ?>
</figcaption>
<?php endif ?>
</figure>
<?php endif ?>

24
site/snippets/blocks/video.php Executable file
View File

@@ -0,0 +1,24 @@
<?php
/*
Snippets are a great way to store code snippets for reuse
or to keep your templates clean.
Block snippets control the HTML for individual blocks
in the blocks field. This video snippet overwrites
Kirby's default video block to add custom classes
and style attributes.
More about snippets:
https://getkirby.com/docs/guide/templates/snippets
*/
?>
<?php if ($block->url()->isNotEmpty()): ?>
<figure>
<span class="video" style="--w:16;--h:9">
<?= video($block->url()) ?>
</span>
<?php if ($block->caption()->isNotEmpty()): ?>
<figcaption class="video-caption"><?= $block->caption() ?></figcaption>
<?php endif ?>
</figure>
<?php endif ?>

61
site/snippets/footer.php
View File

@@ -1,26 +1,51 @@
<?php
/**
* Snippets are a great way to store code snippets for reuse or to keep your templates clean.
* in loops or simply to keep your templates clean.
* This footer snippet is reused in all templates. In fetches information from the `site.txt` content file
* and from the `about` page.
* More about snippets: https://getkirby.com/docs/guide/templates/snippets
*/
?>
/*
Snippets are a great way to store code snippets for reuse
or to keep your templates clean.
</div>
This footer snippet is reused in all templates.
More about snippets:
https://getkirby.com/docs/guide/templates/snippets
*/
?>
</main>
<footer class="footer">
<a href="<?= url() ?>">&copy; <?= date('Y') ?> / <?= $site->title() ?></a>
<?php if ($about = page('about')): ?>
<nav class="social">
<?php foreach ($about->social()->toStructure() as $social): ?>
<a href="<?= $social->url() ?>"><?= $social->platform() ?></a>
<?php endforeach ?>
</nav>
<?php endif ?>
<div class="grid">
<div class="column" style="--columns: 8">
<h2><a href="https://getkirby.com">Made with Kirby</a></h2>
<p>
Kirby: the file-based CMS that adapts to any project, loved by developers and editors alike
</p>
</div>
<div class="column" style="--columns: 2">
<h2>Pages</h2>
<ul>
<?php foreach ($site->children()->listed() as $example): ?>
<li><a href="<?= $example->url() ?>"><?= $example->title()->html() ?></a></li>
<?php endforeach ?>
</ul>
</div>
<div class="column" style="--columns: 2">
<h2>Kirby</h2>
<ul>
<li><a href="https://getkirby.com">Website</a></li>
<li><a href="https://getkirby.com/docs">Docs</a></li>
<li><a href="https://forum.getkirby.com">Forum</a></li>
<li><a href="https://chat.getkirby.com">Chat</a></li>
<li><a href="https://github.com/getkirby">GitHub</a></li>
</ul>
</div>
</div>
</footer>
<?= js([
'assets/js/prism.js',
'assets/js/lightbox.js',
'assets/js/index.js',
'@auto'
]) ?>
</body>
</html>

16
site/snippets/gallery.php
View File

@@ -1,12 +1,14 @@
<?php
/**
* Snippets are a great way to store code snippets for reuse or to keep your templates clean.
* in loops or simply to keep your templates clean.
* This gallery snippet is used in the gallery plugin (`/site/plugins/gallery`)
* More about snippets: https://getkirby.com/docs/guide/templates/snippets
*/
?>
/*
Snippets are a great way to store code snippets for reuse
or to keep your templates clean.
This gallery snippet is used in the gallery plugin (`/site/plugins/gallery`)
More about snippets:
https://getkirby.com/docs/guide/templates/snippets
*/
?>
<section class="gallery">
<?php foreach ($gallery->images() as $image): ?>
<figure>

97
site/snippets/header.php
View File

@@ -1,42 +1,87 @@
<?php
/**
* Snippets are a great way to store code snippets for reuse or to keep your templates clean.
* This header snippet is reused in all templates.
* It fetches information from the `site.txt` content file and contains the site navigation.
* More about snippets: https://getkirby.com/docs/guide/templates/snippets
*/
?>
/*
Snippets are a great way to store code snippets for reuse
or to keep your templates clean.
<!doctype html>
This header snippet is reused in all templates.
It fetches information from the `site.txt` content file
and contains the site navigation.
More about snippets:
https://getkirby.com/docs/guide/templates/snippets
*/
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<!-- The title tag we show the title of our site and the title of the current page -->
<?php
/*
In the title tag we show the title of our
site and the title of the current page
*/
?>
<title><?= $site->title() ?> | <?= $page->title() ?></title>
<!-- Stylesheets can be included using the `css()` helper. Kirby also provides the `js()` helper to include script file.
More Kirby helpers: https://getkirby.com/docs/reference/templates/helpers -->
<?= css(['assets/css/index.css', '@auto']) ?>
<?php
/*
Stylesheets can be included using the `css()` helper.
Kirby also provides the `js()` helper to include script file.
More Kirby helpers: https://getkirby.com/docs/reference/templates/helpers
*/
?>
<?= css([
'assets/css/prism.css',
'assets/css/lightbox.css',
'assets/css/index.css',
'@auto'
]) ?>
<?php
/*
The `url()` helper is a great way to create reliable
absolute URLs in Kirby that always start with the
base URL of your site.
*/
?>
<link rel="shortcut icon" type="image/x-icon" href="<?= url('favicon.ico') ?>">
</head>
<body>
<div class="page">
<header class="header">
<!-- In this link we call `$site->url()` to create a link back to the homepage -->
<a class="logo" href="<?= $site->url() ?>"><?= $site->title() ?></a>
<header class="header">
<?php
/*
We use `$site->url()` to create a link back to the homepage
for the logo and `$site->title()` as a temporary logo. You
probably want to replace this with an SVG.
*/
?>
<a class="logo" href="<?= $site->url() ?>">
<?= $site->title() ?>
</a>
<nav id="menu" class="menu">
<?php
// In the menu, we only fetch listed pages, i.e. the pages that have a prepended number in their foldername
// We do not want to display links to unlisted `error`, `home`, or `sandbox` pages
// More about page status: https://getkirby.com/docs/reference/panel/blueprints/page#statuses
foreach ($site->children()->listed() as $item): ?>
<?= $item->title()->link() ?>
<?php endforeach ?>
</nav>
</header>
<nav class="menu">
<?php
/*
In the menu, we only fetch listed pages,
i.e. the pages that have a prepended number
in their foldername.
We do not want to display links to unlisted
`error`, `home`, or `sandbox` pages.
More about page status:
https://getkirby.com/docs/reference/panel/blueprints/page#statuses
*/
?>
<?php foreach ($site->children()->listed() as $item): ?>
<a <?php e($item->isOpen(), 'aria-current ') ?> href="<?= $item->url() ?>"><?= $item->title()->html() ?></a>
<?php endforeach ?>
<?php snippet('social') ?>
</nav>
</header>
<main class="main">

27
site/snippets/intro.php
View File

@@ -1,13 +1,20 @@
<?php
/**
* Snippets are a great way to store code snippets for reuse or to keep your templates clean.
* in loops or simply to keep your templates clean.
* This intro snippet is reused in multiple templates. While it does not contain much code,
* it helps to keep your code DRY and thus facilitate maintenance when you have to make changes.
* More about snippets: https://getkirby.com/docs/guide/templates/snippets
*/
?>
/*
Snippets are a great way to store code snippets for reuse
or to keep your templates clean.
<header class="intro">
<h1><?= $page->title() ?></h1>
This intro snippet is reused in multiple templates.
While it does not contain much code, it helps to keep your
code DRY and thus facilitate maintenance when you have
to make changes.
More about snippets:
https://getkirby.com/docs/guide/templates/snippets
*/
?>
<header class="h1">
<h1><?= $page->headline()->or($page->title())->html() ?></h1>
<?php if ($page->subheadline()->isNotEmpty()): ?>
<p class="color-grey"><?= $page->subheadline()->html() ?></p>
<?php endif ?>
</header>

23
site/snippets/layouts.php Executable file
View File

@@ -0,0 +1,23 @@
<?php
/*
Snippets are a great way to store code snippets for reuse
or to keep your templates clean.
This layouts snippet renders the content of a layout
field with our custom grid system.
More about snippets:
https://getkirby.com/docs/guide/templates/snippets
*/
?>
<?php foreach ($field->toLayouts() as $layout): ?>
<section class="grid margin-xl" id="<?= $layout->id() ?>" style="--gutter: 1.5rem">
<?php foreach ($layout->columns() as $column): ?>
<div class="column" style="--columns:<?= $column->span() ?>">
<div class="text">
<?= $column->blocks() ?>
</div>
</div>
<?php endforeach ?>
</section>
<?php endforeach ?>

30
site/snippets/note.php Executable file
View File

@@ -0,0 +1,30 @@
<?php
/*
Snippets are a great way to store code snippets for reuse
or to keep your templates clean.
The note snippet renders an excerpt of a blog article.
More about snippets:
https://getkirby.com/docs/guide/templates/snippets
*/
?>
<article class="note-excerpt">
<a href="<?= $note->url() ?>">
<header>
<figure class="img" style="--w: 16; --h:9">
<?php if ($cover = $note->cover()): ?>
<?= $cover->crop(320, 180) ?>
<?php endif ?>
</figure>
<h2 class="note-excerpt-title"><?= $note->title() ?></h2>
<time class="note-excerpt-date" datetime="<?= $note->published('c') ?>"><?= $note->published() ?></time>
</header>
<?php if (($excerpt ?? true) !== false): ?>
<div class="note-excerpt-text">
<?= $note->text()->toBlocks()->excerpt(280) ?>
</div>
<?php endif ?>
</a>
</article>

26
site/snippets/pagination.php Executable file
View File

@@ -0,0 +1,26 @@
<?php
/*
Snippets are a great way to store code snippets for reuse
or to keep your templates clean.
The pagination snippet renders prev/next links in the
blog, when articles spread across multiple pages
More about snippets:
https://getkirby.com/docs/guide/templates/snippets
*/
?>
<?php if ($pagination->hasPages()): ?>
<nav class="pagination">
<?php if ($pagination->hasPrevPage()): ?>
<a class="pagination-prev" href="<?= $pagination->prevPageUrl() ?>">&larr;</a>
<?php else: ?>
<span class="pagination-prev">&larr;</span>
<?php endif ?>
<?php if ($pagination->hasNextPage()): ?>
<a class="pagination-next" href="<?= $pagination->nextPageUrl() ?>">&rarr;</a>
<?php else: ?>
<span class="pagination-next">&rarr;</span>
<?php endif ?>
</nav>
<?php endif ?>

27
site/snippets/prevnext.php Executable file
View File

@@ -0,0 +1,27 @@
<?php
/*
Snippets are a great way to store code snippets for reuse
or to keep your templates clean.
The prevnext snippet renders the nice "keep on reading"
section below each article in the blog, to jump between
articles. It reuses the note snippet to render a full
excerpt of the article.
More about snippets:
https://getkirby.com/docs/guide/templates/snippets
*/
?>
<nav class="blog-prevnext">
<h2 class="h2">Keep on reading</h2>
<div class="autogrid" style="--gutter: 1.5rem">
<?php if ($prev = $page->prevListed()): ?>
<?php snippet('note', ['note' => $prev, 'excerpt' => false]) ?>
<?php endif ?>
<?php if ($next = $page->nextListed()): ?>
<?php snippet('note', ['note' => $next, 'excerpt' => false]) ?>
<?php endif ?>
</div>
</nav>

24
site/snippets/social.php Executable file
View File

@@ -0,0 +1,24 @@
<?php
/*
Snippets are a great way to store code snippets for reuse
or to keep your templates clean.
In this snippet the svg() helper is a great way to embed SVG
code directly in your HTML. Pass the path to your SVG
file to load it.
More about snippets:
https://getkirby.com/docs/guide/templates/snippets
*/
?>
<span class="social">
<a href="https://twitter.com/getkirby">
<?= svg('assets/icons/twitter.svg') ?>
</a>
<a href="https://chat.getkirby.com">
<?= svg('assets/icons/discord.svg') ?>
</a>
<a href="https://instagram.com/getkirby">
<?= svg('assets/icons/instagram.svg') ?>
</a>
</span>