More Theme updates

This commit is contained in:
Patrick Neff 2019-05-05 10:06:20 +02:00
parent 99b9dcad5c
commit 23ced61908
25 changed files with 83 additions and 92 deletions

View File

@ -3,8 +3,8 @@
{{- end -}} {{- end -}}
{{- define "main" -}} {{- define "main" -}}
<main id="single"> <main class="row" id="single">
<article> <article class="col-sm-12">
{{- partial "single.html" . -}} {{- partial "single.html" . -}}
</article> </article>
</main> </main>

View File

@ -17,6 +17,6 @@
{{ $image = index $images 0 }} {{ $image = index $images 0 }}
{{ end }} {{ end }}
{{ with $image }} {{ with $image }}
<li class="padding"> {{- partial "catalog.html" (dict "ctx" $ctx "image" . "class" "catalog" "showTitle" true "showDescription" true) -}} <li class="col-xs-6 col-sm-4"> {{- partial "catalog.html" (dict "ctx" $ctx "image" . "class" "catalog" "showTitle" true "showDescription" true) -}}
</li> </li>
{{ end }} {{ end }}

View File

@ -3,9 +3,9 @@
{{- end -}} {{- end -}}
{{ define "main" }} {{ define "main" }}
<main id="list"> <main class="row" id="list">
<h1 class="padding">{{ .Title }}</h1> <h1 class="col-xs">{{ .Title }}</h1>
<ul class="list-unstyled flex row gallery"> <ul class="list-unstyled row">
{{- range .Sections -}} {{- range .Sections -}}
{{- .Render "li" -}} {{- .Render "li" -}}
{{- end -}} {{- end -}}
@ -14,8 +14,8 @@
{{- end -}} {{- end -}}
</ul> </ul>
{{- with .Content -}} {{- with .Content -}}
<div class="content flex column"> <div class="content row">
<div class="padding"> <div class="col-sm-12">
{{ . }} {{ . }}
</div> </div>
</div> </div>

View File

@ -3,8 +3,8 @@
{{- end -}} {{- end -}}
{{- define "main" -}} {{- define "main" -}}
<main class="catalog" id="single"> <main class="catalog row" id="single">
<article id="catalog-article"> <article id="catalog-article" class="col-sm-12">
{{- partial "catalog-article.html" . -}} {{- partial "catalog-article.html" . -}}
</article> </article>
</main> </main>

View File

@ -16,7 +16,7 @@
{{ else }} {{ else }}
{{ $image = index $images 0 }} {{ $image = index $images 0 }}
{{ end }} {{ end }}
{{ with $images }} {{ with $image }}
<li class="padding"> {{- partial "figure.html" (dict "ctx" $ctx "image" $image "class" "gallery" "showTitle" true "showDescription" true) -}} <li class="col-xs-6 col-sm-4"> {{- partial "figure.html" (dict "ctx" $ctx "image" . "class" "catalog" "showTitle" true "showDescription" true) -}}
</li> </li>
{{ end }} {{ end }}

12
themes/neff/layouts/gallery/list.html Executable file → Normal file
View File

@ -4,8 +4,10 @@
{{ define "main" }} {{ define "main" }}
<main id="list"> <main id="list">
<h1 class="padding">{{ .Title }}</h1> <div class="row">
<ul class="list-unstyled flex row gallery"> <h1 class="col-xs-12">{{ .Title }}</h1>
</div>
<ul class="list-unstyled row">
{{- range .Sections -}} {{- range .Sections -}}
{{- .Render "li" -}} {{- .Render "li" -}}
{{- end -}} {{- end -}}
@ -14,11 +16,11 @@
{{- end -}} {{- end -}}
</ul> </ul>
{{- with .Content -}} {{- with .Content -}}
<div class="content flex column"> <div class="content row">
<div class="padding"> <div class="col-sm-12">
{{ . }} {{ . }}
</div> </div>
</div> </div>
{{- end -}} {{- end -}}
</main> </main>
{{ end }} {{ end }}

View File

@ -36,7 +36,7 @@
<a class="anchor" id="{{ i18n "about-us" }}"><h1 class="padding">{{ (replace (replace (i18n "about-us") "-" " ") "ue" "ü") | title}}</h1></a> <a class="anchor" id="{{ i18n "about-us" }}"><h1 class="padding">{{ (replace (replace (i18n "about-us") "-" " ") "ue" "ü") | title}}</h1></a>
<div class="row"> <div class="row">
{{- range (first 3 (where .Site.Pages.ByWeight ".Params.type" "ueber-uns")) -}} {{- range (first 3 (where .Site.Pages.ByWeight ".Params.type" "ueber-uns")) -}}
<div class="col-xs-4"> <div class="col-xs-12 col-sm-4">
{{- partial "hero.html" . -}} {{- partial "hero.html" . -}}
</div> </div>
{{- end -}} {{- end -}}
@ -45,8 +45,8 @@
</div> </div>
<div class="container"> <div class="container">
<section id="index-contact"> <section class="row" id="index-contact">
<div> <div class="col-xs-12">
<a class="anchor" id="{{ i18n "contact" }}"><h1 class="padding">Kontakt</h1></a> <a class="anchor" id="{{ i18n "contact" }}"><h1 class="padding">Kontakt</h1></a>
<div class="call-to-action flex row text-center"> <div class="call-to-action flex row text-center">
<div class="padding"> <div class="padding">
@ -64,14 +64,14 @@
</div> </div>
<div class="container"> <div class="container">
<section id="index-gallery"> <section class="row" id="index-gallery">
<h1 class="padding"> <h1 class="col-xs-12 padding">
<a class="anchor" href="/galerie" id="{{ i18n "gallery" }}">{{ i18n "gallery" | title}}</a> <a class="anchor" href="/galerie" id="{{ i18n "gallery" }}">{{ i18n "gallery" | title}}</a>
<span class="small"></span> <span class="small"></span>
</h1> </h1>
<ul class="row list-unstyled"> <ul class="row list-unstyled">
{{- range .Params.galleries }} {{- range .Params.galleries }}
<li class="col-xs-4"> <li class="col-xs-12 col-sm-4">
{{- $section := $.Site.GetPage "section" "galerie" -}} {{- $section := $.Site.GetPage "section" "galerie" -}}
{{- $page := $section.GetPage . -}} {{- $page := $section.GetPage . -}}
{{- $image := ((index $page.Pages 0).Resources.GetMatch "**.jpg") -}} {{- $image := ((index $page.Pages 0).Resources.GetMatch "**.jpg") -}}
@ -79,8 +79,8 @@
</li> </li>
{{- end -}} {{- end -}}
</ul> </ul>
<div class="padding"> <div class="col-xs-12 end-sm">
<p class="text-right"> <p>
<a href="/galerie"><strong>Alle Galerien</strong></a> <a href="/galerie"><strong>Alle Galerien</strong></a>
</p> </p>
</div> </div>
@ -88,15 +88,15 @@
</div> </div>
<div class="container"> <div class="container">
<section id="index-news"> <section class="row" id="index-news">
<h1 class="padding"><a class="anchor" href="/neuigkeiten" id="{{ i18n "news" }}">{{ i18n "news" | title}}</a></h1> <h1 class="col-xs-12 padding"><a class="anchor" href="/neuigkeiten" id="{{ i18n "news" }}">{{ i18n "news" | title}}</a></h1>
<ul class="list-unstyled row"> <ul class="list-unstyled row">
{{- range (first 3 (where .Site.Pages.ByWeight ".Params.type" "news")) -}} {{- range (first 3 (where .Site.Pages.ByWeight ".Params.type" "news")) -}}
{{- partial "news.html" . -}} {{- partial "news.html" . -}}
{{- end -}} {{- end -}}
</ul> </ul>
<div class="padding"> <div class="col-xs-12 end-sm">
<p class="text-right"> <p>
<a href="/neuigkeiten"><strong>Alle Neuigkeiten</strong></a> <a href="/neuigkeiten"><strong>Alle Neuigkeiten</strong></a>
</p> </p>
</div> </div>

View File

@ -3,8 +3,8 @@
{{- end -}} {{- end -}}
{{- define "main" -}} {{- define "main" -}}
<main class="model" id="single"> <main class="model row" id="single">
<article id="model"> <article id="model" class="col-sm-12">
<div id="model-viewer-root"></div> <div id="model-viewer-root"></div>
</article> </article>
</main> </main>

View File

@ -1,4 +1,4 @@
<section class="address col-xs-4"> <section class="address col-xs-12 col-sm-4">
<header> <header>
<h3>{{ .address.address.addressLocality }}</h3> <h3>{{ .address.address.addressLocality }}</h3>
</header> </header>

View File

@ -6,7 +6,7 @@
{{- with $page -}} {{- with $page -}}
<section id="banner"> <section id="banner">
<div class="container"> <div class="container">
<div id="banner-container" class="padding"> <div id="banner-container" class="col-xs-12">
<h1>{{ .Title }}</h1> <h1>{{ .Title }}</h1>
<p>{{ .Params.description }}</p> <p>{{ .Params.description }}</p>
<p><a href="{{ .Permalink }}" class="btn btn-primary">{{ i18n "more-info" }}</a></p> <p><a href="{{ .Permalink }}" class="btn btn-primary">{{ i18n "more-info" }}</a></p>

View File

@ -1,5 +1,5 @@
<nav class="breadcrumbs"> <nav class="breadcrumbs row">
<ol class="nav navbar-nav"> <ol class="nav navbar-nav col-xs-12">
{{ template "breadcrumbnav" (dict "p1" . "p2" .) }} {{ template "breadcrumbnav" (dict "p1" . "p2" .) }}
</ol> </ol>
{{ define "breadcrumbnav" }} {{ define "breadcrumbnav" }}

View File

@ -1,7 +1,7 @@
<header class="flex column padding"> <header class="flex padding">
<h1>{{ .Title }}</h1> <h1>{{ .Title }}</h1>
</header> </header>
<div class="content flex column"> <div class="content flex">
<div class="padding"> <div class="padding">
{{- with .Resources.GetMatch "bilder/*" -}} {{- with .Resources.GetMatch "bilder/*" -}}
{{- $orig := . -}} {{- $orig := . -}}

View File

@ -1,7 +1,7 @@
<div class="clearfix"></div> <div class="clearfix"></div>
<ul class="list-unstyled flex row gallery"> <ul class="list-unstyled flex row gallery">
{{- range .Resources.ByType "image" -}} {{- range .Resources.ByType "image" -}}
<li class="padding"> <li class="col-xs-12 col-sm-4 padding">
{{- partial "figure.html" (dict "image" . "ctx" . "lightbox" true "class" "gallery" "showTitle" true "showDescription" true) }} {{- partial "figure.html" (dict "image" . "ctx" . "lightbox" true "class" "gallery" "showTitle" true "showDescription" true) }}
</li> </li>
{{- end -}} {{- end -}}

View File

@ -1,4 +1,5 @@
<div class="flex row"> <div class="flex row">
<div class="col-xs-12">
<div class="navbar-logo padding"> <div class="navbar-logo padding">
<a href="{{.Site.BaseURL }}"> <a href="{{.Site.BaseURL }}">
<picture> <picture>
@ -35,4 +36,5 @@
</nav> </nav>
</div> </div>
</div> </div>
</div>
</div> </div>

View File

@ -1,4 +1,4 @@
<li class="col-xs-4"> <li class="col-xs-12 col-sm-4">
<div> <div>
{{- $site := . -}} {{- $site := . -}}
{{- range .Resources.ByType "image" -}} {{- range .Resources.ByType "image" -}}

View File

@ -1,4 +1,4 @@
<header class="flex column padding"> <header class="flex padding">
<h1>{{ .Title }}</h1> <h1>{{ .Title }}</h1>
</header> </header>
{{- $resources := .Resources -}} {{- $resources := .Resources -}}

View File

@ -1,5 +1,5 @@
<h4>{{ i18n "translations" | title }}</h4> <h4>{{ i18n "translations" | title }}</h4>
<ul> <ul class="col-xs-12">
{{- range .Translations -}} {{- range .Translations -}}
<li> <li>
<a href="{{ .Permalink }}" hreflang="{{ .Language.Lang }}">{{ .Language.LanguageName }}: {{ .Title }}</a> <a href="{{ .Permalink }}" hreflang="{{ .Language.Lang }}">{{ .Language.LanguageName }}: {{ .Title }}</a>

View File

@ -39,14 +39,14 @@
<div class="clearfix"></div> <div class="clearfix"></div>
{{ with .Inner }} {{ with .Inner }}
<ul class="list-unstyled flex row gallery neg-margin"> <ul class="list-unstyled row gallery">
{{ . }} {{ . }}
</ul> </ul>
{{ else }} {{ else }}
<ul class="list-unstyled flex row gallery neg-margin"> <ul class="list-unstyled row gallery">
{{ range $.Page.Resources.Match $search }} {{ range $.Page.Resources.Match $search }}
{{- if (ne .Params.featured true) -}} {{- if (ne .Params.featured true) -}}
<li class="padding"> <li class="col-xs-6 col-sm-4">
{{- partial "figure.html" (dict "image" . "ctx" . "lightbox" $lightbox "class" "gallery" "showTitle" $title "showDescription" $description "keepOriginal" $keep) -}} {{- partial "figure.html" (dict "image" . "ctx" . "lightbox" $lightbox "class" "gallery" "showTitle" $title "showDescription" $description "keepOriginal" $keep) -}}
</li> </li>
{{- end -}} {{- end -}}

View File

@ -47,7 +47,7 @@
{{ end }} {{ end }}
{{ $image := $.Page.Resources.GetMatch $search }} {{ $image := $.Page.Resources.GetMatch $search }}
{{ if $list }} {{ if $list }}
<li class="padding"> <li class="col-xs-6 col-sm-4 padding">
{{ end }} {{ end }}
{{ partial "figure.html" (dict "image" $image "ctx" $image "class" $class "lightbox" $lightbox "showTitle" $showTitle "showDescription" $showDescription) }} {{ partial "figure.html" (dict "image" $image "ctx" $image "class" $class "lightbox" $lightbox "showTitle" $showTitle "showDescription" $showDescription) }}
{{ if $list }} {{ if $list }}

View File

@ -1,7 +1,7 @@
/* VARIABLES */ /* VARIABLES */
$gutter-width: 0.5rem !default; $gutter-width: 0.5rem !default;
$outer-margin: 2rem !default; $outer-margin: 1rem !default;
$xs-min: 30rem !default; $xs-min: 30rem !default;
$sm-min: 48rem !default; $sm-min: 48rem !default;
@ -36,16 +36,13 @@ $gutter-compensation: $half-gutter-width * -1;
.container, .container,
.container-fluid { .container-fluid {
margin: 0 auto; margin: 0 auto;
}
.container-fluid {
padding: 0 $outer-margin; padding: 0 $outer-margin;
} }
.row { .row {
@include flex(); @include flex();
flex-direction: row; flex-direction: row;
margin: $gutter-compensation 0; margin: 0 $gutter-compensation;
&.reverse { &.reverse {
flex-direction: row-reverse; flex-direction: row-reverse;
@ -180,7 +177,7 @@ $gutter-compensation: $half-gutter-width * -1;
.col-offset-sm-12 { .col-offset-sm-12 {
box-sizing: border-box; box-sizing: border-box;
flex: 0 0 auto; flex: 0 0 auto;
padding: $half-gutter-width 0; padding: 0 $half-gutter-width;
} }
.col-sm { .col-sm {
@ -271,7 +268,7 @@ $gutter-compensation: $half-gutter-width * -1;
.col-offset-lg-12 { .col-offset-lg-12 {
box-sizing: border-box; box-sizing: border-box;
flex: 0 0 auto; flex: 0 0 auto;
padding: $half-gutter-width 0; padding: 0 $half-gutter-width;
} }
.col-lg { .col-lg {
@ -362,7 +359,7 @@ $gutter-compensation: $half-gutter-width * -1;
.col-offset-xl-12 { .col-offset-xl-12 {
box-sizing: border-box; box-sizing: border-box;
flex: 0 0 auto; flex: 0 0 auto;
padding: $half-gutter-width 0; padding: 0 $half-gutter-width;
} }
.col-xl { .col-xl {

View File

@ -184,6 +184,7 @@ table {
background-color: rgba(255, 255, 255, 0.9); background-color: rgba(255, 255, 255, 0.9);
border-radius: $border-radius; border-radius: $border-radius;
margin-bottom: $gutter-width; margin-bottom: $gutter-width;
padding: $gutter-width * 0.5 $gutter-width;
&.transparent { &.transparent {
background-color: transparent; background-color: transparent;
@ -220,7 +221,6 @@ table {
.list-unstyled { .list-unstyled {
list-style: none; list-style: none;
margin: 0;
padding: 0; padding: 0;
} }
@ -343,6 +343,7 @@ figure {
border-radius: $border-radius; border-radius: $border-radius;
color: black color: black
margin 0 1rem; margin 0 1rem;
line-height: 3rem;
&.btn-small { &.btn-small {
padding: .3rem 1rem; padding: .3rem 1rem;
@ -418,13 +419,9 @@ a.btn-primary {
nav.breadcrumbs { nav.breadcrumbs {
ol { ol {
list-style: none; list-style: none;
padding: 0;
margin: 0;
li { li {
display: inline-block; display: inline-block;
padding: 0;
margin: 0;
&.active { &.active {
font-weight: bold; font-weight: bold;

View File

@ -24,19 +24,10 @@
font-size: 1.1rem; font-size: 1.1rem;
align-items: flex-start; align-items: flex-start;
background-color: rgba(255, 255, 255, 0.9); background-color: rgba(255, 255, 255, 0.9);
height: 90px;
border-radius: $border-radius; border-radius: $border-radius;
padding: $gutter-width; margin: calc(100vh - 280px) -$half-gutter-width 0 auto;
margin: calc(100vh - 310px) -$gutter-width 0 -$gutter-width; padding: $half-gutter-width $gutter-width;
overflow: hidden; overflow: hidden;
min-width: 100%;
@media only screen and (min-width: $sm-min) {
margin-top: calc(100vh - 285px);
margin-bottom: -$gutter-width;
margin-right: -$gutter-width;
padding-right: $gutter-width;
}
ul { ul {
list-style: none; list-style: none;

View File

@ -1,28 +1,30 @@
<template> <template>
<article v-if="articleData"> <article class="row"v-if="articleData">
<header class="flex column padding"> <header class="col-xs-12">
<h1>{{ articleData.title }}</h1> <h1>{{ articleData.title }}</h1>
</header> </header>
<div class="content flex column"> <div class="col-xs-12">
<div class="padding"> <div class="row">
<div v-if="hasWebGl && articleData.model" class="featured left wide"> <div v-if="hasWebGl && articleData.model" class="featured col-xs-12 col-sm-8">
<model-viewer :modelData="articleData.model"/> <model-viewer :modelData="articleData.model"/>
</div> </div>
<figure v-else class="featured left wide"> <figure v-else class="featured col-xs-12 col-sm-8">
<img alt="" title="" class="" srcset="" sizes="" src=""> <img alt="" title="" class="" srcset="" sizes="" src="">
</figure> </figure>
<p v-if="hasWebGl && articleData.model && articleData.model.textures.length > 1"> <div class="col-sm-4 col-xs-12">
<strong>Material ändern</strong> <p v-if="hasWebGl && articleData.model && articleData.model.textures.length > 1">
<material-switcher :modelData="articleData.model"/> <strong>Material ändern</strong>
</p> <material-switcher :modelData="articleData.model"/>
<p class="offer"> </p>
<a class="btn btn-secondary" v-if="articleData.offer" :href="articleData.offer">Angebot</a> <p class="offer">
</p> <a class="btn btn-secondary" v-if="articleData.offer" :href="articleData.offer">Angebot</a>
<p class="type">Typ: {{ types }}</p> </p>
<p class="material">Material: {{ material }}</p> <p class="type">Typ: {{ types }}</p>
<p class="ornament" v-if="articleData.ornament">Ornament: {{ articleData.ornament }}</p> <p class="material">Material: {{ material }}</p>
<p class="description" v-if="articleData.description">{{ articleData.description }}</p> <p class="ornament" v-if="articleData.ornament">Ornament: {{ articleData.ornament }}</p>
<p class="article-id">Art. Nr.: {{ articleData.article_id }}</p> <p class="description" v-if="articleData.description">{{ articleData.description }}</p>
<p class="article-id">Art. Nr.: {{ articleData.article_id }}</p>
</div>
</div> </div>
</div> </div>
</article> </article>

View File

@ -1,9 +1,9 @@
<template> <template>
<article v-if="articleData"> <article v-if="articleData">
<header class="flex column padding"> <header class="flex padding">
<h1>{{ articleData.title }}</h1> <h1>{{ articleData.title }}</h1>
</header> </header>
<div class="content flex column"> <div class="content flex">
<div class="padding"> <div class="padding">
<div v-if="articleData.model" class="featured left wide"> <div v-if="articleData.model" class="featured left wide">
<model-viewer class="model-viewer" :modelData="articleData.model"/> <model-viewer class="model-viewer" :modelData="articleData.model"/>

View File

@ -58,16 +58,16 @@ export default {
this.scene = new Scene() this.scene = new Scene()
}, },
getWidth() { getWidth() {
let el = document.getElementById('model-viewer') || 0 let el = this.$el.parentElement || 0
if (el) { if (el) {
return el.offsetWidth return el.offsetWidth
} }
return 0 return 0
}, },
getHeight() { getHeight() {
let el = document.getElementById('model-viewer') || 0 let el = this.$el.parentElement || 0
if (el) { if (el) {
return el.offsetHeight return el.offsetWidth / 1.333333;
} }
return 0 return 0
}, },