WIP: convert sass to css
All checks were successful
website-main / prod-build (push) Successful in 1m7s
website-main / test-build (push) Successful in 45s
website-main / auto-rebuild (push) Has been skipped

This commit is contained in:
Denys Konovalov 2023-06-09 20:35:28 +02:00
parent edffb3a720
commit 96f6f10146
21 changed files with 145 additions and 171 deletions

@ -1,7 +1,7 @@
/* Button style */ /* Button style */
.btn { .btn {
font-size: 16px; font-size: 16px;
font-family: $primary-font; font-family: var(--gcg-font-primary);
padding: 15px 40px; padding: 15px 40px;
border-radius: 0; border-radius: 0;
font-weight: 500; font-weight: 500;
@ -49,16 +49,16 @@
} }
.btn-primary { .btn-primary {
background: $primary-color; background: var(--gcg-color-primary);
color: $white; color: white;
&::before { &::before {
background: $white; background: white;
} }
&:active { &:active {
background: $primary-color !important; background: var(--gcg-color-primary) !important;
color: $primary-color; color: var(--gcg-color-primary);
&::before { &::before {
height: 80%; height: 80%;
@ -66,57 +66,57 @@
} }
&:hover { &:hover {
background: darken($color: $primary-color, $amount: 10); background: var(--gcg-color-primary);
color: $primary-color; color: var(--gcg-color-primary);
} }
} }
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled):active,
.show>.btn-primary.dropdown-toggle { .show>.btn-primary.dropdown-toggle {
color: $white; color: white;
background-color: darken($color: $primary-color, $amount: 10); background-color: var(--gcg-color-primary);
border-color: darken($color: $primary-color, $amount: 10); border-color: var(--gcg-color-primary);
} }
.btn-secondary { .btn-secondary {
background: $white; background: white;
color: $primary-color; color: var(--gcg-color-primary);
border: 1px solid $white; border: 1px solid white;
&::before { &::before {
background: $primary-color; background: var(--gcg-color-primary);
} }
&:active { &:active {
background: $primary-color; background: var(--gcg-color-primary);
color: $white; color: white;
border: 1px solid $white; border: 1px solid white;
} }
&:hover { &:hover {
background: $white; background: white;
color: $white; color: white;
border: 1px solid $white; border: 1px solid white;
} }
} }
.btn-primary-outline { .btn-primary-outline {
border: 1px solid $primary-color; border: 1px solid var(--gcg-color-primary);
color: $primary-color; color: var(--gcg-color-primary);
background: transparent; background: transparent;
&::before { &::before {
background: $white; background: white;
} }
&:hover { &:hover {
background: $primary-color; background: var(--gcg-color-primary);
color: $primary-color; color: var(--gcg-color-primary);
} }
&:active { &:active {
background: $primary-color; background: var(--gcg-color-primary);
color: $white; color: white;
} }
} }

@ -1,11 +1,22 @@
:root {
--gcg-color-primary: #ffbc3b;
--gcg-color-primary-light: #ffde9c;
--gcg-color-secondary: #1a1a37;
--gcg-color-light-1x: #ededf1;
--gcg-color-light-2x: #f8f9fe;
--gcg-font-primary: 'Ubuntu', sans-serif;
--gcg-font-header: 'Fira Sans', sans-serif;
--gcg-font-icon: 'Material Design Icons';
}
body { body {
background-color: $body-color; background-color: white;
overflow-x: hidden; overflow-x: hidden;
} }
::selection { ::selection {
background: lighten($color: $primary-color, $amount: 10); background: var(--gcg-color-primary-light);
color: $white; color: var(--bs-tertiary-color);
} }
/* preloader */ /* preloader */
@ -26,7 +37,7 @@ body {
ol, ol,
ul { ul {
list-style-type: none; list-style-type: none;
margin: 0px; margin: 0;
} }
img { img {
@ -56,15 +67,11 @@ select {
} }
a:hover { a:hover {
color: $primary-color; color: var(--gcg-color-primary);
} }
a.text-primary:hover { a.text-primary:hover {
color: $primary-color !important; color: var(--gcg-color-primary) !important;
}
a.text-light:hover {
color: $primary-color !important;
} }
h4 { h4 {
@ -73,7 +80,7 @@ h4 {
a h4 { a h4 {
&:hover { &:hover {
color: $primary-color; color: var(--gcg-color-primary);
} }
} }
@ -102,7 +109,7 @@ a h4 {
} }
.border-primary { .border-primary {
border-color: $border-color !important; border-color: var(--gcg-color-light-1x) !important;
} }
/* overlay */ /* overlay */
@ -117,49 +124,29 @@ a h4 {
width: 100%; width: 100%;
top: 0; top: 0;
left: 0; left: 0;
background: $secondary-color; background: var(--gcg-color-secondary);
opacity: .7; opacity: .7;
} }
} }
.bg-primary { .bg-primary {
background: $primary-color !important; background: var(--gcg-color-primary) !important;
} }
.bg-secondary { .bg-secondary {
background: $secondary-color !important; background: var(--gcg-color-secondary) !important;
}
.bg-gray {
background: $gray;
} }
.text-primary { .text-primary {
color: $primary-color !important; color: var(--gcg-color-primary) !important;
}
.text-color {
color: $text-color;
}
.text-light {
color: $text-color-light !important;
}
.text-lighten {
color: #d6d6e0 !important;
} }
.text-muted { .text-muted {
color: #b5b5b7 !important; color: #b5b5b7 !important;
} }
.text-dark { .font-header {
color: $text-color-dark !important; font-family: var(--gcg-font-header);
}
.font-secondary {
font-family: $secondary-font;
} }
.vertical-align-middle { .vertical-align-middle {
@ -191,7 +178,7 @@ a h4 {
height: 10px; height: 10px;
width: 10px; width: 10px;
border-radius: 50%; border-radius: 50%;
background: $primary-color; background: var(--gcg-color-primary);
left: -25px; left: -25px;
top: 5px; top: 5px;
} }
@ -217,14 +204,14 @@ textarea.form-control {
&.active { &.active {
.page-link { .page-link {
background: $primary-color; background: var(--gcg-color-primary);
color: $white; color: white;
border-color: $primary-color; border-color: var(--gcg-color-primary);
} }
} }
.page-link { .page-link {
color: $text-color; color: var(--bs-secondary-color);
} }
} }
} }
@ -265,7 +252,7 @@ textarea.form-control {
&::before { &::before {
position: absolute; position: absolute;
content: "\f0B2A"; content: "\f0B2A";
font-family: $icon-font; font-family: var(--gcg-font-icon);
font-size: 14px; font-size: 14px;
left: 0; left: 0;
top: 1px; top: 1px;
@ -295,11 +282,11 @@ textarea.form-control {
} }
thead { thead {
background: darken($color: $light, $amount: 2); background: var(--gcg-color-light-1x);
} }
tbody { tbody {
background: $light; background: var(--gcg-color-light-2x);
td { td {
text-align: left !important; text-align: left !important;
@ -309,16 +296,17 @@ textarea.form-control {
blockquote { blockquote {
border: 1px solid $border-color; border: 1px solid var(--gcg-color-light-1x);
border-left: 5px solid $primary-color; border-left: 5px solid var(--gcg-color-primary);
padding: 20px; padding: 20px;
padding-left: 40px; padding-left: 40px;
background-color: $light; background-color: var(--gcg-color-light-2x);
p { p {
color: $text-color; color: var(--bs-secondary-color);
font-style: italic !important; font-style: italic !important;
} }
* { * {
margin-bottom: 0 !important; margin-bottom: 0 !important;
} }
@ -326,17 +314,17 @@ textarea.form-control {
pre { pre {
padding: 10px 20px; padding: 10px 20px;
background: $light; background: var(--gcg-color-light-2x);
} }
} }
summary { summary {
font-weight: 900; font-weight: 900;
font-size: 22px; font-size: 22px;
color: $secondary-color; color: var(--gcg-color-secondary);
&.hover { &.hover {
color: $primary-color; color: var(--gcg-color-primary);
} }
} }
@ -375,7 +363,7 @@ details[open] summary {
bottom: -123px; bottom: -123px;
z-index: 9; z-index: 9;
padding: 15px; padding: 15px;
color: rgba($color: $white, $alpha: .5); color: rgba($color: white, $alpha: .5);
border: 0; border: 0;
font-size: 30px; font-size: 30px;
transition: all linear .2s; transition: all linear .2s;
@ -386,7 +374,7 @@ details[open] summary {
} }
&:hover { &:hover {
color: $primary-color; color: var(--gcg-color-primary);
} }
} }
@ -414,7 +402,7 @@ details[open] summary {
&.slick-active { &.slick-active {
button { button {
background: $primary-color; background: var(--gcg-color-primary);
} }
} }
@ -424,7 +412,7 @@ details[open] summary {
overflow: hidden; overflow: hidden;
height: 10px; height: 10px;
width: 10px; width: 10px;
background: rgba($color: $white, $alpha: .5); background: rgba($color: white, $alpha: .5);
border: 0; border: 0;
outline: 0; outline: 0;
} }
@ -457,7 +445,7 @@ details[open] summary {
font-size: 96px; font-size: 96px;
} }
.wc-canvas { #wc-canvas {
width: 100%; width: 100%;
height: 600px; height: 600px;
} }
@ -468,23 +456,24 @@ details[open] summary {
transition: .1s ease; transition: .1s ease;
&.active{ &.active{
font-weight: 600; font-weight: 600;
color: $primary-color; color: var(--gcg-color-primary);
} }
&:hover{ &:hover{
color: $primary-color; color: var(--gcg-color-primary);
} }
} }
} }
.tag-list{ .tag-list {
a{ a {
display: block; display: block;
padding: 5px 10px; padding: 5px 10px;
background: $light; background: var(--bs-secondary-bg);
color: $text-color; color: var(--bs-secondary-color);
&:hover{ &:hover{
background-color: $primary-color; background: var(--gcg-color-primary);
color: $white; color: white;
} }
} }
} }

@ -2,23 +2,27 @@
@import url('https://assets.cantorgymnasium.de/fonts/fira/fira.css'); @import url('https://assets.cantorgymnasium.de/fonts/fira/fira.css');
body { body {
line-height: 1.2; line-height: 1.2;
font-family: $primary-font; font-family: var(--gcg-font-primary);
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
font-size: 15px; font-size: 15px;
color: $text-color; color: var(--bs-secondary-color);
} }
p, .paragraph { p, .paragraph {
font-weight: 400; font-weight: 400;
color: $text-color; color: var(--bs-secondary-color);
font-size: 15px; font-size: 15px;
line-height: 1.9; line-height: 1.9;
font-family: $primary-font; font-family: var(--gcg-font-primary);
}
.text-white p {
color: inherit;
} }
h1,h2,h3,h4,h5,h6 { h1,h2,h3,h4,h5,h6 {
color: $text-color-dark; color: var(--gcg-color-secondary);
font-family: $secondary-font; font-family: var(--gcg-font-header);
font-weight: 900; font-weight: 900;
line-height: 1.2; line-height: 1.2;
} }

@ -1,17 +0,0 @@
// Color Variables
$primary-color: #ffbc3b;
$secondary-color: #1a1a37;
$text-color: #5c5c77;
$text-color-light: #8585a4;
$text-color-dark: #1e1e4b;
$body-color: #fff;
$border-color: #ededf1;
$black: #000;
$white: #fff;
$light: #f8f9fe;
$gray: #f8f8f8;
// Font Variables
$primary-font: 'Ubuntu', sans-serif;
$secondary-font: 'Fira Sans', sans-serif;
$icon-font: 'Material Design Icons';

@ -1,5 +1,3 @@
@import 'variables';
@import 'mixins'; @import 'mixins';
@import 'typography'; @import 'typography';

@ -1,6 +1,6 @@
.feature-icon { .feature-icon {
font-size: 60px; font-size: 60px;
color: $secondary-color; color: var(--gcg-color-secondary);
display: inline-block; display: inline-block;
} }
@ -69,8 +69,8 @@
height: 80px; height: 80px;
width: 80px; width: 80px;
border-radius: 50%; border-radius: 50%;
background: $primary-color; background: var(--gcg-color-primary);
color: $white; color: white;
font-size: 25px; font-size: 25px;
text-align: center; text-align: center;
@ -84,7 +84,7 @@
height: 0; height: 0;
width: 0; width: 0;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
background: $white; background: white;
border-radius: 50%; border-radius: 50%;
top: 50%; top: 50%;
left: 50%; left: 50%;
@ -99,7 +99,7 @@
height: 80%; height: 80%;
width: 80%; width: 80%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
background: $primary-color; background: var(--gcg-color-primary);
border-radius: 50%; border-radius: 50%;
top: 50%; top: 50%;
left: 50%; left: 50%;

@ -11,32 +11,32 @@
} }
.navigation { .navigation {
background: linear-gradient(to right, transparent 50%, $primary-color 50%); background: linear-gradient(to right, transparent 50%, var(--gcg-color-primary) 50%);
transition: .2s ease; transition: .2s ease;
@include desktop { @include desktop {
background: $secondary-color; background: var(--gcg-color-secondary);
} }
} }
.navbar-collapse{ .navbar-collapse{
@include desktop { @include desktop {
background: $secondary-color; background: var(--gcg-color-secondary);
} }
} }
.navbar-nav { .navbar-nav {
padding-left: 50px; padding-left: 50px;
background: $primary-color; background: var(--gcg-color-primary);
@include desktop { @include desktop {
padding-left: 0; padding-left: 0;
background: $secondary-color; background: var(--gcg-color-secondary);
} }
} }
.nav-bg { .nav-bg {
background-color: $secondary-color; background-color: var(--gcg-color-secondary);
} }
.nav-item { .nav-item {
@ -55,7 +55,7 @@
height: 6px; height: 6px;
width: 100%; width: 100%;
content: ""; content: "";
background: $white; background: white;
transform: scaleY(0); transform: scaleY(0);
transform-origin: top; transform-origin: top;
transition: transform .3s ease; transition: transform .3s ease;
@ -71,19 +71,19 @@
} }
.navbar-dark .navbar-nav .nav-link { .navbar-dark .navbar-nav .nav-link {
color: $white; color: white;
} }
link:focus, link:focus,
.navbar-dark .navbar-nav .nav-link:hover { .navbar-dark .navbar-nav .nav-link:hover {
color: $white; color: white;
} }
.navbar-dark .navbar-nav .active>.nav-link, .navbar-dark .navbar-nav .active>.nav-link,
.navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .nav-link.active,
.navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .nav-link.show,
.navbar-dark .navbar-nav .show>.nav-link { .navbar-dark .navbar-nav .show>.nav-link {
color: $white; color: white;
} }
.navbar-expand-lg .navbar-nav .nav-link { .navbar-expand-lg .navbar-nav .nav-link {
@ -99,7 +99,7 @@ link:focus,
top: 0; top: 0;
width: 100%; width: 100%;
z-index: 10; z-index: 10;
background: $white; background: white;
box-shadow: 0 2px 5px #0000000d; box-shadow: 0 2px 5px #0000000d;
} }
@ -115,7 +115,7 @@ link:focus,
&-menu { &-menu {
box-shadow: 0px 3px 9px 0px rgba(0, 0, 0, 0.12); box-shadow: 0px 3px 9px 0px rgba(0, 0, 0, 0.12);
border-bottom: 5px solid $primary-color; border-bottom: 5px solid var(--gcg-color-primary);
padding: 15px; padding: 15px;
top: 96px; top: 96px;
border-radius: 0; border-radius: 0;
@ -124,7 +124,7 @@ link:focus,
transition: .3s ease; transition: .3s ease;
opacity: 0; opacity: 0;
transform: translateY(20px); transform: translateY(20px);
background: $white; background: white;
@include desktop { @include desktop {
display: none; display: none;
@ -146,10 +146,10 @@ link:focus,
&-item { &-item {
position: relative; position: relative;
color: $text-color-dark; color: var(--gcg-color-secondary);
transition: .2s ease; transition: .2s ease;
text-transform: capitalize; text-transform: capitalize;
font-family: $primary-font; font-family: var(--gcg-font-primary);
@include desktop { @include desktop {
text-align: center; text-align: center;
@ -160,7 +160,7 @@ link:focus,
} }
&:hover { &:hover {
color: $primary-color; color: var(--gcg-color-primary);
background: transparent; background: transparent;
} }
} }

@ -10,7 +10,7 @@
</div> </div>
<div class="col-12"> <div class="col-12">
<div class="row mb-3"> <div class="row mb-3">
<div class="col-6 mb-md-0 text-light"> <div class="col-6 mb-md-0 text-white text-body-tertiary">
<span class="fw-bold me-1">{{ i18n "posted_by" }}:</span> <span class="fw-bold me-1">{{ i18n "posted_by" }}:</span>
{{ range $index, $elements := where (where .Site.RegularPages "Type" "author") "File.BaseFileName" "in" .Params.author }} {{ range $index, $elements := where (where .Site.RegularPages "Type" "author") "File.BaseFileName" "in" .Params.author }}
{{ if ne $index 0 }}, {{ end }} {{ if ne $index 0 }}, {{ end }}
@ -21,13 +21,13 @@
{{ end }} {{ end }}
{{ end }} {{ end }}
</div> </div>
<div class="col-6 mb-3 mb-md-0 text-light"> <div class="col-6 mb-3 mb-md-0 text-body-tertiary">
<span class="fw-bold me-1">{{ i18n "date" }}:</span> <span class="fw-bold me-1">{{ i18n "date" }}:</span>
{{ time.Format "02. Jan 2006" .PublishDate }} {{ time.Format "02. Jan 2006" .PublishDate }}
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-12 mb-md-0 text-light"> <div class="col-12 mb-md-0 text-body-tertiary">
<span class="fw-bold me-1">{{ i18n "category" }}:</span> <span class="fw-bold me-1">{{ i18n "category" }}:</span>
{{ range $index, $elements := .Params.categories }} {{ range $index, $elements := .Params.categories }}
{{ if ne $index 0 }}, {{ end }} {{ if ne $index 0 }}, {{ end }}

@ -1,6 +1,6 @@
{{ define "main" }} {{ define "main" }}
<section class="section-sm bg-gray"> <section class="section-sm bg-body-tertiary">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-lg-8 mb-4 mb-lg-0"> <div class="col-lg-8 mb-4 mb-lg-0">

@ -8,7 +8,7 @@
</div> </div>
<div class="col-md-7 mb-5"> <div class="col-md-7 mb-5">
<h3>{{ .Params.Name }}</h3> <h3>{{ .Params.Name }}</h3>
<h6 class="text-color">{{ .Title }}</h6> <h6 class="text-body-secondary">{{ .Title }}</h6>
<div class="content"> <div class="content">
{{ .Content | markdownify }} {{ .Content | markdownify }}
</div> </div>

@ -216,7 +216,7 @@
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-12 text-center"> <div class="col-12 text-center">
<h2 class="text-white font-secondary mb-0">{{ .title | markdownify }}</h2> <h2 class="text-white mb-0">{{ .title | markdownify }}</h2>
<h5 class="section-title text-white">{{ .subtitle | markdownify }}</h5> <h5 class="section-title text-white">{{ .subtitle | markdownify }}</h5>
{{ if .button.enable }} {{ if .button.enable }}
{{ with .button }} {{ with .button }}
@ -235,7 +235,7 @@
{{ end }} {{ end }}
{{ if $data.homepage.termine.enable }} {{ if $data.homepage.termine.enable }}
<section class="section-sm bg-gray"> <section class="section-sm bg-body-tertiary">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-12"> <div class="col-12">
@ -281,8 +281,8 @@
<div class="container"> <div class="container">
<div class="row align-items-center"> <div class="row align-items-center">
<div class="col-md-7 order-2 order-md-1"> <div class="col-md-7 order-2 order-md-1">
<h3 class="section-title text-white font-secondary">{{ .title | markdownify }}</h2> <h3 class="section-title text-white">{{ .title | markdownify }}</h2>
<div class="content "> <div class="content text-white text-opacity-50">
{{ .content | markdownify }} {{ .content | markdownify }}
</div> </div>
{{ if .button.enable }} {{ if .button.enable }}

@ -8,7 +8,7 @@ crossorigin=""/>
integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA==" integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA=="
crossorigin=""></script> crossorigin=""></script>
<section class="section-sm pb-0 bg-gray"> <section class="section-sm pb-0 bg-body-tertiary">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-lg-6 mb-4 mb-lg-0"> <div class="col-lg-6 mb-4 mb-lg-0">
@ -48,7 +48,7 @@ crossorigin=""/>
</div> </div>
</section> </section>
<section class="section-sm bg-gray"> <section class="section-sm bg-body-tertiary">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div id="map" class="card col-12" style="height: 50vh;"> <div id="map" class="card col-12" style="height: 50vh;">

@ -4,7 +4,7 @@
<div class="row"> <div class="row">
<div class="col-lg-3 col-sm-8 mb-5 mb-lg-0"> <div class="col-lg-3 col-sm-8 mb-5 mb-lg-0">
<a class="logo-footer" href="{{ .Site.BaseURL | relLangURL }}"><img class="mb-4" height="60" src="{{ .Site.Params.logo | absURL }}" alt="{{ .Site.Title }}"></a> <a class="logo-footer" href="{{ .Site.BaseURL | relLangURL }}"><img class="mb-4" height="60" src="{{ .Site.Params.logo | absURL }}" alt="{{ .Site.Title }}"></a>
<ul class="list-unstyled"> <ul class="list-unstyled text-white text-opacity-50">
<li class="mb-4"> <li class="mb-4">
<a href="{{ .Site.Params.route_link }}">{{ .Site.Params.address | markdownify }}</a> <a href="{{ .Site.Params.route_link }}">{{ .Site.Params.address | markdownify }}</a>
</li> </li>
@ -22,7 +22,7 @@
<h4 class="text-white mb-5 text-uppercase">{{ i18n "links" }}</h4> <h4 class="text-white mb-5 text-uppercase">{{ i18n "links" }}</h4>
<ul class="list-unstyled"> <ul class="list-unstyled">
{{ range .Site.Menus.footer }} {{ range .Site.Menus.footer }}
<li class="mb-3"><a class="text-color" href="{{ .URL | absLangURL }}">{{ .Name }}</a></li> <li class="mb-3"><a class="text-white text-opacity-50" href="{{ .URL | absLangURL }}">{{ .Name }}</a></li>
{{ end }} {{ end }}
</ul> </ul>
</div> </div>
@ -30,7 +30,7 @@
<h4 class="text-white mb-5 text-uppercase">{{ i18n "clubs_footer" }}</h4> <h4 class="text-white mb-5 text-uppercase">{{ i18n "clubs_footer" }}</h4>
<ul class="list-unstyled"> <ul class="list-unstyled">
{{ range first 5 (where .Site.RegularPages "Type" "ganztagsangebote" | shuffle)}} {{ range first 5 (where .Site.RegularPages "Type" "ganztagsangebote" | shuffle)}}
<li class="mb-3"><a class="text-color" href="{{ .Permalink }}">{{ .Title }}</a></li> <li class="mb-3"><a class="text-white text-opacity-50" href="{{ .Permalink }}">{{ .Title }}</a></li>
{{ end }} {{ end }}
</ul> </ul>
</div> </div>
@ -38,7 +38,7 @@
<h4 class="text-white mb-5 text-uppercase">Aktuelles</h4> <h4 class="text-white mb-5 text-uppercase">Aktuelles</h4>
<ul class="list-unstyled"> <ul class="list-unstyled">
{{ range first 5 (where .Site.RegularPages "Type" "post")}} {{ range first 5 (where .Site.RegularPages "Type" "post")}}
<li class="mb-3"><a class="text-color" href="{{ .Permalink }}">{{ .Title | truncate 35 }}</a></li> <li class="mb-3"><a class="text-white text-opacity-50" href="{{ .Permalink }}">{{ .Title | truncate 35 }}</a></li>
{{ end }} {{ end }}
</ul> </ul>
</div> </div>

@ -6,7 +6,7 @@
<div class="col-lg-4 text-center text-lg-start"> <div class="col-lg-4 text-center text-lg-start">
<ul class="list-inline"> <ul class="list-inline">
{{ range .Site.Params.social }} {{ range .Site.Params.social }}
<li class="list-inline-item mx-0"><a class="d-inline-block p-2 text-color" href="{{ .link | safeURL }}"><i <li class="list-inline-item mx-0"><a class="d-inline-block p-2 text-body-secondary" href="{{ .link | safeURL }}"><i
class="{{ .icon }}"></i></a></li> class="{{ .icon }}"></i></a></li>
{{ end }} {{ end }}
</ul> </ul>
@ -14,11 +14,11 @@
<div class="col-lg-8 text-center text-lg-end"> <div class="col-lg-8 text-center text-lg-end">
<ul class="list-inline"> <ul class="list-inline">
<li class="list-inline-item"> <li class="list-inline-item">
<a class="text-color me-3" href="tel:{{ .Site.Params.mobile }}"><strong>{{ i18n "call" | upper }} : <a class="text-body-secondary me-3" href="tel:{{ .Site.Params.mobile }}"><strong>{{ i18n "call" | upper }} :
</strong> {{ .Site.Params.mobile }}</a> </strong> {{ .Site.Params.mobile }}</a>
</li> </li>
<li class="list-inline-item"> <li class="list-inline-item">
<a class="text-color" href="mailto:{{ .Site.Params.email }}"><strong>{{ i18n "email" | upper }} : <a class="text-body-secondary" href="mailto:{{ .Site.Params.email }}"><strong>{{ i18n "email" | upper }} :
</strong> {{ .Site.Params.email_label | safeHTML }}</a> </strong> {{ .Site.Params.email_label | safeHTML }}</a>
</li> </li>
</ul> </ul>

@ -3,11 +3,11 @@
<div class="row"> <div class="row">
<div class="col-md-8 position-relative"> <div class="col-md-8 position-relative">
<ul class="list-inline"> <ul class="list-inline">
<li class="list-inline-item h2" data-pagefind-ignore><a class="text-primary font-secondary" href="{{ if .Params.Previous.enable }}{{ .Params.Previous.link }}{{ else if .Parent.Page }}{{ .Parent.Page.Permalink }}{{ else }}{{ .Site.baseURL | absLangURL }}{{ end }}">{{ if .Params.previous.enable }}{{ .Params.previous.title }}{{ else }}{{ with .Parent.Params.title }}{{.}}{{ else }}{{ .Site.Params.home }}{{ end }}{{ end }}</a></li> <li class="list-inline-item h2" data-pagefind-ignore><a class="text-primary font-header" href="{{ if .Params.Previous.enable }}{{ .Params.Previous.link }}{{ else if .Parent.Page }}{{ .Parent.Page.Permalink }}{{ else }}{{ .Site.baseURL | absLangURL }}{{ end }}">{{ if .Params.previous.enable }}{{ .Params.previous.title }}{{ else }}{{ with .Parent.Params.title }}{{.}}{{ else }}{{ .Site.Params.home }}{{ end }}{{ end }}</a></li>
<li class="list-inline-item h2"><i class="mdi mdi-chevron-double-right text-white"></i></li> <li class="list-inline-item h2"><i class="mdi mdi-chevron-double-right text-white"></i></li>
<li class="list-inline-item text-white h2 font-secondary">{{ .Title }}</li> <li class="list-inline-item text-white h2 font-header">{{ .Title }}</li>
</ul> </ul>
<p class="text-lighten">{{ .Params.description | markdownify }}</p> <p class="text-white text-opacity-75">{{ .Params.description | markdownify }}</p>
</div> </div>
</div> </div>
</div> </div>

@ -47,7 +47,7 @@
{{ if and .Params.pretext (ne .Params.pretext "\n\n\n") }} {{ if and .Params.pretext (ne .Params.pretext "\n\n\n") }}
{{ partial "modal" (dict "title" .Title "content" .Params.pretext) }} {{ partial "modal" (dict "title" .Title "content" .Params.pretext) }}
{{ end }} {{ end }}
<div id="wc-canvas" class="wc-canvas"></div> <div id="wc-canvas"></div>
{{ $topics := slice }} {{ $topics := slice }}
{{ if .Params.pretext }} {{ if .Params.pretext }}
{{ $topics = $topics | append (slice (slice .Params.Title 200 (md5 .Title))) }} {{ $topics = $topics | append (slice (slice .Params.Title 200 (md5 .Title))) }}

@ -5,7 +5,7 @@ const AnmeldeformularPreview = ({ widgetFor, entry }) => {
PageHeader(entry), PageHeader(entry),
h( h(
"section", "section",
{ className: "section-sm bg-gray" }, { className: "section-sm bg-body-tertiary" },
h( h(
"div", "div",
{ className: "container" }, { className: "container" },

@ -34,13 +34,13 @@ const BlogPreview = ({ widgetFor, entry, fields, collection }) => {
{ className: "row mb-3" }, { className: "row mb-3" },
h( h(
"div", "div",
{ className: "col-6 mb-md-0 text-light" }, { className: "col-6 mb-md-0 text-body-tertiary" },
h("span", { className: "fw-bold me-1" }, "Geschrieben von:"), h("span", { className: "fw-bold me-1" }, "Geschrieben von:"),
widgetFor("author") widgetFor("author")
), ),
h( h(
"div", "div",
{ className: "col-6 mb-3 mb-md-0 text-light" }, { className: "col-6 mb-3 mb-md-0 text-body-tertiary" },
h("span", { className: "fw-bold me-1" }, "Datum:"), h("span", { className: "fw-bold me-1" }, "Datum:"),
entry.data.date entry.data.date
? DateFormat({ ? DateFormat({
@ -58,7 +58,7 @@ const BlogPreview = ({ widgetFor, entry, fields, collection }) => {
Row( Row(
h( h(
"div", "div",
{ className: "col-12 mb-md-0 text-light" }, { className: "col-12 mb-md-0 text-body-tertiary" },
h("span", { className: "fw-bold me-1" }, "Kategorie:"), h("span", { className: "fw-bold me-1" }, "Kategorie:"),
entry.data.categories entry.data.categories
? entry.data.categories.map( ? entry.data.categories.map(

@ -37,7 +37,7 @@ const CantorpreisPreview = ({ widgetFor, entry, fields, collection }) => {
"div", "div",
{ className: "col-md-7 mb-5" }, { className: "col-md-7 mb-5" },
h("h3", {}, entry.data.name), h("h3", {}, entry.data.name),
h("h6", { className: "text-color" }, entry.data.title), h("h6", { className: "text-body-secondary" }, entry.data.title),
Content(widgetFor("body")) Content(widgetFor("body"))
), ),
]) ])

@ -26,7 +26,7 @@ const PageHeader = (entry) => {
{ className: "list-inline-item h2" }, { className: "list-inline-item h2" },
h( h(
"font", "font",
{ className: "text-primary font-secondary", href: "" }, { className: "text-primary font-header", href: "" },
"Startseite" "Startseite"
) )
), ),
@ -37,11 +37,11 @@ const PageHeader = (entry) => {
), ),
h( h(
"li", "li",
{ className: "list-inline-item text-white h2 font-secondary" }, { className: "list-inline-item text-white h2 font-header" },
entry.data.title entry.data.title
) )
), ),
h("p", { className: "text-lighten" }, entry.data.description) h("p", { className: "text-white text-opacity-75" }, entry.data.description)
) )
) )
) )

@ -5,7 +5,7 @@ const KontaktPreview = ({ widgetsFor, entry }) => {
PageHeader(entry), PageHeader(entry),
h( h(
"section", "section",
{ className: "section-sm bg-gray" }, { className: "section-sm bg-body-tertiary" },
h( h(
"div", "div",
{ className: "container" }, { className: "container" },