Adding banner

This commit is contained in:
Michael Boelen 2024-11-20 15:42:55 +00:00
parent a6311b8611
commit c716a53367
4 changed files with 46 additions and 1 deletions

View file

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="870px" height="300px" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><path d="M866.25,0c2.071,0 3.75,1.679 3.75,3.75c0,32.111 0,260.389 0,292.5c-0,2.071 -1.679,3.75 -3.75,3.75c-59.315,0 -803.185,0 -862.5,0c-2.071,-0 -3.75,-1.679 -3.75,-3.75c0,-32.111 0,-260.389 0,-292.5c0,-2.071 1.679,-3.75 3.75,-3.75c59.315,0 803.185,0 862.5,0Z" style="fill:#26266b;"/><clipPath id="_clip1"><path d="M866.25,0c2.071,0 3.75,1.679 3.75,3.75c0,32.111 0,260.389 0,292.5c-0,2.071 -1.679,3.75 -3.75,3.75c-59.315,0 -803.185,0 -862.5,0c-2.071,-0 -3.75,-1.679 -3.75,-3.75c0,-32.111 0,-260.389 0,-292.5c0,-2.071 1.679,-3.75 3.75,-3.75c59.315,0 803.185,0 862.5,0Z"/></clipPath><g clip-path="url(#_clip1)"><path d="M1148.56,64.582c0.717,0.414 0.963,1.331 0.549,2.049c-15.377,26.634 -262.232,454.2 -277.61,480.835c-0.414,0.717 -1.332,0.963 -2.049,0.549c-23.931,-13.817 -370.769,-214.064 -394.701,-227.881c-0.717,-0.414 -0.963,-1.332 -0.549,-2.049c15.378,-26.635 262.233,-454.2 277.61,-480.835c0.415,-0.717 1.332,-0.963 2.049,-0.549c23.932,13.817 370.77,214.064 394.701,227.881Z" style="fill:#fa198b;"/></g></svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

View file

@ -0,0 +1,29 @@
div.banner {
@media (max-width: 768px) {
display: none;
}
@media (min-width: 768px) {
background-color: $midnight-blue-dark;
background-image: url("/afbeeldingen/achtergronden/banner.svg");
background-size: cover;
border-radius: 5px;
align-content: center;
display: visible;
height: auto;
margin: 0 auto;
margin-bottom: 2rem;
position: relative;
div {
margin-left: auto;
margin-right: auto;
width: 50%;
ul {
display: block;
color: white;
font-size: 2.2em;
font-weight: bold;
padding: 2rem;
}
}
}
}

View file

@ -0,0 +1,5 @@
ul.nomarkup {
list-style-type: none;
padding: 0;
}

View file

@ -1,6 +1,16 @@
{{ define "main" }} {{ define "main" }}
<article> <article>
<div class="banner">
<div>
<ul class="nomarkup">
<li>Open source</li>
<li>Open systemen</li>
<li>Open standaarden</li>
</ul>
</div>
</div>
<div class="grid-row"> <div class="grid-row">
<div class="grid-two-thirds">{{ .Content }} <div class="grid-two-thirds">{{ .Content }}
@ -57,7 +67,7 @@
</li> </li>
{{ end }} {{ end }}
</ul> </ul>
<a class="btn btn-cta" href="{{ relref . "/evenementen/kalender/" }}">Bekijk kalender</a> <a class="btn btn-cta" href="/evenementen/kalender/">Bekijk kalender</a>
</section> </section>
</div> </div>