change gitignore to include theme

This commit is contained in:
Valentin 2024-03-26 14:22:54 +01:00
parent 032e6d06f4
commit 1bea358e24
41 changed files with 1513 additions and 0 deletions

1
.gitignore vendored
View File

@ -25,6 +25,7 @@ user/plugins/*
!user/plugins/.* !user/plugins/.*
user/themes/* user/themes/*
!user/themes/.* !user/themes/.*
!user/themes/ateliers-55
user/**/config/security.yaml user/**/config/security.yaml
# Environments # Environments

View File

@ -0,0 +1,5 @@
# v0.1.0
## 03/05/2024
1. [](#new)
* ChangeLog started...

View File

@ -0,0 +1,21 @@
The MIT License (MIT)
Copyright (c) 2024 Valentin Le Moign
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

View File

@ -0,0 +1,7 @@
# Ateliers 55 Theme
The **Ateliers 55** Theme is for [Grav CMS](http://github.com/getgrav/grav). This README.md file should be modified to describe the features, installation, configuration, and general usage of this theme.
## Description
Thème du blog des Ateliers 55

View File

@ -0,0 +1,9 @@
<?php
namespace Grav\Theme;
use Grav\Common\Theme;
class Ateliers55 extends Theme
{
// Access plugin events in this class
}

View File

@ -0,0 +1,3 @@
enabled: true
dropdown:
enabled: true

View File

@ -0,0 +1,32 @@
name: Ateliers 55
slug: ateliers-55
type: theme
version: 0.1.0
description: Thème du blog des Ateliers 55
icon: rebel
author:
name: Valentin Le Moign
email: valentin_le_moign@figureslibres.io
homepage: https://github.com/valentin-le-moign/grav-theme-ateliers-55
demo: http://demo.yoursite.com
keywords: grav, theme, etc
bugs: https://github.com/valentin-le-moign/grav-theme-ateliers-55/issues
readme: https://github.com/valentin-le-moign/grav-theme-ateliers-55/blob/develop/README.md
license: MIT
dependencies:
- { name: grav, version: '>=1.6.0' }
form:
validation: loose
fields:
dropdown.enabled:
type: toggle
label: Dropdown in Menu
highlight: 1
default: 1
options:
1: PLUGIN_ADMIN.ENABLED
0: PLUGIN_ADMIN.DISABLED
validate:
type: bool

View File

@ -0,0 +1,175 @@
/* Core Stuff */
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
body {
font-size: 1rem;
line-height: 1.7;
color: #606d6e;
}
h1,
h2,
h3,
h4,
h5,
h6 {
color: #454B4D;
}
a {
color: #1F8CD6;
text-decoration: none;
}
a:hover {
color: #175E91;
}
pre {
background: #F0F0F0;
margin: 1rem 0;
border-radius: 2px;
}
blockquote {
border-left: 10px solid #eee;
margin: 0;
padding: 0 2rem;
}
/* Utility Classes */
.wrapper {
margin: 0 3rem;
}
.padding {
padding: 3rem 1rem;
}
.left {
float: left;
}
.right {
float: right
}
.text-center {
text-align: center;
}
.text-right {
text-align: right;
}
.text-left {
text-align: left;
}
/* Content Styling */
.header .padding {
padding: 1rem 0;
}
.header {
background-color: #1F8DD6;
color: #eee;
}
.header a {
color: #fff;
}
.header .logo {
font-size: 1.7rem;
text-transform: uppercase;
}
.footer {
background-color: #eee;
}
/* Menu Settings */
.main-nav ul {
text-align: center;
letter-spacing: -1em;
margin: 0;
padding: 0;
}
.main-nav ul li {
display: inline-block;
letter-spacing: normal;
}
.main-nav ul li a {
position: relative;
display: block;
line-height: 45px;
color: #fff;
padding: 0 20px;
white-space: nowrap;
}
.main-nav > ul > li > a {
border-radius: 2px;
}
/*Active dropdown nav item */
.main-nav ul li:hover > a {
background-color: #175E91;
}
/* Selected Dropdown nav item */
.main-nav ul li.selected > a {
background-color: #fff;
color: #175E91;
}
/* Dropdown CSS */
.main-nav ul li {position: relative;}
.main-nav ul li ul {
position: absolute;
background-color: #1F8DD6;
min-width: 100%;
text-align: left;
z-index: 999;
display: none;
}
.main-nav ul li ul li {
display: block;
}
/* Dropdown CSS */
.main-nav ul li ul ul {
left: 100%;
top: 0;
}
/* Active on Hover */
.main-nav li:hover > ul {
display: block;
}
/* Child Indicator */
.main-nav .has-children > a {
padding-right: 30px;
}
.main-nav .has-children > a:after {
font-family: FontAwesome;
content: '\f107';
position: absolute;
display: inline-block;
right: 8px;
top: 0;
}
.main-nav .has-children .has-children > a:after {
content: '\f105';
}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,403 @@
@font-face {
font-family: "Jost";
src: url("../fonts/jost-400-book-webfont.woff") format("woff"), url("../fonts/jost-400-book-webfont.woff2") format("woff2");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "Jost";
src: url("../fonts/jost-300-lightitalic-webfont.woff") format("woff"), url("../fonts/jost-300-lightitalic-webfont.woff2") format("woff2");
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: "Jost";
src: url("../fonts/jost-500-medium-webfont.woff") format("woff"), url("../fonts/jost-500-medium-webfont.woff2") format("woff2");
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: "Jost";
src: url("../fonts/jost-500-mediumitalic-webfont.woff") format("woff"), url("../fonts/jost-500-mediumitalic-webfont.woff2") format("woff2");
font-weight: 500;
font-style: italic;
}
@font-face {
font-family: "Jost";
src: url("../fonts/jost-700-bold-webfont.woff") format("woff"), url("../fonts/jost-700-bold-webfont.woff2") format("woff2");
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: "Jost";
src: url("../fonts/jost-700-bolditalic-webfont.woff") format("woff"), url("../fonts/jost-700-bolditalic-webfont.woff2") format("woff2");
font-weight: bold;
font-style: italic;
}
* {
font-family: "Jost", sans-serif;
}
* a, * a:hover, * a:active, * a:focus, * a:visited {
color: #0066ff;
}
* ul {
list-style: none;
}
header {
display: flex;
width: 100vw;
max-height: 10vh;
justify-content: space-between;
align-items: center;
border-bottom: solid 1px #444;
}
header #logo {
width: 7.5vh;
height: 7.5vh;
padding: 1vh;
}
header #logo img {
width: 100%;
transform: scale(1.2) translateY(0.8rem);
}
header #main-title {
align-self: flex-end;
}
header #main-title h1 {
font-size: 1.3rem;
font-weight: normal;
color: #000;
text-transform: uppercase;
}
header #hamburger {
padding: 1.5rem 1rem;
width: 7.5vh;
height: 7.5vh;
border-left: solid 1px #444;
display: flex;
flex-direction: column;
justify-content: space-between;
cursor: pointer;
}
header #hamburger div {
border-bottom: solid 1px #000;
width: 100%;
background-color: #000;
opacity: 1;
transition: opacity 0.2s ease-out, transform 0.4s ease-out;
transform: none;
}
header #hamburger.open div:first-of-type {
transform: translate(0rem, calc(3.75vh - 1.5rem)) rotate(-45deg);
}
header #hamburger.open div:nth-of-type(2) {
opacity: 0;
}
header #hamburger.open div:last-of-type {
transform: translate(0rem, calc((3.75vh - 1.5rem) * -1)) rotate(45deg);
}
nav {
background-color: #0066ff;
max-height: 0vh;
height: auto;
transition: max-height 0.8s ease-out;
}
nav ul {
padding: 1rem 0 1rem 7.5vh;
margin: 0;
}
nav ul li a, nav ul li a:hover, nav ul li a:active, nav ul li a:focus, nav ul li a:visited {
padding-left: 0;
transition: padding-left 0.3s ease-out;
color: #fff;
font-weight: bold;
font-size: 1.2rem;
}
nav ul li a:hover {
padding-left: 1rem;
}
nav.open {
max-height: 20vh;
}
#about {
color: #0066ff;
line-height: 1.4;
border-bottom: solid 1px #000;
padding: 1rem 1.2rem 1rem 1.2rem;
font-weight: 500;
display: grid;
grid-template-columns: 1fr;
grid-template-rows: repeat(3, auto);
justify-items: center;
}
#about #about-hidden {
overflow: hidden;
height: auto;
max-height: 0vh;
transition: max-height 1s ease-out;
font-weight: normal;
}
#about #about-hidden.open {
max-height: 50vh;
}
#about #about-arrow {
width: 7.5vh;
height: 3.75vh;
display: flex;
justify-content: space-around;
margin-top: 1rem;
transform: rotate(0deg) scale(0.5);
transition: transform 0.5s ease-out;
cursor: pointer;
}
#about #about-arrow div {
width: 50%;
border-bottom: solid 1px #000;
}
#about #about-arrow div:first-of-type {
transform: translateX(50%) translateY(-1rem) rotate(45deg);
}
#about #about-arrow div:last-of-type {
transform: translateX(-50%) translateY(-1rem) rotate(-45deg);
}
#about #about-arrow.open {
transform: rotate(180deg) scale(0.5);
}
main {
display: grid;
padding: 1.2rem;
}
main .article-card {
cursor: pointer;
width: 100%;
margin: 2rem 0;
}
main .article-card .img-cover {
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
max-height: 40vh;
position: relative;
}
main .article-card .img-cover .eye {
position: absolute;
opacity: 0;
background-color: rgba(255, 255, 255, 0.5);
transition: opacity 0.3s ease-out;
z-index: 1;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
main .article-card .img-cover .eye .eye-picto {
width: 35%;
height: 100%;
-webkit-mask: url(../images/eye.svg) no-repeat center;
mask: url(../images/eye.svg) no-repeat center;
mask-size: 100%;
-webkit-mask-size: 100%;
background-color: #0066ff;
}
main .article-card .img-cover > img {
z-index: 0;
width: 100%;
transform: scale(1);
transition: transform 0.3s ease-out;
}
main .article-card .date {
margin-top: 0.8rem;
font-weight: 500;
color: #0066ff;
}
main .article-card h3 {
font-weight: normal;
font-size: 1rem;
margin: 0;
}
main .article-card:hover .img-cover .eye {
opacity: 1;
}
main .article-card:hover .img-cover > img {
transform: scale(1.1);
}
article {
position: fixed;
width: 100vw;
height: 100vh;
top: 0;
left: 0;
background-color: rgba(255, 255, 255, 0.5);
z-index: 3;
display: flex;
align-items: center;
justify-content: center;
}
article #article-wrapper {
border: solid 1px #000;
width: 95vw;
max-height: 90vh;
overflow-y: auto;
background-color: #fff;
padding-bottom: 1.5rem;
}
article #article-wrapper .article-header {
position: relative;
width: 100%;
height: 3rem;
margin-top: 2rem;
display: flex;
align-items: center;
margin-bottom: 1rem;
}
article #article-wrapper .article-header .article-siblings {
width: 100%;
padding: 0 7vw;
display: flex;
justify-content: space-between;
}
article #article-wrapper .article-header .article-siblings a {
color: #000;
display: flex;
align-items: center;
}
article #article-wrapper .article-header .article-siblings a i {
font-size: 0.5rem;
padding: 0.3rem;
}
article #article-wrapper .article-header .close-article {
z-index: 11;
display: block;
padding-top: 0.75rem;
width: 1.5rem;
height: 1.5rem;
position: absolute;
right: 0.5rem;
top: -1.5rem;
cursor: pointer;
}
article #article-wrapper .article-header .close-article div {
width: 100%;
border-bottom: solid 1px #000;
}
article #article-wrapper .article-header .close-article div:first-of-type {
transform: rotate(45deg);
}
article #article-wrapper .article-header .close-article div:last-of-type {
transform: rotate(-45deg);
}
article #article-wrapper .swiper {
max-height: 40vh;
overflow: hidden;
opacity: 0;
transition: opacity 0.3s ease-out;
}
article #article-wrapper .swiper .swiper-wrapper .swiper-slide {
display: flex;
justify-content: center;
padding: 0 7vw;
}
article #article-wrapper .swiper .swiper-wrapper .swiper-slide img {
box-sizing: content-box;
width: 100%;
}
article #article-wrapper .swiper .swiper-button-prev, article #article-wrapper .swiper .swiper-button-next {
color: #000;
transform: scale(0.5);
}
article #article-wrapper .swiper .swiper-button-prev {
left: 0;
}
article #article-wrapper .swiper .swiper-button-next {
right: 0;
}
article .article-date {
padding: 0 7vw;
font-weight: 500;
color: #0066ff;
margin: 0;
margin-top: 1rem;
}
article .article-titre {
padding: 0 7vw;
font-weight: bold;
margin: 0;
}
article .article-content {
padding: 0 7vw;
}
@media screen and (min-width: 960px) {
header #logo {
width: 15vw;
}
header #logo img {
padding-left: 40%;
padding-right: 10%;
}
header #main-title {
width: 100%;
}
header #main-title h1 {
font-size: 2rem;
padding-left: 2.5vw;
margin-bottom: 0.5rem;
}
nav ul {
padding: 1rem 0 1rem 15vw;
}
#about {
grid-template-columns: repeat(2, auto);
grid-template-rows: repeat(2, auto);
padding: 1rem 0 1rem 15vw;
cursor: pointer;
}
#about #about-summary {
padding-right: calc(15vw - 7.5vh);
}
#about #about-hidden {
grid-row: 2;
grid-column: 1;
padding-right: calc(15vw - 7.5vh);
}
#about #about-arrow {
grid-row: 1/3;
grid-column: 2;
align-self: center;
}
#about #about-hidden.open {
max-height: 20vh;
}
main {
grid-template-columns: repeat(3, 1fr);
column-gap: 2rem;
}
main .article-card .img-cover {
max-height: 20vh;
}
article #article-wrapper {
width: 60vw;
}
article #article-wrapper .swiper-button-prev {
left: 1rem !important;
}
article #article-wrapper .swiper-button-next {
right: 1rem !important;
}
}
@media screen and (min-width: 1280px) {
main {
margin: 2rem 15vw;
padding: 0;
}
}
/*# sourceMappingURL=styles.css.map */

View File

@ -0,0 +1 @@
{"version":3,"sourceRoot":"","sources":["../sass/styles.scss"],"names":[],"mappings":"AAAA;EACI;EACA;EAEA;EACA;;AAGJ;EACI;EACA;EAEA;EACA;;AAGJ;EACI;EACA;EAEA;EACA;;AAGJ;EACI;EACA;EAEA;EACA;;AAGJ;EACI;EACA;EAEA;EACA;;AAGJ;EACI;EACA;EAEA;EACA;;AAQJ;EACI;;AACA;EACI,OANM;;AAQV;EACI;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;;AACA;EACI;EACA;;AAGR;EACI;;AACA;EACI;EACA;EACA,OApCA;EAqCA;;AAGR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;EACA,kBApDA;EAqDA;EACA;EACA;;AAIJ;EACI;;AAEJ;EACI;;AAEJ;EACI;;;AAKZ;EACI,kBAtEU;EAuEV;EACA;EACA;;AACA;EACI;EACA;;AAEI;EACI;EACA;EACA,OAhFN;EAiFM;EACA;;AAGR;EACI;;;AAIZ;EACI;;;AAGJ;EACI,OAhGU;EAiGV;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;;AAEJ;EACI;;AAEJ;EACI;;AAGR;EACI;;;AAGR;EACI;EACA;;AACA;EACI;EACA;EACA;;AACA;EACI;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;EACA;EACA;EACA;EACA,kBA3KN;;AA8KF;EACI;EACA;EACA;EACA;;AAGR;EACI;EACA;EACA,OAxLE;;AA0LN;EACI;EACA;EACA;;AAKA;EACI;;AAEJ;EACI;;;AAKhB;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;EACA;EACA,kBA1NE;EA2NF;;AACA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;EACA;;AACA;EACI,OA7OR;EA8OQ;EACA;;AACA;EACI;EACA;;AAIZ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;;AAEJ;EACI;;AAEJ;EACI;;AAIZ;EACI;EACA;EACA;EACA;;AAEI;EACI;EACA;EACA;;AACA;EACI;EACA;;AAIZ;EACI,OA7RJ;EA8RI;;AAEJ;EACI;;AAEJ;EACI;;AAIZ;EACI;EACA;EACA,OAzSM;EA0SN;EACA;;AAEJ;EACI;EACA;EACA;;AAEJ;EACI;;;AAIR;EAEQ;IACI;;EACA;IACI;IACA;;EAGR;IACI;;EACA;IACI;IACA;IACA;;EAKR;IACI;;EAGR;IACI;IACA;IACA;IACA;;EACA;IACI;;EAEJ;IACI;IACA;IACA;;EAEJ;IACI;IACA;IACA;;EAEJ;IACI;;EAGR;IACI;IACA;;EAEI;IACI;;EAKR;IACI;;EACA;IACI;;EAEJ;IACI;;;AAMhB;EACI;IACI;IACA","file":"styles.css"}

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,40 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
data-name="Layer 50"
viewBox="0 0 26.999512 21"
x="0px"
y="0px"
version="1.1"
id="svg2"
sodipodi:docname="noun-eye-6613305.svg"
width="26.999512"
height="21"
inkscape:version="1.3.2 (091e20ef0f, 2023-11-25, custom)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs2" />
<sodipodi:namedview
id="namedview2"
pagecolor="#ffffff"
bordercolor="#000000"
borderopacity="0.25"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:zoom="16.808869"
inkscape:cx="8.1802051"
inkscape:cy="22.904574"
inkscape:window-width="2160"
inkscape:window-height="1440"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg2" />
<path
d="M 26.907959,10.210938 C 26.419678,9.523438 21.9021,3.5 13.499756,3.5 5.0974121,3.5 0.57983393,9.523438 0.09155273,10.210938 c -0.1220703,0.172851 -0.1220703,0.405273 0,0.578124 C 0.57983393,11.476562 5.0974121,17.5 13.499756,17.5 c 8.402344,0 12.919922,-6.023438 13.408203,-6.710938 0.12207,-0.172851 0.12207,-0.405273 0,-0.578124 z M 13.499756,16.5 c -7.1318361,0 -11.3789064,-4.750977 -12.3720705,-6 0.9931641,-1.249023 5.2402344,-6 12.3720705,-6 7.131836,0 11.378906,4.750977 12.37207,6 -0.993164,1.249023 -5.240234,6 -12.37207,6 z m 0,-11.5 c -3.032227,0 -5.5000002,2.467773 -5.5000002,5.5 0,3.032227 2.4677732,5.5 5.5000002,5.5 3.032227,0 5.5,-2.467773 5.5,-5.5 0,-3.032227 -2.467773,-5.5 -5.5,-5.5 z m 0,10 c -2.481445,0 -4.5000002,-2.018555 -4.5000002,-4.5 0,-2.481445 2.0185552,-4.5 4.5000002,-4.5 2.481445,0 4.5,2.018555 4.5,4.5 0,2.481445 -2.018555,4.5 -4.5,4.5 z m 0,-7.5 c -1.654297,0 -3,1.345703 -3,3 0,1.654297 1.345703,3 3,3 1.654297,0 3,-1.345703 3,-3 0,-1.654297 -1.345703,-3 -3,-3 z m 0,5 c -1.102539,0 -2,-0.897461 -2,-2 0,-1.102539 0.897461,-2 2,-2 1.102539,0 2,0.897461 2,2 0,1.102539 -0.897461,2 -2,2 z m -0.5,-11 v -1 c 0,-0.2763672 0.223633,-0.5 0.5,-0.5 0.276367,0 0.5,0.2236328 0.5,0.5 v 1 c 0,0.2763672 -0.223633,0.5 -0.5,0.5 -0.276367,0 -0.5,-0.2236328 -0.5,-0.5 z m 1,18 v 1 c 0,0.276367 -0.223633,0.5 -0.5,0.5 -0.276367,0 -0.5,-0.223633 -0.5,-0.5 v -1 c 0,-0.276367 0.223633,-0.5 0.5,-0.5 0.276367,0 0.5,0.223633 0.5,0.5 z M 6.6892089,3.1611328 C 6.5114745,2.9501953 6.5388183,2.6347656 6.7507323,2.4570312 6.9616698,2.2783203 7.2780761,2.305664 7.4548339,2.5185546 l 0.6425779,0.765625 c 0.177735,0.2109375 0.150391,0.5263672 -0.06152,0.7041016 -0.09375,0.079102 -0.208008,0.1171875 -0.321289,0.1171875 -0.142578,0 -0.28418,-0.060547 -0.3828128,-0.1787109 z M 20.310303,17.838867 c 0.177734,0.210938 0.15039,0.526367 -0.06152,0.704102 -0.09375,0.0791 -0.208007,0.117187 -0.321289,0.117187 -0.142578,0 -0.284179,-0.06055 -0.382812,-0.178711 L 18.9021,17.71582 c -0.177735,-0.210937 -0.150391,-0.526367 0.06152,-0.704101 0.210938,-0.179688 0.527344,-0.151367 0.704102,0.06152 z M 9.6101078,1.2744141 c -0.09473,-0.2597656 0.03906,-0.5458984 0.298828,-0.640625 0.2607422,-0.095703 0.5458982,0.039063 0.6406252,0.2988281 l 0.341797,0.9394531 c 0.09473,0.2597656 -0.03906,0.5458984 -0.298828,0.640625 -0.05664,0.020508 -0.114258,0.030273 -0.170899,0.030273 -0.204101,0 -0.395508,-0.1259766 -0.4697262,-0.3291016 z M 17.389404,19.725586 c 0.09473,0.259766 -0.03906,0.545898 -0.298828,0.640625 -0.05664,0.02051 -0.114257,0.03027 -0.170898,0.03027 -0.204102,0 -0.395508,-0.125976 -0.469727,-0.329101 l -0.341797,-0.93945 c -0.09473,-0.259766 0.03906,-0.545899 0.298829,-0.640625 0.260742,-0.09473 0.545898,0.03906 0.640625,0.298828 z M 18.963623,3.9882813 C 18.751709,3.8105469 18.724365,3.4951172 18.9021,3.2841797 l 0.642578,-0.765625 c 0.177734,-0.2119141 0.493164,-0.2392578 0.704102,-0.061523 0.211914,0.1777344 0.239257,0.4931641 0.06152,0.7041016 l -0.642578,0.765625 c -0.09863,0.1181641 -0.240234,0.1787109 -0.382813,0.1787109 -0.113281,0 -0.227539,-0.038086 -0.321289,-0.1171875 z M 8.0358888,17.011719 c 0.211914,0.177734 0.239258,0.493164 0.06152,0.704101 L 7.454831,18.481445 c -0.098633,0.118165 -0.2402344,0.178711 -0.3828125,0.178711 -0.1132812,0 -0.2275391,-0.03809 -0.3212891,-0.117187 -0.2119141,-0.177735 -0.2392578,-0.493164 -0.061523,-0.704102 l 0.6425781,-0.765625 c 0.1777347,-0.211914 0.4931637,-0.240234 0.7041017,-0.06152 z M 16.108154,1.8720704 16.449951,0.9326173 c 0.09473,-0.2597656 0.379883,-0.3935547 0.640625,-0.2988281 0.259766,0.094727 0.393555,0.3808594 0.298828,0.640625 l -0.341796,0.9394531 c -0.07422,0.203125 -0.265625,0.3291016 -0.469727,0.3291016 -0.05664,0 -0.114258,-0.00977 -0.170898,-0.030273 C 16.147217,2.4179689 16.013428,2.1318361 16.108154,1.8720704 Z M 10.891358,19.12793 10.549561,20.067383 c -0.07422,0.203125 -0.265625,0.329101 -0.469727,0.329101 -0.05664,0 -0.1142582,-0.0098 -0.1708982,-0.03027 -0.259766,-0.09473 -0.393555,-0.380859 -0.298828,-0.640625 l 0.341797,-0.939453 c 0.09473,-0.259766 0.3798822,-0.392578 0.6406252,-0.298828 0.259765,0.09473 0.393554,0.380859 0.298828,0.640625 z"
id="path1" />
</svg>

After

Width:  |  Height:  |  Size: 5.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

View File

@ -0,0 +1,98 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="65.470116mm"
height="65.409111mm"
viewBox="0 0 65.470116 65.409111"
version="1.1"
id="svg1"
inkscape:version="1.3.2 (091e20ef0f, 2023-11-25, custom)"
sodipodi:docname="logo_ateliers55.svg"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm"
inkscape:zoom="4.0963296"
inkscape:cx="141.22399"
inkscape:cy="163.31694"
inkscape:window-width="1920"
inkscape:window-height="1080"
inkscape:window-x="102"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="layer1">
<inkscape:page
x="0"
y="0"
width="65.470116"
height="65.409111"
id="page1"
margin="0 0 0 0"
bleed="0" />
</sodipodi:namedview>
<defs
id="defs1" />
<g
inkscape:label="Calque 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(-66.485544,-88.593331)">
<g
id="g12132"
transform="translate(-974.0636,-1344.7498)">
<circle
inkscape:export-ydpi="150"
inkscape:export-xdpi="150"
r="32.609894"
cy="1465.9951"
cx="1073.3485"
id="path11600"
style="opacity:1;fill:#0066ff;fill-opacity:1;stroke:none;stroke-width:0.217399" />
<path
inkscape:export-ydpi="150"
inkscape:export-xdpi="150"
d="m 1052.2103,1468.3248 c 0,5.6292 4.5864,10.2154 10.2154,10.2154 5.6287,0 10.215,-4.5862 10.215,-10.2154 0,-5.6285 -4.5863,-10.215 -10.215,-10.215 -0.9174,0 -1.793,0.1252 -2.6268,0.3339 l -1.3853,-4.0861 h 11.2993 v -5.8373 h -16.1776 l -0.2809,13.7595 6.0461,2.9604 c 0.792,-0.7926 1.9179,-1.2927 3.1272,-1.2927 2.418,0 4.3777,1.9597 4.3777,4.3777 0,2.4186 -1.9597,4.3783 -4.3777,4.3783 -2.4186,0 -4.3783,-1.9597 -4.3783,-4.3783 z"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:8.6129px;line-height:1.25;font-family:'Geometric Sans Serif v1';-inkscape-font-specification:'Geometric Sans Serif v1';letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1.04238"
id="path11595"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cssscccccccssscc" />
<path
inkscape:export-ydpi="150"
inkscape:export-xdpi="150"
d="m 1075.2413,1474.1245 c 0,5.6292 4.5865,10.2154 10.215,10.2154 5.6292,0 10.2154,-4.5862 10.2154,-10.2154 0,-5.6285 -4.5862,-10.215 -10.2154,-10.215 -0.9173,0 -1.7925,0.1252 -2.6267,0.3339 l -1.3288,-4.0861 h 11.2993 v -5.8373 h -16.1777 l -0.3387,13.7595 6.0454,2.9604 c 0.7924,-0.7926 1.9179,-1.2927 3.1272,-1.2927 2.4186,0 4.3783,1.9597 4.3783,4.3777 0,2.4186 -1.9597,4.3783 -4.3783,4.3783 -2.4179,0 -4.3776,-1.9597 -4.3776,-4.3783 z"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:8.6129px;line-height:1.25;font-family:'Geometric Sans Serif v1';-inkscape-font-specification:'Geometric Sans Serif v1';letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1.04238"
id="path11597"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cssscccccccssscc" />
<text
inkscape:export-ydpi="150"
inkscape:export-xdpi="150"
transform="rotate(-23.191875)"
id="text11440-1-1-6-9"
y="1773.3237"
x="389.93906"
style="font-style:normal;font-weight:normal;font-size:10.5374px;line-height:1.25;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.263435"
xml:space="preserve"><tspan
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-family:'Jost*';-inkscape-font-specification:'Jost* Bold';fill:#ffffff;fill-opacity:1;stroke-width:0.263435"
y="1773.3237"
x="389.93906"
id="tspan11438-1-0-7-1"
sodipodi:role="line">Ateliers</tspan><tspan
id="tspan11442-3-0-2-1"
y="1786.4955"
x="389.93906"
sodipodi:role="line" /></text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 4.6 KiB

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,75 @@
function toggleMenu(el) {
let nav = document.querySelector('nav');
el.classList.toggle('open');
nav.classList.toggle('open');
}
function toggleAbout() {
let arrow = document.querySelector('#about-arrow');
let aboutContent = document.querySelector('#about-hidden');
aboutContent.classList.toggle('open');
arrow.classList.toggle('open');
}
$(document).ready(function() {
let body = document.querySelector('body');
if (document.querySelector('.swiper')) {
body.style.overflowY = "hidden";
} else {
body.style.overflowY = "auto";
}
let swiperEl = document.querySelector('.swiper');
initSwiper();
swiperEl.style.opacity = 1;
resizeVerticalImages();
barba.init({
transitions: [{
name: 'opacity-transition',
leave(data) {
return gsap.to(data.current.container, {
opacity: 0
})
},
enter(data) {
return gsap.from(data.next.container, {
opacity: 0
})
}
}]
});
barba.hooks.before((data) => {
swiperEl.style.opacity = 0;
});
barba.hooks.after((data) => {
swiperEl = document.querySelector('.swiper');
resizeVerticalImages();
if (document.querySelector('.swiper') && !document.querySelector('.swiper-initialized')) {
initSwiper();
body.style.overflowY = "hidden";
} else {
body.style.overflowY = "auto";
}
swiperEl.style.opacity = 1;
});
})
function initSwiper() {
let swiper = new Swiper('.swiper', {
loop: true,
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
});
}
function resizeVerticalImages() {
if (document.querySelector('.swiper')) {
let verticalImages = document.querySelectorAll('.swiper-slide > img');
for (let img of verticalImages) {
if (img.clientHeight > img.clientWidth) {
img.style.width = "50%";
}
}
}
}

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,434 @@
@font-face {
font-family: "Jost";
src: url("../fonts/jost-400-book-webfont.woff") format("woff"),
url("../fonts/jost-400-book-webfont.woff2") format("woff2");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "Jost";
src: url("../fonts/jost-300-lightitalic-webfont.woff") format("woff"),
url("../fonts/jost-300-lightitalic-webfont.woff2") format("woff2");
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: "Jost";
src: url("../fonts/jost-500-medium-webfont.woff") format("woff"),
url("../fonts/jost-500-medium-webfont.woff2") format("woff2");
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: "Jost";
src: url("../fonts/jost-500-mediumitalic-webfont.woff") format("woff"),
url("../fonts/jost-500-mediumitalic-webfont.woff2") format("woff2");
font-weight: 500;
font-style: italic;
}
@font-face {
font-family: "Jost";
src: url("../fonts/jost-700-bold-webfont.woff") format("woff"),
url("../fonts/jost-700-bold-webfont.woff2") format("woff2");
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: "Jost";
src: url("../fonts/jost-700-bolditalic-webfont.woff") format("woff"),
url("../fonts/jost-700-bolditalic-webfont.woff2") format("woff2");
font-weight: bold;
font-style: italic;
}
$mainColor: #000;
$lightColor: #444;
$accentColor: #0066ff;
$bgColor: #fff;
* {
font-family: "Jost", sans-serif;
a, a:hover, a:active, a:focus, a:visited {
color: $accentColor;
}
ul {
list-style: none;
}
}
header {
display: flex;
width: 100vw;
max-height: 10vh;
justify-content: space-between;
align-items: center;
border-bottom: solid 1px $lightColor;
#logo {
width: 7.5vh;
height: 7.5vh;
padding: 1vh;
img {
width: 100%;
transform: scale(1.2) translateY(0.8rem);
}
}
#main-title {
align-self: flex-end;
h1 {
font-size: 1.3rem;
font-weight: normal;
color: $mainColor;
text-transform: uppercase;
}
}
#hamburger {
padding: 1.5rem 1rem;
width: 7.5vh;
height: 7.5vh;
border-left: solid 1px $lightColor;
display: flex;
flex-direction: column;
justify-content: space-between;
cursor: pointer;
div {
border-bottom: solid 1px $mainColor;
width: 100%;
background-color: $mainColor;
opacity: 1;
transition: opacity 0.2s ease-out, transform 0.4s ease-out;
transform: none;
}
}
#hamburger.open {
div:first-of-type {
transform: translate(0rem, calc(7.5vh / 2 - 1.5rem)) rotate(-45deg);
}
div:nth-of-type(2) {
opacity: 0;
}
div:last-of-type {
transform: translate(0rem, calc((7.5vh / 2 - 1.5rem) * -1)) rotate(45deg);
}
}
}
nav {
background-color: $accentColor;
max-height: 0vh;
height: auto;
transition: max-height 0.8s ease-out;
ul {
padding: 1rem 0 1rem 7.5vh;
margin: 0;
li {
a, a:hover, a:active, a:focus, a:visited {
padding-left: 0;
transition: padding-left 0.3s ease-out;
color: $bgColor;
font-weight: bold;
font-size: 1.2rem;
}
}
li a:hover {
padding-left: 1rem;
}
}
}
nav.open {
max-height: 20vh;
}
#about {
color: $accentColor;
line-height: 1.4;
border-bottom: solid 1px $mainColor;
padding: 1rem 1.2rem 1rem 1.2rem;
font-weight: 500;
display: grid;
grid-template-columns: 1fr;
grid-template-rows: repeat(3, auto);
justify-items: center;
#about-hidden {
overflow: hidden;
height: auto;
max-height: 0vh;
transition: max-height 1s ease-out;
font-weight: normal;
}
#about-hidden.open {
max-height: 50vh;
}
#about-arrow {
width: 7.5vh;
height: 3.75vh;
display: flex;
justify-content: space-around;
margin-top: 1rem;
transform: rotate(0deg) scale(0.5);
transition: transform 0.5s ease-out;
cursor: pointer;
div {
width: 50%;
border-bottom: solid 1px $mainColor;
}
div:first-of-type {
transform: translateX(50%) translateY(-1rem) rotate(45deg);
}
div:last-of-type {
transform: translateX(-50%) translateY(-1rem) rotate(-45deg);
}
}
#about-arrow.open {
transform: rotate(180deg) scale(0.5);
}
}
main {
display: grid;
padding: 1.2rem;
.article-card {
cursor: pointer;
width: 100%;
margin: 2rem 0;
.img-cover {
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
max-height: 40vh;
position: relative;
.eye {
position: absolute;
opacity: 0;
background-color: rgba(255, 255, 255, 0.5);
transition: opacity 0.3s ease-out;
z-index: 1;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
.eye-picto {
width: 35%;
height: 100%;
-webkit-mask: url(../images/eye.svg) no-repeat center;
mask: url(../images/eye.svg) no-repeat center;
mask-size: 100%;
-webkit-mask-size: 100%;
background-color: $accentColor;
}
}
> img {
z-index: 0;
width: 100%;
transform: scale(1);
transition: transform 0.3s ease-out;
}
}
.date {
margin-top: 0.8rem;
font-weight: 500;
color: $accentColor;
}
h3 {
font-weight: normal;
font-size: 1rem;
margin: 0;
}
}
.article-card:hover {
.img-cover {
.eye {
opacity: 1;
}
> img {
transform: scale(1.1);
}
}
}
}
article {
position: fixed;
width: 100vw;
height: 100vh;
top: 0;
left: 0;
background-color: rgba(255, 255, 255, 0.5);
z-index: 3;
display: flex;
align-items: center;
justify-content: center;
#article-wrapper {
border: solid 1px $mainColor;
width: 95vw;
max-height: 90vh;
overflow-y: auto;
background-color: $bgColor;
padding-bottom: 1.5rem;
.article-header {
position: relative;
width: 100%;
height: 3rem;
margin-top: 2rem;
display: flex;
align-items: center;
margin-bottom: 1rem;
.article-siblings {
width: 100%;
padding: 0 7vw;
display: flex;
justify-content: space-between;
a {
color: $mainColor;
display: flex;
align-items: center;
i {
font-size: 0.5rem;
padding: 0.3rem;
}
}
}
.close-article {
z-index: 11;
display: block;
padding-top: 0.75rem;
width: 1.5rem;
height: 1.5rem;
position: absolute;
right: 0.5rem;
top: -1.5rem;
cursor: pointer;
div {
width: 100%;
border-bottom: solid 1px $mainColor;
}
div:first-of-type {
transform: rotate(45deg);
}
div:last-of-type {
transform: rotate(-45deg);
}
}
}
.swiper {
max-height: 40vh;
overflow: hidden;
opacity: 0;
transition: opacity 0.3s ease-out;
.swiper-wrapper {
.swiper-slide {
display: flex;
justify-content: center;
padding: 0 7vw;
img {
box-sizing: content-box;
width: 100%;
}
}
}
.swiper-button-prev, .swiper-button-next {
color: $mainColor;
transform: scale(0.5);
}
.swiper-button-prev {
left: 0;
}
.swiper-button-next {
right: 0;
}
}
}
.article-date {
padding: 0 7vw;
font-weight: 500;
color: $accentColor;
margin: 0;
margin-top: 1rem;
}
.article-titre {
padding: 0 7vw;
font-weight: bold;
margin: 0;
}
.article-content {
padding: 0 7vw
}
}
@media screen and (min-width: 960px) {
header {
#logo {
width: 15vw;
img {
padding-left: 40%;
padding-right: 10%;
}
}
#main-title {
width: 100%;
h1 {
font-size: 2rem;
padding-left: 2.5vw;
margin-bottom: 0.5rem;
}
}
}
nav {
ul {
padding: 1rem 0 1rem 15vw;
}
}
#about {
grid-template-columns: repeat(2, auto);
grid-template-rows: repeat(2, auto);
padding: 1rem 0 1rem 15vw;
cursor: pointer;
#about-summary {
padding-right: calc(15vw - 7.5vh);
}
#about-hidden {
grid-row: 2;
grid-column: 1;
padding-right: calc(15vw - 7.5vh);
}
#about-arrow {
grid-row: 1 / 3;
grid-column: 2;
align-self: center;
}
#about-hidden.open {
max-height: 20vh;
}
}
main {
grid-template-columns: repeat(3, 1fr);
column-gap: 2rem;
.article-card {
.img-cover {
max-height: 20vh;
}
}
}
article {
#article-wrapper {
width: 60vw;
.swiper-button-prev {
left: 1rem !important;
}
.swiper-button-next {
right: 1rem !important;
}
}
}
}
@media screen and (min-width: 1280px) {
main {
margin: 2rem 15vw;
padding: 0;
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

View File

@ -0,0 +1,45 @@
{% extends 'partials/base.html.twig' %}
{% block content %}
{% if page.url == "/" %}
{% else %}
<article>
<div id="article-wrapper">
<div class="article-header">
{% if page.parent.title == "Articles" %}
<div class="article-siblings">
{% if not page.isFirst %}
<a href="{{ page.nextSibling.url }}"><i class="fa-solid fa-chevron-left"></i> Article suivant</a>
{% else %}
<div></div>
{% endif %}
{% if not page.isLast %}
<a href="{{ page.prevSibling.url }}">Article précédent <i class="fa-solid fa-chevron-right"></i></a>
{% endif %}
</div>
{% endif %}
<a href="{{ home_url }}" class="close-article">
<div></div>
<div></div>
</a>
</div>
<div class="swiper">
<div class="swiper-button-prev"></div>
<div class="swiper-wrapper">
{% for image in page.media.images %}
<div class="swiper-slide">
<img src="{{ image.url }}" alt="{{ page.title }}">
</div>
{% endfor %}
</div>
<div class="swiper-button-next"></div>
</div>
{% if page.parent.title == "Articles" %}
<p class="article-date">{{ page.date | date('d/m/Y') }}</p>
{% endif %}
<p class="article-titre">{{ page.title }}</p>
<div class="article-content">{{ page.content|raw }}</div>
</div>
</article>
{% endif %}
{% endblock %}

View File

@ -0,0 +1,8 @@
{% extends 'partials/base.html.twig' %}
{% block content %}
<div class="lead text-center">
<h1>Error!</h1>
{{ page.content|raw }}
</div>
{% endblock %}

View File

@ -0,0 +1,12 @@
<div id="about" onClick="toggleAbout()">
<div id="about-summary">
{{ page.find('/').summary|raw }}
</div>
<div id="about-hidden">
{{ page.find('/').content|slice(page.summary|length, page.content|length)|markdown(false) }}
</div>
<div id="about-arrow">
<div></div>
<div></div>
</div>
</div>

View File

@ -0,0 +1,16 @@
<main>
{% for article in page.find('/articles').children.published.order('date', 'desc') %}
<div class="article-card">
<a href="{{ article.url }}" data-barba="link">
<div class="img-cover">
<div class="eye">
<div class="eye-picto"></div>
</div>
<img src="{{ article.media.images|first.url }}" alt="{{ article.title }}" />
</div>
<div class="date">{{ article.date | date('d/m/Y') }}</div>
<h3>{{ article.title }}</h3>
</a>
</div>
{% endfor %}
</main>

View File

@ -0,0 +1,58 @@
<!DOCTYPE html>
<html lang="{{ (grav.language.getActive ?: grav.config.site.default_lang)|e }}">
<head>
{% block head %}
<meta charset="utf-8" />
<title>{% if header.title %}{{ header.title|e }} | {% endif %}{{ site.title|e }}</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
{% include 'partials/metadata.html.twig' %}
<link rel="icon" type="image/png" href="{{ url('theme://images/logo.png')|e }}" />
<link rel="canonical" href="{{ page.canonical(true)|e }}" />
{% endblock head %}
{% block stylesheets %}
{% do assets.addCss('theme://css/pure.min.css', 100) %}
{% do assets.addCss('theme://css/font-awesome.min.css', 99) %}
{% do assets.addCss('theme://css/custom.css', 98) %}
{% do assets.addCss('theme://css/swiper.bundle.css', 97) %}
{% do assets.addCss('theme://css/styles.css', 96) %}
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" rel="stylesheet">
{% endblock %}
{% block javascripts %}
{% do assets.addJs('theme://js/jquery.min.js', 100) %}
<script src="https://cdn.jsdelivr.net/npm/gsap@3.12.5/dist/gsap.min.js"></script>
<script src="https://unpkg.com/@barba/core@2.9.7/dist/barba.umd.js"></script>
{% do assets.addJs('theme://js/swiper-bundle.min.js', 98) %}
{% do assets.addJs('theme://js/script.js', 97) %}
{% endblock %}
{% block assets deferred %}
{{ assets.css()|raw }}
{{ assets.js()|raw }}
{% endblock %}
</head>
<body id="top" class="{{ page.header.body_classes|e }}" data-barba="wrapper">
{% block header %}
{% include 'partials/header.html.twig' %}
{% include 'partials/nav.html.twig' %}
{% include 'partials/about.html.twig' %}
{% endblock %}
{% block body %}
{% include 'partials/articles-list.html.twig' %}
<div data-barba="container">
{% block content %}{% endblock %}
</div>
{% endblock %}
{% block bottom %}
{{ assets.js('bottom')|raw }}
{% endblock %}
</body>
</html>

View File

@ -0,0 +1,13 @@
<header>
<a id="logo" href="{{ home_url }}">
<img src="{{ url('theme://images/logo_ateliers55.svg') }}" alt="Logo Ateliers 55" />
</a>
<a id="main-title" href="{{ home_url }}">
<h1>{{ page.find('/').title|e }}</h1>
</a>
<div id="hamburger" onClick="toggleMenu(this)">
<div></div>
<div></div>
<div></div>
</div>
</header>

View File

@ -0,0 +1,13 @@
<nav>
<ul>
<li>
<a href="#" onClick="toggleAbout()">à propos</a>
</li>
<li>
<a href="{{ base_url }}/contact">contact</a>
</li>
<li>
<a href="{{ base_url }}/mentions-legales">mentions légales</a>
</li>
</ul>
</nav>

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.6 KiB