marvin/schnittfest
1
0
Fork 0
mirror of https://github.com/Kugelschieber/schnittfest.git synced 2026-11-12 09:02:01 +01:00
Code Issues Packages Projects Releases Wiki Activity

New design.

Browse Source
This commit is contained in:
marvin
2026-10-14 19:29:31 +02:00
parent 047adf7b92
commit 6e60f1c117
51 changed files with 2598 additions and 2606 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tpl/end.html
+1
View File
@@ -1,2 +1,3 @@
{{ adminBody .Page }}
</body>
</html>
tpl/footer.html
+32 -109
View File
@@ -1,111 +1,34 @@
<footer id="footer">
<div class="container">
<ul>
<li>© 2024 Schnittfest GmbH</li>
<li>
<a href="tel:+49017693124984">+49 176 93124984</a>
</li>
<li>
<a href="mailto:hi@schnitffest.gmbh">hi@schnittfest.gmbh</a>
</li>
<li>
<a href="https://instagram.com/schnittfest.gmbh">Instagram</a>
</li>
<li>
<a href="https://vimeo.com/schnittfest">Vimeo</a>
</li>
<li>
<a href="/agb" target="_blank">AGB</a>
</li>
<li>
<a href="/impressum" target="_blank">Impressum</a>
</li>
</ul>
{{- $headline := default (copy .Page .Content "headline") "Und… Action?" -}}
{{- $text := default (copy .Page .Content "text") "Erzähl uns von deiner Idee – wir machen einen Film daraus." -}}
{{- $email := default (get .Content "email") "hi@schnittfest.gmbh" -}}
{{- $phone := default (get .Content "phone") "+49 176 93124984" -}}
{{- $instagram := default (get .Content "instagram") "https://instagram.com/schnittfest.gmbh" -}}
{{- $vimeo := default (get .Content "vimeo") "https://vimeo.com/schnittfest" -}}
{{- $copyright := default (copy .Page .Content "copyright") "Schnittfest GmbH" -}}
<footer class="footer" id="footer" data-shifu-element="{{ .Content.Position }}">
<div class="footer__inner">
<div class="footer__cta" data-component="reveal">
<h2 class="footer__headline">{{ $headline }}</h2>
<p class="footer__text">{{ $text }}</p>
<a class="button button--yellow footer__mail" href="mailto:{{ $email }}">
<span class="button__play" aria-hidden="true"></span>{{ $email }}
</a>
</div>
<dl class="credits" data-component="reveal">
<div class="credits__row"><dt>Telefon</dt><dd><a href="tel:{{ $phone | replace " " "" }}">{{ $phone }}</a></dd></div>
<div class="credits__row"><dt>E-Mail</dt><dd><a href="mailto:{{ $email }}">{{ $email }}</a></dd></div>
<div class="credits__row"><dt>Instagram</dt><dd><a href="{{ $instagram }}" target="_blank" rel="noopener">schnittfest.gmbh</a></dd></div>
<div class="credits__row"><dt>Vimeo</dt><dd><a href="{{ $vimeo }}" target="_blank" rel="noopener">schnittfest</a></dd></div>
</dl>
<div class="footer__bottom">
<span>© {{ year }} {{ $copyright }}</span>
<span class="footer__legal">
<a href="/agb">AGB</a>
<a href="/impressum">Impressum</a>
</span>
</div>
</div>
</footer>
<script type="text/javascript" src="https://player.vimeo.com/api/player.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.0.4/gsap.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.7/ScrollMagic.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.7/plugins/animation.gsap.min.js"></script>
<script type="text/javascript" src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<script type="text/javascript" src="https://cdn.lightwidget.com/widgets/lightwidget.js"></script>
<script type="text/javascript" src="static/js/color.js"></script>
<script type="text/javascript" src="static/js/parts.js"></script>
<script>
AOS.init({
duration: 1000,
easing: "cubic-bezier(0.4, 0.0, 0.2, 1)",
once: true,
offset: 32
});
// navbar mobile menu
let mobileMenu = document.getElementById("mobileMenu");
let mobileMenuOpen = document.getElementById("mobileMenuOpen");
let mobileMenuClose = document.getElementById("mobileMenuClose");
function toggleMobileMenu() {
let hidden = mobileMenu.style.display;
if(hidden) {
mobileMenu.style.display = "";
} else {
mobileMenu.style.display = "none"
}
}
mobileMenuOpen.addEventListener("click", e => {
e.preventDefault();
e.stopPropagation();
toggleMobileMenu();
});
// scroll to from navigation
let scrollToService = document.getElementsByClassName("scrollToService");
let scrollToWork = document.getElementsByClassName("scrollToWork");
let scrollToRental = document.getElementsByClassName("scrollToRental");
let scrollToFooter = document.getElementsByClassName("scrollToFooter");
function addScrollTo(nodes, anchor) {
for (let node of nodes) {
node.addEventListener("click", () => {
toggleMobileMenu();
let section = document.getElementById(anchor);
if (window.location.pathname === "/") {
window.scrollTo({top: section.offsetTop, behavior: "smooth"});
} else {
window.location = `/#${anchor}`;
}
});
}
}
document.addEventListener("click", e => {
if(!mobileMenu.style.display) {
mobileMenu.style.display = "none"
}
});
addScrollTo(scrollToService, "service");
addScrollTo(scrollToWork, "work");
addScrollTo(scrollToRental, "rental");
addScrollTo(scrollToFooter, "footer");
// click on logo navigation
let homeLink = document.getElementById("homeLink");
homeLink.addEventListener("click", e => {
e.preventDefault();
e.stopPropagation();
if(window.location.pathname === "/") {
window.scrollTo({top: 0, behavior: "smooth"});
}
else {
window.location = "/";
}
});
</script>
tpl/head.html
+25 -25
View File
@@ -1,37 +1,37 @@
{{- $title := default (copy .Page .Content "title") "Schnittfest – Film, auf den Frame genau." -}}
{{- $description := default (copy .Page .Content "meta_description") "Film, Animation und Sound aus Ostwestfalen. Schnittfest produziert Imagefilme, Commercials und Kampagnen – auf den Frame genau." -}}
<!DOCTYPE html>
<html lang="de">
<html lang="{{ .Page.Language }}">
<head>
<base href="/" />
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>{{ $title }}</title>
<meta name="description" content="{{ $description }}" />
<meta name="copyright" content="Schnittfest GmbH" />
<meta name="author" content="Emvi Software GmbH" />
<meta name="title" content="Schnittfest" />
<meta name="description" content="Film, auf den Frame genau." />
<meta name="msapplication-TileColor" content="#000000" />
<meta name="theme-color" content="#000000" />
<meta name="twitter:card" content="product" />
<meta name="twitter:title" content="Schnittfest" />
<meta name="twitter:description" content="Film, auf den Frame genau." />
<meta name="twitter:image" content="/static/1.jpg" />
<meta property="og:url" content="https://schnittfest.gmbh/" />
<meta property="og:title" content="Schnittfest" />
<meta property="og:description" content="Film, auf den Frame genau." />
<meta property="og:image" content="/static/1.jpg" />
<link rel="stylesheet" type="text/css" href="/static/web/main.css" />
<link rel="stylesheet" type="text/css" href="/static/web/manrope.css" />
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet" />
<meta name="theme-color" content="#0e0c0b" />
<meta name="msapplication-TileColor" content="#0e0c0b" />
<meta name="apple-mobile-web-app-title" content="Schnittfest" />
<meta name="application-name" content="Schnittfest" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="{{ $title }}" />
<meta name="twitter:description" content="{{ $description }}" />
<meta name="twitter:image" content="{{ hostname }}/static/1.jpg" />
<meta property="og:url" content="{{ .Page.CanonicalLink }}" />
<meta property="og:title" content="{{ $title }}" />
<meta property="og:description" content="{{ $description }}" />
<meta property="og:image" content="{{ hostname }}/static/1.jpg" />
<link rel="canonical" href="{{ .Page.CanonicalLink }}" />
<link rel="apple-touch-icon" sizes="180x180" href="/static/favicon/apple-touch-icon.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/static/favicon/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/static/favicon/favicon-16x16.png" />
<link rel="mask-icon" href="/static/favicon/safari-pinned-tab.svg" color="#000000" />
<link rel="mask-icon" href="/static/favicon/safari-pinned-tab.svg" color="#0e0c0b" />
<link rel="shortcut icon" href="/static/favicon/favicon.ico" />
<meta name="apple-mobile-web-app-title" content="Schnittfest" />
<meta name="application-name" content="Schnittfest" />
<meta name="msapplication-TileColor" content="#000000" />
<meta name="theme-color" content="#000000" />
<title>Schnittfest</title>
<link rel="preload" href="/static/fonts/Manrope-ExtraBold.woff2" as="font" type="font/woff2" crossorigin />
<link rel="stylesheet" href="/static/web/manrope.css" />
<link rel="stylesheet" href="/static/web/main.css?v={{ .CMS.LastUpdate }}" />
<script defer src="/static/web/main.min.js?v={{ .CMS.LastUpdate }}"></script>
{{ adminHead .Page }}
</head>
<body class="bg-beige-to-black">
<body>
tpl/insta.html
+14 -4
View File
@@ -1,6 +1,16 @@
<section id="instagram" class="section-instagram">
<div class="container">
<script src="https://cdn.lightwidget.com/widgets/lightwidget.js"></script>
<iframe src="https://cdn.lightwidget.com/widgets/ea2fc8dd2d55541dbafdc312dbe28aee.html" scrolling="no" allowtransparency="true" class="lightwidget-widget" style="width:100%;border:0;overflow:hidden;"></iframe>
{{- $headline := default (copy .Page .Content "headline") "Hinter den Kulissen" -}}
{{- $widget := default (get .Content "widget") "https://cdn.lightwidget.com/widgets/ea2fc8dd2d55541dbafdc312dbe28aee.html" -}}
{{- $profile := default (get .Content "profile") "https://instagram.com/schnittfest.gmbh" -}}
<section class="insta" id="instagram" data-shifu-element="{{ .Content.Position }}">
<div class="insta__inner">
<div class="insta__head" data-component="reveal">
<h2 class="section-title"><span class="section-title__nr">03</span>{{ $headline }}</h2>
<a class="button button--outline" href="{{ $profile }}" target="_blank" rel="noopener">@schnittfest.gmbh</a>
</div>
<div class="insta__frame" data-component="reveal">
<script src="https://cdn.lightwidget.com/widgets/lightwidget.js"></script>
<iframe src="{{ $widget }}" scrolling="no" allowtransparency="true" class="lightwidget-widget insta__widget" title="Instagram"></iframe>
</div>
</div>
</section>
tpl/intro.html
+34 -9
View File
@@ -1,13 +1,38 @@
<section id="start" class="section-start">
<div class="container" data-aos="fade-in">
<div class="headline">
<h1 data-aos="fade-in">
Film, auf den Frame genau.
<a href="mailto:hi@schnittfest.gmbh">&#10230;</a>
</h1>
{{- $headline := default (copy .Page .Content "headline") "Film, auf den Frame genau." -}}
{{- $kicker := default (copy .Page .Content "kicker") "Videoproduktion aus Ostwestfalen" -}}
{{- $ctaLabel := default (copy .Page .Content "cta_label") "Projekt anfragen" -}}
{{- $ctaHref := default (copy .Page .Content "cta_href") "mailto:hi@schnittfest.gmbh" -}}
{{- $ticker := default (copy .Page .Content "ticker") "Film ✦ Animation ✦ Sound ✦ Schnitt ✦ Color Grading ✦ Drohne ✦ Imagefilm ✦ Commercial ✦" -}}
{{- $video := default (get .Content "video") "/static/hero.mp4" -}}
{{- $poster := default (get .Content "poster") "/static/1.jpg" -}}
<section class="intro" id="start" data-shifu-element="{{ .Content.Position }}">
<div class="intro__inner">
<p class="intro__kicker" data-component="reveal"><span class="intro__kicker-dot"></span>{{ $kicker }}</p>
<h1 class="intro__headline" data-component="reveal">{{ $headline }}</h1>
<div class="intro__cta" data-component="reveal">
<a class="button button--yellow" href="{{ $ctaHref }}"><span class="button__play" aria-hidden="true"></span>{{ $ctaLabel }}</a>
</div>
<div id="hero" class="hero" data-aos="fade-in" data-aos-delay="200">
<video src="/static/hero.mp4" autoplay loop muted playsinline />
<div class="viewfinder" data-component="reveal">
<video class="viewfinder__video" src="{{ $video }}" poster="{{ $poster }}" autoplay loop muted playsinline></video>
<div class="viewfinder__overlay" aria-hidden="true">
<span class="viewfinder__corner viewfinder__corner--tl"></span>
<span class="viewfinder__corner viewfinder__corner--tr"></span>
<span class="viewfinder__corner viewfinder__corner--bl"></span>
<span class="viewfinder__corner viewfinder__corner--br"></span>
<span class="viewfinder__rec">REC</span>
<span class="viewfinder__timecode" data-component="timecode">00:00:00:00</span>
<span class="viewfinder__meta">4K · 25 FPS · ISO 800</span>
<span class="viewfinder__battery"></span>
<span class="viewfinder__focus"></span>
</div>
</div>
</div>
<div class="ticker" aria-hidden="true">
<div class="ticker__track">
<span>{{ $ticker }}</span><span>{{ $ticker }}</span><span>{{ $ticker }}</span><span>{{ $ticker }}</span>
</div>
</div>
</section>
tpl/legal.html
+2 -2
View File
@@ -1,5 +1,5 @@
<section id="text" class="section-text">
<div class="container">
<section class="text" id="text" data-shifu-element="{{ .Content.Position }}">
<div class="text__inner">
<h3>Impressum</h3>
<p>
Schnittfest GmbH<br>
tpl/nav.html
+25 -28
View File
@@ -1,28 +1,25 @@
{{if get .Content "full"}}
<nav class="header bg-beige-to-black">
<div class="container" data-aos="fade-in" data-aos-delay="50">
<div id="homeLink" class="wordmark black-to-beige">Schnittfest</div>
<ul class="links hide-sm black-to-beige">
<li class="scrollToService">Gewerke</li>
<li class="scrollToWork">Referenzen</li>
<li class="scrollToFooter">Kontakt</li>
</ul>
<ul class="show-sm black-to-beige">
<li id="mobileMenuOpen">Menü</li>
</ul>
</div>
</nav>
<nav id="mobileMenu" class="mobile-menu show-sm" style="display:none">
<ul>
<li class="scrollToService">Gewerke</li>
<li class="scrollToWork">Referenzen</li>
<li class="scrollToFooter">Kontakt</li>
</ul>
</nav>
{{else}}
<nav class="header bg-beige">
<div class="container">
<div id="homeLink" class="wordmark">Schnittfest</div>
</div>
</nav>
{{end}}
{{- $full := get .Content "full" -}}
{{- $service := default (copy .Page .Content "service_label") "Gewerke" -}}
{{- $work := default (copy .Page .Content "work_label") "Referenzen" -}}
{{- $contact := default (copy .Page .Content "contact_label") "Kontakt" -}}
<header class="nav{{ if $full }} nav--full{{ end }}" data-component="nav" data-shifu-element="{{ .Content.Position }}">
<div class="nav__inner">
<a class="nav__brand" href="/" aria-label="Schnittfest – Startseite">
<span class="nav__rec" aria-hidden="true"></span>
<span class="nav__word">Schnitt<span class="nav__cut" aria-hidden="true">✂</span>fest</span>
</a>
{{ if $full }}
<button class="nav__toggle" type="button" aria-expanded="false" aria-controls="nav-links">
<span class="nav__toggle-bar"></span>
<span class="nav__toggle-bar"></span>
<span class="visually-hidden">Menü</span>
</button>
<nav class="nav__links" id="nav-links">
<a class="nav__link" href="/#service" data-nr="01">{{ $service }}</a>
<a class="nav__link" href="/#work" data-nr="02">{{ $work }}</a>
<a class="nav__link nav__link--cta" href="/#footer" data-nr="03">{{ $contact }}</a>
</nav>
{{ end }}
</div>
</header>
tpl/service.html
+19 -11
View File
@@ -1,15 +1,23 @@
<section id="service" class="section-service bg-beige">
<div class="container">
<div class="services row">
<div class="col-lg-4 col-md-4 col-sm-12 col-xs-12">
<h2 class="black-to-beige" data-aos="fade-in" data-aos-delay="100">Film</h2>
<p class="black-to-beige" data-aos="fade-in" data-aos-delay="100">sleep.shoot.eat.repeat. </p>
<h2 class="black-to-beige" data-aos="fade-in" data-aos-delay="200">Animation</h2>
<p class="black-to-beige" data-aos="fade-in" data-aos-delay="200">Herausstechen und Welten erschaffen.</p>
<h2 class="black-to-beige" data-aos="fade-in" data-aos-delay="300">Sound</h2>
<p class="black-to-beige" data-aos="fade-in" data-aos-delay="300">Keine Musik wäre wie Butter ohne Brot.</p>
{{- $headline := default (copy .Page .Content "headline") "Gewerke" -}}
{{- $text := copy .Page .Content "text" -}}
{{- $image := default (get .Content "image") "/static/1.jpg" -}}
{{- $caption := copy .Page .Content "image_caption" -}}
<section class="service" id="service" data-shifu-element="{{ .Content.Position }}">
<div class="service__inner">
<div class="service__head" data-component="reveal">
<h2 class="section-title"><span class="section-title__nr">01</span>{{ $headline }}</h2>
{{ with $text }}<div class="service__text">{{ html . }}</div>{{ end }}
</div>
<div class="service__grid">
<div class="service__items">
{{ .CMS.Render .Args .Page (fmt "%s.items" .Content.Position) (index .Content.Content "items") }}
<slot name="{{ .Content.Position }}/items"></slot>
</div>
<div class="col-lg-8 col-md-8 col-sm-12 col-xs-12 img" data-aos="fade-in"></div>
<figure class="polaroid" data-component="reveal">
<img class="polaroid__image" src="{{ $image }}" alt="{{ default $caption "Schnittfest am Set" }}" loading="lazy" />
{{ with $caption }}<figcaption class="polaroid__caption">{{ . }}</figcaption>{{ end }}
</figure>
</div>
</div>
</section>
tpl/service_item.html
+11
View File
@@ -0,0 +1,11 @@
{{- $title := copy .Page .Content "title" -}}
{{- $text := copy .Page .Content "text" -}}
{{- $color := default (get .Content "color") "red" -}}
<article class="slate slate--{{ $color }}" data-component="reveal" data-shifu-element="{{ .Content.Position }}">
<div class="slate__clapper" aria-hidden="true"></div>
<div class="slate__body">
{{ with $title }}<h3 class="slate__title">{{ . }}</h3>{{ end }}
{{ with $text }}<p class="slate__text">{{ . }}</p>{{ end }}
</div>
</article>
tpl/terms.html
+2 -2
View File
@@ -1,5 +1,5 @@
<section id="text" class="section-text">
<div class="container">
<section class="text" id="text" data-shifu-element="{{ .Content.Position }}">
<div class="text__inner">
<h3>Allgemeine Geschäftsbedingungen</h3>
<p>
Alle Preise verstehen sich zzgl. 3% Versicherungsgebühr und 19% MwSt.
tpl/work.html
+15 -3
View File
@@ -1,5 +1,17 @@
<section id="work" class="section-work">
<div class="container">
{{.CMS.Render .Args .Page (fmt "%s.content" .Content.Position) (index .Content.Content "content")}}
{{- $headline := default (copy .Page .Content "headline") "Referenzen" -}}
{{- $text := copy .Page .Content "text" -}}
<section class="work" id="work" data-shifu-element="{{ .Content.Position }}">
<div class="filmstrip" aria-hidden="true"></div>
<div class="work__inner">
<div class="work__head" data-component="reveal">
<h2 class="section-title section-title--light"><span class="section-title__nr">02</span>{{ $headline }}</h2>
{{ with $text }}<div class="work__text">{{ html . }}</div>{{ end }}
</div>
<div class="work__list">
{{ .CMS.Render .Args .Page (fmt "%s.content" .Content.Position) (index .Content.Content "content") }}
<slot name="{{ .Content.Position }}/content"></slot>
</div>
</div>
<div class="filmstrip filmstrip--bottom" aria-hidden="true"></div>
</section>
tpl/work_entry.html
+14 -9
View File
@@ -1,11 +1,16 @@
<div class="video row reverse">
<div class="col-lg-4 col-md-12 col-sm-12 col-xs-12">
<h2 class="black-to-beige" data-aos="fade-in" data-aos-delay="100">{{copy .Page .Content "h2"}}</h2>
<p class="black-to-beige" data-aos="fade-in" data-aos-delay="200">{{copy .Page .Content "text"}}</p>
{{- $title := copy .Page .Content "h2" -}}
{{- $text := copy .Page .Content "text" -}}
{{- $video := get .Content "video" -}}
<article class="take" data-component="reveal" data-shifu-element="{{ .Content.Position }}">
<div class="take__info">
<span class="take__label" aria-hidden="true">Take</span>
{{ with $title }}<h3 class="take__title">{{ . }}</h3>{{ end }}
{{ with $text }}<p class="take__text">{{ . }}</p>{{ end }}
</div>
<div class="col-lg-8 col-md-12 col-sm-12 col-xs-12">
<div style="padding:56.25% 0 0 0;position:relative;" data-aos="fade-in">
<iframe src="{{get .Content "video"}}" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allowfullscreen></iframe>
</div>
<div class="take__screen">
{{ with $video }}
<iframe class="take__video" src="{{ . }}" title="{{ default $title "Video" }}" loading="lazy" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>
{{ end }}
</div>
</div>
</article>