vanilla.engineering/mainpage_v2_theme
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

großer Umbau Teil 1

Browse source
This commit is contained in:
edi 2024-04-03 22:13:59 +02:00
parent d2755b52fd
commit 5cc3f3b9c4
13 changed files with 82 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
assets/scss/sections/hero.scss
View file

@ -1,16 +1,22 @@
.section.hero {
.col-12 {padding-top: 3rem;}
.hero-image {
// @media (min-width: 1400px) {
// img {
// max-width: 125%;
// float: right;
// }
// }
@media (min-width: 1400px) {
img {
max-width: 125%;
float: right;
}
}
}
.hero-title {
strong {
color: $danger;
}
}
background: red;
background: url(/images/cover-image.jpg);
background-size: 100%;
background-repeat: no-repeat;
p.text-xl-start {background-color: #ffffff90; padding: 10px;}
a.btn {background-color: #ffffff90;}
a.btn:hover {background-color: $primary}
}

6
assets/scss/sections/vorteile.scss Normal file
View file

@ -0,0 +1,6 @@
.section.vorteile {
.card.bg-vorteil {
background-color: $light;
}
background-color: $primary;
}

2
assets/scss/shared/_bootstrap.scss
View file

@ -9,7 +9,7 @@ $font-family-base: "Inter", sans-serif;
$primary: #aa69b5;
$secondary: #5d2169;
$danger: #FF87ff;
$danger: #5d2169;
$light: #faefdd;
// scss-docs-start import-stack

10
assets/scss/shared/_header.scss
View file

@ -1,8 +1,18 @@
.navbar {
position: fixed;
z-index: 100;
width: 100%;
background-color: $light;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='380' height='380' viewBox='0 0 800 800'%3E%3Cg fill='none' stroke='%23E4CBA1' stroke-width='1'%3E%3Cpath d='M769 229L1037 260.9M927 880L731 737 520 660 309 538 40 599 295 764 126.5 879.5 40 599-197 493 102 382-31 229 126.5 79.5-69-63'/%3E%3Cpath d='M-31 229L237 261 390 382 603 493 308.5 537.5 101.5 381.5M370 905L295 764'/%3E%3Cpath d='M520 660L578 842 731 737 840 599 603 493 520 660 295 764 309 538 390 382 539 269 769 229 577.5 41.5 370 105 295 -36 126.5 79.5 237 261 102 382 40 599 -69 737 127 880'/%3E%3Cpath d='M520-140L578.5 42.5 731-63M603 493L539 269 237 261 370 105M902 382L539 269M390 382L102 382'/%3E%3Cpath d='M-222 42L126.5 79.5 370 105 539 269 577.5 41.5 927 80 769 229 902 382 603 493 731 737M295-36L577.5 41.5M578 842L295 764M40-201L127 80M102 382L-261 269'/%3E%3C/g%3E%3Cg fill='%2398886B'%3E%3Ccircle cx='769' cy='229' r='5'/%3E%3Ccircle cx='539' cy='269' r='5'/%3E%3Ccircle cx='603' cy='493' r='5'/%3E%3Ccircle cx='731' cy='737' r='5'/%3E%3Ccircle cx='520' cy='660' r='5'/%3E%3Ccircle cx='309' cy='538' r='5'/%3E%3Ccircle cx='295' cy='764' r='5'/%3E%3Ccircle cx='40' cy='599' r='5'/%3E%3Ccircle cx='102' cy='382' r='5'/%3E%3Ccircle cx='127' cy='80' r='5'/%3E%3Ccircle cx='370' cy='105' r='5'/%3E%3Ccircle cx='578' cy='42' r='5'/%3E%3Ccircle cx='237' cy='261' r='5'/%3E%3Ccircle cx='390' cy='382' r='5'/%3E%3C/g%3E%3C/svg%3E");
/* background by SVGBackgrounds.com */
.navbar-brand {
img {
width: auto;
max-height: calc(1.4rem + .6vw);
}
}
}
a.nav-link.text-primary {
background-color: $light;
}

1
assets/scss/shared/shared.scss
View file

@ -12,6 +12,7 @@
@import "../sections/services";
@import "../sections/testimonials";
@import "../sections/cta";
@import "../sections/vorteile";
@import "../sections/blog-list";
@import "../sections/blog-single";

1
layouts/index.html
View file

@ -1,5 +1,6 @@
{{ define "main" }}
{{ with .Site.Data.home.hero }}{{ partial "sections/hero.html" . }}{{ end }}
{{ with .Site.Data.home.vorteile }}{{ partial "sections/vorteile.html" . }}{{ end }}
{{ with .Site.Data.home.brands }}{{ partial "sections/brands.html" . }}{{ end }}
{{ with .Site.Data.home.portfolio }}{{ partial "sections/portfolio.html" . }}{{ end }}
{{ with .Site.Data.home.services }}{{ partial "sections/services.html" . }}{{ end }}

6
layouts/partials/sections/hero.html
View file

@ -3,10 +3,10 @@
<div class="container">
<div class="row flex-column flex-xl-row-reverse">
<div class="col-12 col-xl-6 d-flex flex-column justify-content-center hero-image">
{{ partial "utilities/image-fluid" "images/hero-image.png" }}
{{ partial "utilities/image-fluid" "/images/ve_logo_notext.png" }}
</div>
<div class="col-12 col-xl-6 d-flex flex-column justify-content-center">
{{ with .content.title }}
<a name="hero">{{ with .content.title }}
<h3 class="hero-title fw-bold display-1 text-primary text-center text-xl-start pb-4">{{ . | markdownify }}</h3>
{{ end }}
{{ with .content.text }}
@ -17,7 +17,7 @@
<a class="btn btn-primary text-light px-4 my-1" href="{{ .url }}">{{ .label }}</a>
{{ end }}
{{ with .content.buttonSecondary }}
<a class="btn btn-outline-primary px-4 my-1 ms-xl-4" href="{{ .url }}">{{ .label }}<span class="ms-2">{{ partial "icons/arrow-right.html" }}</span></a>
<a class="btn btn-outline-primary px-4 my-1 ms-xl-4" href="{{ .url }}">{{ .label }}<span class="ms-2"></span></a>
{{ end }}
</div>
</div>

8
layouts/partials/sections/portfolio.html
View file

@ -1,3 +1,4 @@
{{ if .enabled }}
<section class="section portfolio">
<div class="container">
{{ range .content }}
@ -9,13 +10,13 @@
</div>
<div class="col-12 col-xl-6 d-flex flex-column justify-content-center">
{{ with .pretitle }}
<p class="text-danger fw-semibold mb-2">{{ . }}</p>
<p class="text-danger fw-semibold mb-2">{{ . | markdownify }}</p>
{{ end }}
{{ with .title }}
<h3 class="fs-1 fw-bold text-primary pb-3">{{ . }}</h3>
<h3 class="fs-1 fw-bold text-primary pb-3">{{ . | markdownify }}</h3>
{{ end }}
{{ with .text }}
<p class="text-black-61 pb-3">{{ . }}</p>
<p class="text-black-61 pb-3">{{ . | markdownify }}</p>
{{ end }}
<div class="">
{{ range .buttons }}
@ -27,3 +28,4 @@
{{ end }}
</div>
</section>
{{ end }}

2
layouts/partials/sections/services.html
View file

@ -1,3 +1,4 @@
{{ if .enabled }}
<section class="section services py-5">
<div class="container">
<div class="row justify-content-center pb-5">
@ -26,3 +27,4 @@
</div>
</div>
</section>
{{ end }}

2
layouts/partials/sections/testimonials.html
View file

@ -1,3 +1,4 @@
{{ if .enabled }}
<section class="section testimonials py-5">
<div class="container">
<div class="row pb-5">
@ -46,3 +47,4 @@
</div>
</div>
</section>
{{ end }}

30
layouts/partials/sections/vorteile.html Normal file
View file

@ -0,0 +1,30 @@
{{ if .enabled }}
<section class="section vorteile py-5">
<div class="container">
<div class="row justify-content-center pb-5">
<div class="col-12 col-xl-6">
{{ with .content.title }}
<h3 class="fs-1 fw-bold text-center text-white pb-3">{{ . }}</h3>
{{ end }}
{{ with .content.text }}
<p class="text-white text-center pb-3">{{ . | markdownify }}</p>
{{ end }}
</div>
</div>
<div class="row g-5">
{{ range .content.cards }}
<div class="col-12 col-xl-4">
<div class="card bg-vorteil border-0 border-radius-34 p-4">
{{ with .image }}{{ partial "utilities/image-fluid.html" . }}{{ end }}
<div class="card-body text-center">
{{ with .title }}<h4 class="card-title text-center text-primary pb-4">{{ . }}</h4>{{ end }}
{{ with .text }}<p class="card-text text-black-61 pb-4">{{ . | markdownify }}</p>{{ end }}
{{ with .button }}<a class="btn btn-outline-primary px-4" href="{{ .url }}">{{ .label }}</a>{{ end }}
</div>
</div>
</div>
{{ end }}
</div>
</div>
</section>
{{ end }}

6
layouts/partials/shared/header.html
View file

@ -1,8 +1,8 @@
<nav class="navbar navbar-expand-xl navbar-light bg-light py-4">
<nav class="navbar navbar-expand-xl navbar-light py-4">
<div class="container">
<a class="navbar-brand d-flex align-items-center" href="{{ .Site.BaseURL }}">
{{ partial "utilities/image.html" "images/logo.png" }}
<span class="fs-3 fw-semibold text-uppercase text-primary">{{ .Site.Title }}</span>
<span class="text-logo">{{ .Site.Title }}</span>
<img src="images/ve_logo.svg" heigth="86px">
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarContent" aria-controls="navbarContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>

5
layouts/partials/utilities/card-img-top.html
View file

@ -1,3 +1,8 @@
{{ with resources.Get . }}
{{ if eq .MediaType.SubType "svg" }}
<img class="" src="{{ .Permalink }}" alt="{{ .Title }}">
{{ else }}
<img class="" src="{{ .Permalink }}" alt="{{ .Title }}" width="{{ .Width }}" height="{{ .Height }}">
{{ end }}
{{ end }}