GARAGENUM/ltqf
15
0
Fork 0
Code Issues 5 Pull Requests Packages Projects Releases 1 Wiki Activity

responsive logo
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
Carmen Ngaka Iziasuma 2024-01-26 15:54:24 +01:00
parent 033e1f88ae
commit 4929c9db8f
12 changed files with 80 additions and 117 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
assets/css/bulma.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

60
assets/js/single-spectacle-carousel_bak.js
View File

@ -1,60 +0,0 @@
document.addEventListener('DOMContentLoaded', function() {
var slider = document.querySelector('#galerie');
var items = slider.querySelectorAll('picture');
let itemWidth = items[0].offsetWidth;
let currentIndex = 0;
function moveItems() {
currentIndex = (currentIndex + 1);
let translationVector;
let fastTranslationVector;
let modIndex;
modIndex = currentIndex % items.length;
items.forEach((item, index) => {
//item.style.visibility = "visible";
if (modIndex >= 3 ) {
if (index <= modIndex - 3) {
if (index == modIndex - 3) {
item.classList.add("goR");
fastTranslationVector = (3 + items.length - modIndex) * itemWidth;
item.style.transform = `translateX(${fastTranslationVector}px)`;
setTimeout(function () {
item.classList.remove("goR");
}, 1000);
}
item.classList.remove("goR");
translationVector = (items.length - modIndex) * itemWidth;
} else {
translationVector = itemWidth * -1 * modIndex;
}
} else if (modIndex < 3) {
if (index <= modIndex + (items.length - 3)) {
if ((index == modIndex + (items.length - 3)) && (currentIndex >= items.length)){
item.classList.add("goR");
fastTranslationVector = (3 + items.length - modIndex) * itemWidth;
item.style.transform = `translateX(${fastTranslationVector}px)`;
setTimeout(function () {
item.classList.remove("goR");
}, 1000);
}
translationVector = itemWidth * -1 * modIndex;
} else {
if (currentIndex < items.length) {
translationVector = -1 * itemWidth * modIndex;
} else {
translationVector = -1 * (items.length + modIndex) * itemWidth;
}
}
};
//translationVector = itemWidth * modIndex * -1;
console.log(translationVector);
item.style.transform = `translateX(${translationVector}px)`;
});
}
if (items.length > 3){
setInterval(moveItems, 5000); // Move items every 5 seconds
}
});

0
static/logo_home.webp → assets/logo_home.webp
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 10 KiB

0
static/ltqf.webp → assets/ltqf.webp
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.9 KiB

After

Width:  |  Height:  |  Size: 4.9 KiB

10
layouts/_default/baseof.html
View File

@ -4,8 +4,9 @@
<!-- Bloc pour les styles CSS -->
{{ $customCSS := resources.Get "css/style.css" | resources.ToCSS }}
<link rel="preload" href="{{ $customCSS.RelPermalink }}" as="style" onload="this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="{{ $customCSS.RelPermalink }}"></noscript>
<!--<link rel="preload" href="{{ $customCSS.RelPermalink }}" as="style" onload="this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="{{ $customCSS.RelPermalink }}"></noscript>-->
<link rel="stylesheet" href="{{ $customCSS.RelPermalink }}">
{{- block "styles" . }}{{- end }}
</head>
<body>
@ -30,10 +31,11 @@
</a>
</div>
{{ end }}
</section>
</div>
{{ partial "navbarbottom.html" .}}
</section>
</div>
</main>
{{- end }}

5
layouts/index.html
View File

@ -1,7 +1,8 @@
{{ define "styles"}}
{{ $customCSS := resources.Get "css/index.css" | resources.ToCSS }}
<link rel="preload" href="{{ $customCSS.RelPermalink }}" as="style" onload="this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="{{ $customCSS.RelPermalink }}"></noscript>
<!--<link rel="preload" href="{{ $customCSS.RelPermalink }}" as="style" onload="this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="{{ $customCSS.RelPermalink }}"></noscript>-->
<link rel="stylesheet" href="{{ $customCSS.RelPermalink }}">
<style>
.carousel-item {
position: absolute;

27
layouts/partials/navbar.html
View File

@ -6,9 +6,28 @@
<a href="/" aria-label="Lien vers la page d'accueil">
<div class="figure">
{{ if .IsHome }}
<img src="{{ $.Site.Params.logoHome |relURL }}" alt="Logo de la compagnie Le Temps Qu'il Faut" class="image is-1by1 p-5" width="284px" height="128px">
{{- $webpxs := (resources.Get $.Site.Params.logoHome).Resize "192x webp drawing"}}
{{- $webps := (resources.Get $.Site.Params.logoHome).Resize "256x webp drawing" }}
{{- $webpm := (resources.Get $.Site.Params.logoHome).Resize "360x webp drawing" }}
{{- $webpl := (resources.Get $.Site.Params.logoHome).Resize "480x webp drawing" }}
{{- $webpxl := (resources.Get $.Site.Params.logoHome).Resize "640x webp drawing" }}
<img src="{{ resources.Get $.Site.Params.logoHome |relURL }}"
alt="Logo de la compagnie Le Temps Qu'il Faut"
class="image is-1by1 p-5"
width="284px"
height="128px"
srcset="{{ $webpxs.Permalink }} {{ $webpxs.Width}}w
{{ $webps.Permalink }} {{ $webps.Width}}w
{{ $webpm.Permalink }} {{ $webpm.Width}}w
{{ $webpl.Permalink }} {{ $webpl.Width}}w
{{ $webpxl.Permalink }} {{ $webpxl.Width}}w"
sizes="(max-width: 1023px) 122px,
(max-width: 1439px) 172px,
(max-width: 1919px) 230px,
(max-width: 2559px) 307px,
640px">
{{ else }}
<img src="{{ $.Site.Params.logo |relURL }}" alt="Logo de la compagnie Le Temps Qu'il Faut" class="image is-1by1 p-5" width="279px" height="124px">
<img src="{{ resources.Get $.Site.Params.logo |relURL }}" alt="Logo de la compagnie Le Temps Qu'il Faut" class="image is-1by1 p-5" width="279px" height="124px">
{{ end }}
</div>
</a>
@ -25,12 +44,12 @@
<div class="social-icons m-0 p-0">
<a href="https://www.facebook.com/votre_compte_facebook" class="mr-2 {{$bg}}" aria-label="Lien vers le compte Facebook de la compagnie Le Temps Qu'il Faut">
<span>
<i class="fab fa-facebook fa-2x"></i>
<i class="fa-brands fa-facebook fa-2x"></i>
</span>
</a>
<a href="https://www.instagram.com/votre_compte_instagram" class="{{$bg}}" aria-label="Lien vers le compte Instagram de la compagnie Le Temps Qu'il Faut">
<span>
<i class="fab fa-instagram fa-2x"></i>
<i class="fa-brands fa-instagram fa-2x"></i>
</span>
</a>
</div>

3
layouts/partials/navbarbottom.html
View File

@ -2,7 +2,8 @@
<nav class="navbar is-black" role="navigation" aria-label="main navigation">
<div class="navbar-brand is-flex is-justify-content-center is-flex-grow-1">
<a class="navbar-item" href="/" aria-label="Lien vers la page d'accueil du site">
<img src="{{ $.Site.Params.logoHome |relURL }}" alt="Logo de la Compagnie le temps qu'il faut" height="28" width="62">
{{ $logoBottom := (resources.Get $.Site.Params.logoHome).Resize "62x28 webp drawing" }}
<img src="{{ $logoBottom |relURL }}" alt="Logo de la Compagnie le temps qu'il faut" height="28" width="62">
</a>
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="mynavbar">

14
layouts/partials/styles.html
View File

@ -1,11 +1,13 @@
<link rel="preload" href="https://cdn.jsdelivr.net/npm/bulma@0.9.4/css/bulma.min.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<noscript><link rel="preload" href="https://cdn.jsdelivr.net/npm/bulma@0.9.4/css/bulma.min.css"></noscript>
{{ $bulmaCSS := resources.Get "css/bulma.min.css" | resources.ToCSS }}
<!--<link rel="preload" href="{{ $bulmaCSS.RelPermalink }}" as="style" onload="this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="{{ $bulmaCSS.RelPermalink }}"></noscript>-->
<link rel="stylesheet" href="{{ $bulmaCSS.RelPermalink }}">
<link rel="preload" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<noscript><link rel="preload" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"></noscript>
<script src="https://kit.fontawesome.com/fd9af19a2d.js" crossorigin="anonymous"></script>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preload" href="https://fonts.googleapis.com/css2?family=Advent+Pro:wght@100;200;300;400;500;600;700&family=Lato:wght@300;400;700;900&display=swap" as="style" onload="this.onload=null;this.rel='stylesheet'">
<noscript><link href="https://fonts.googleapis.com/css2?family=Advent+Pro:wght@100;200;300;400;500;600;700&family=Lato:wght@300;400;700;900&display=swap"></noscript>
<noscript><link href="https://fonts.googleapis.com/css2?family=Advent+Pro:wght@100;200;300;400;500;600;700&family=Lato:wght@300;400;700;900&display=swap"></noscript>

5
layouts/presse/list.html
View File

@ -1,8 +1,9 @@
{{ define "styles"}}
{{ $customCSS := resources.Get "css/presse.css" | resources.ToCSS }}
<link rel="preload" href="{{ $customCSS.RelPermalink }}" as="style" onload="this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="{{ $customCSS.RelPermalink }}"></noscript>
<!--<link rel="preload" href="{{ $customCSS.RelPermalink }}" as="style" onload="this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="{{ $customCSS.RelPermalink }}"></noscript>-->
<link rel="stylesheet" href="{{ $customCSS.RelPermalink }}">
{{ end }}

67
layouts/spectacles/list.html
View File

@ -1,7 +1,8 @@
{{ define "styles"}}
{{ $customCSS := resources.Get "css/spectacles.css" | resources.ToCSS }}
<link rel="preload" href="{{ $customCSS.RelPermalink }}" as="style" onload="this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="{{ $customCSS.RelPermalink }}"></noscript>
<!-- <link rel="preload" href="{{ $customCSS.RelPermalink }}" as="style" onload="this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="{{ $customCSS.RelPermalink }}"></noscript> -->
<link rel="stylesheet" href="{{ $customCSS.RelPermalink }}">
{{ end }}
@ -17,51 +18,45 @@
<a href="{{ .Permalink|relURL }}" aria-label="Lien vers la page du spectacle {{ .Title }}">
{{ $img := resources.GetMatch (print .File.Dir "/principal*") }}
{{ with $img }}
{{- $jpegxxs := .Resize "103x jpeg" }}
{{- $jpegxs := .Resize "192x jpeg" }}
{{- $jpegs := .Resize "256x jpeg" }}
{{- $jpegm := .Resize "360x jpeg" }}
{{- $jpegl := .Resize "480x jpeg" }}
{{- $jpegxl := .Resize "640x jpeg" }}
{{- $webpxxs := .Resize "103x webp picture" }}
{{- $webpxs := .Resize "192x webp picture" }}
{{- $webps := .Resize "256x webp picture" }}
{{- $webpm := .Resize "360x webp picture" }}
{{- $webpl := .Resize "480x webp picture" }}
{{- $webpxl := .Resize "640x webp picture" }}
{{- $jpegxs := .Fill "170x102 jpeg" }}
{{- $jpegs := .Fill "240x145 jpeg" }}
{{- $jpegm := .Fill "320x193 jpeg" }}
{{- $jpegl := .Fill "427x257 jpeg" }}
{{- $jpegxl := .Fill "640x386 jpeg" }}
{{- $webpxs := .Fill "170x102 webp picture" }}
{{- $webps := .Fill "240x145 webp picture" }}
{{- $webpm := .Fill "320x193 webp picture" }}
{{- $webpl := .Fill "427x257 webp picture" }}
{{- $webpxl := .Fill "640x386 webp picture" }}
<figure class="image is-5by3">
<picture>
<source type="image/webp"
srcset="{{ $webpxxs.Permalink }} {{ $webpxxs.Width}}w,
{{ $webpxxs.Permalink }} {{ $webpxxs.Width}}w
{{ $webpxs.Permalink }} {{ $webpxs.Width}}w
{{ $webps.Permalink }} {{ $webps.Width}}w
{{ $webpm.Permalink }} {{ $webpm.Width}}w
{{ $webpl.Permalink }} {{ $webpl.Width}}w
srcset="{{ $webpxs.Permalink }} {{ $webpxs.Width}}w,
{{ $webps.Permalink }} {{ $webps.Width}}w,
{{ $webpm.Permalink }} {{ $webpm.Width}}w,
{{ $webpl.Permalink }} {{ $webpl.Width}}w,
{{ $webpxl.Permalink }} {{ $webpxl.Width}}w"
sizes="(max-width: 767px) 103px,
(max-width: 1023px) 192px,
(max-width: 1439px) 256px,
(max-width: 1919px) 360px,
(max-width: 2559px) 480px,
sizes="(max-width: 767px) 640px,
(max-width: 1023px) 170px,
(max-width: 1439px) 240px,
(max-width: 1919px) 320px,
(max-width: 2559px) 427px,
640px">
<img loading="lazy"
src="{{ $jpegm.Permalink }}"
width="{{ $jpegm.Width }}"
height="{{ $jpegm.Height }}"
alt="{{ .Permalink }}"
srcset="{{ $jpegxxs.Permalink }} {{ $jpegxxs.Width}}w,
{{ $jpegxxs.Permalink }} {{ $jpegxxs.Width}}w
{{ $jpegxs.Permalink }} {{ $jpegxs.Width}}w
{{ $jpegs.Permalink }} {{ $jpegs.Width}}w
{{ $jpegm.Permalink }} {{ $jpegm.Width}}w
{{ $jpegl.Permalink }} {{ $jpegl.Width}}w
srcset="{{ $jpegxs.Permalink }} {{ $jpegxs.Width}}w,
{{ $jpegs.Permalink }} {{ $jpegs.Width}}w,
{{ $jpegm.Permalink }} {{ $jpegm.Width}}w,
{{ $jpegl.Permalink }} {{ $jpegl.Width}}w,
{{ $jpegxl.Permalink }} {{ $jpegxl.Width}}w"
sizes="(max-width: 767px) 103px,
(max-width: 1023px) 192px,
(max-width: 1439px) 256px,
(max-width: 1919px) 360px,
(max-width: 2559px) 480px,
sizes="(max-width: 767px) 640px,
(max-width: 1023px) 170px,
(max-width: 1439px) 240px,
(max-width: 1919px) 320px,
(max-width: 2559px) 427px,
640px">
</picture>
{{ end }}

5
layouts/spectacles/single.html
View File

@ -1,7 +1,8 @@
{{ define "styles"}}
{{ $customCSS := resources.Get "css/single-spectacle.css" | resources.ToCSS }}
<link rel="preload" href="{{ $customCSS.RelPermalink }}" as="style" onload="this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="{{ $customCSS.RelPermalink }}"></noscript>
<!-- <link rel="preload" href="{{ $customCSS.RelPermalink }}" as="style" onload="this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="{{ $customCSS.RelPermalink }}"></noscript> -->
<link rel="stylesheet" href="{{ $customCSS.RelPermalink }}">
{{ end }}
{{ define "content" }}