This commit is contained in:
Julie Blanc 2025-12-16 18:00:01 +01:00
commit 162cee6dc9
35 changed files with 1122 additions and 0 deletions

4
.gitignore vendored Normal file
View file

@ -0,0 +1,4 @@
.DS_Store
assets/fonts/*
assets/css/style.css
assets/css/style.css.map

View file

@ -0,0 +1,35 @@
* {
margin: 0;
padding: 0;
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
-o-font-smoothing: antialiased;
scroll-behavior: smooth;
}
a {
color: currentColor;
}
button{
background: none;
outline: none;
border: none;
color: var(--color-txt);
}
iframe{
border: none;
}
body{
font-family: var(--font);
line-height: var(--leading-normal);
font-size: var(--fs-normal);
color: var(--color-txt);
background-color: var(--color-bg);
width: 100vw;
overflow-x: hidden;
}

View file

@ -0,0 +1,11 @@
$desktop: "screen and (min-width: 1200px)";
$medium: "screen and (max-width: 1080px)";
$medium-up: "screen and (min-width: 1080px)";
$small-up: "screen and (min-width: 720px)";
$small: "screen and (max-width: 720px)";
$x-small: "screen and (max-width: 560px)";
$paysage: "screen and (max-height: 670px) and (min-width: 1080px)";
@media #{$medium}{
}

77
assets/css/base/_var.scss Normal file
View file

@ -0,0 +1,77 @@
:root {
--font: 'Executive', Arial, sans-serif;
--title: 'System', Arial, sans-serif;
// --fs-x-small: 10px;
// --fs-small: 12px;
// --fs-normal: 16px;
// --fs-medium: 22px;
// --fs-big: 38px;
--fs-x-small: 10px;
--fs-small: 12px;
--fs-normal: 16px;
--fs-medium: 20px;
--fs-big: 30px;
--fs-x-big: 38px;
--fs-button-bold: 22px;
@media #{$small} {
--fs-medium: 20px;
--fs-big: 26px;
}
--leading-tight: 1;
--leading-normal: 1.2;
// --leading-relaxed: 1.4;
// --leading-loose: 1.8;
--fw-normal: 400;
--fw-medium: 500;
--fw-bold: 600;
--grey-100: #d8d8d8;
--grey-200: #c8c8c8;
--grey-300: #b9b9b9;
--grey-400: #969696;
--grey-600: #6d6d6d;
--grey-800: #383838;
--color-bg: #161616;
--color-txt: #ffffff;
--color-txt-light: var(--grey-600);
--color-accent: #00ff00;
--color-accent-50: #e9ffe9;
--color-accent-100: #d8fdd8;
--border: 1px solid var(--color-txt);
--border-light: 1px solid var(--grey-800);
--header-h: 80px;
--header-h-shrinked: 50px;
// responsive
--padding-body: 26px;
--radius-small: 4px;
--spacing: 30px;
--h-block: 30px;
--curve: cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
@media #{$small}{
:root {
--fs-x-small: 10px;
--fs-small: 11px;
--fs-normal: 14px;
--fs-medium: 20px;
--fs-big: 30px;
--fs-x-big: 38px;
}
}

View file

@ -0,0 +1,60 @@
#btn--don__mobile {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
padding-top: calc(var(--spacing) * 0.5);
padding-bottom: calc(var(--spacing) * 1.5);
position: fixed;
bottom: 0px;
left: 0;
z-index: 100;
opacity: 0;
transition: opacity ease-in 0.2s;
pointer-events: none;
&.is-visible {
pointer-events: all;
opacity: 1;
}
&.is-sticky {
position: relative;
}
@media #{$small-up} {
display: none !important;
}
}
.btn--don {
--vertical-padding: 0.5ch;
height: calc(var(--h-block) + var(--vertical-padding));
border-radius: calc(var(--h-block) / 1);
padding: var(--vertical-padding) 2ch;
background-color: var(--color-accent);
color: var(--color-bg);
font-family: var(--font);
font-size: var(--fs-medium);
font-weight: var(--fw-bold);
a {
text-decoration: none;
display: flex;
align-items: center;
gap: 0.5ch;
}
.icon {
height: 28px;
position: relative;
top: 1px;
}
svg {
fill: var(--color-bg);
width: 24px;
height: 24px;
}
}

View file

@ -0,0 +1,101 @@
button{
cursor: pointer;
font-family: var(--font);
font-size: var(--fons-normal);
color: var(--color-txt);
&:hover{
color: var(--grey-100);
}
a{
text-decoration: none;
width: 100%;
height: 100%;
}
}
button:disabled{
cursor: auto;
}
.btn__default{
--size: calc(var(--h-block) - 8px);
font-size: var(--fs-normal);
font-weight: var(--fw-normal);
height: var(--size);
padding-right: 1.5ch;
position: relative;
display: flex;
align-items: center;
gap: 0ch;
// padding-right: 0.5ch;
color: var(--color-accent);
font-weight: var(--fw-medium);
text-decoration: none;
cursor: pointer;
.icon, .txt{ z-index: 10; }
.icon{
width: var(--size);
height: var(--size);
display: flex;
align-items: center;
justify-content: center;
color: var(--color-bg);
text-align: center;
svg{
fill: var(--color-bg);
width: 80%;
}
}
.txt{
font-family: var(--font-title);
color: var(--color-accent);
font-size: var(--fs-normal);
font-weight: var(--fw-bold);
padding-left: 1ch;
}
&::after{
content: '';
display: block;
background-color: var(--color-accent);
border-radius: calc(var(--size)/2);
width: var(--size);
height: var(--size);
position: absolute;
left: 0;
z-index: 0;
transition: width .2s
}
&:hover{
//
.txt{
color: var(--color-bg);
display: block;
}
&::after{
width: 100%;
}
}
}

View file

@ -0,0 +1,127 @@
.form__newsletter{
--size: 24px;
position: relative;
display: flex;
align-items: center;
position: relative;
input[type="email"]{
height: calc(var(--h-block)*1.25);
width: 100%;
border-radius: calc(var(--h-block)*0.625);
outline: none;
border: none;
padding: 0 2ch;
font-family: var(--font);
font-size: var(--fs-normal);
z-index: 40;
padding-top: 4px;
&::placeholder{
font-family: var(--font);
font-size: var(--fs-normal);
}
&:focus{
outline: 3px solid var(--grey-400);
}
}
button[type="submit"].btn--bold{
position: absolute;
right: 2px;
z-index: 100;
}
button[type="submit"].btn--bold {
--size: calc(var(--h-block)*1.25 - 4px);
font-family: var(--font);
font-size: var(--fs-button-bold);
height: var(--size);
display: flex;
align-items: center;
gap: 0.75ch;
color: var(--color-accent);
font-weight: var(--fw-medium);
text-decoration: none;
cursor: pointer;
.icon, .txt{ z-index: 10; }
.icon{
width: var(--size);
height: var(--size);
display: flex;
align-items: center;
justify-content: center;
color: var(--color-bg);
text-align: center;
svg{
fill: var(--color-bg);
width: 80%;
}
}
.txt{
position: relative;
top: 2px;
font-size: var(--fs-normal);
display: none;
padding-left: 1ch;
}
&::after{
content: '';
display: block;
background-color: var(--color-accent);
border-radius: calc(var(--size)/2);
width: var(--size);
height: var(--size);
position: absolute;
right: 0;
z-index: 0;
transition: width .2s
}
&:hover{
.txt{
color: var(--color-bg);
display: block;
}
&::after{
width: 100%;
}
}
// @media #{$small}{
// .txt{
// color: var(--color-bg);
// display: block;
// }
// &::after{
// width: 100%;
// }
// }
}
}

View file

@ -0,0 +1,57 @@
.list-socials {
list-style: none;
display: flex;
justify-content: space-between;
align-items: center;
max-width: 400px;
a{
display: flex;
align-items: center;
text-decoration: none;
}
.icon{
width: 24px;
height: 24px;
position: relative;
top: -2px;
}
svg{
display: flex;
align-items: center;
width: 24px;
height: 24px;
}
.text{ display: none; }
}
// with text
@media #{$small-up}{
.footer__socials .list-socials{
display: block;
li{
margin-bottom: calc(var(--spacing)*0.5);
break-inside: avoid;
}
a{
gap: 1ch;
height: calc(var(--spacing)*1);
&::after{
content: '';
color: var(--grey-300);
}
}
.text{
display: block;
line-height: 1;
}
}
}

View file

@ -0,0 +1,40 @@
.nav--tabs{
height: calc(var(--h-block)*1);
width: auto;
border: var(--border);
border-radius: var(--radius-small);
overflow: hidden;
display: inline-flex;
width: auto;
margin: 0 auto;
margin-bottom: var(--spacing);
.nav--tabs__btn{
font-family: var(--font);
font-size: var(--fs-small);
font-weight: var(--fw-medium);
padding: 0 2ch;
&.is-selected{
background-color: var(--color-txt);
color: var(--color-bg);
}
&:not(.is-selected):hover{
background-color: var(--grey-800);
cursor: pointer;
}
}
.nav--tabs__btn + .nav--tabs__btn{
border-left: var(--border);
}
}

View file

@ -0,0 +1,68 @@
[data-template="subscription-newsletter"],
[data-template="thanks"],
[data-template="support"],
[data-template="store"]{
.p__baseline-big{
font-family: var(--title);
font-size: var(--fs-big);
font-weight: var(--fw-bold);
line-height: 1.1;
text-align: center;
margin: calc(var(--spacing)*1) 0;
strong{
font-weight: var(--fw-bolf);
color: var(--color-accent);
}
.link-don{
display: block;
color: var(--color-accent);
text-decoration: none;
// &::after{
// content: '';
// font-size: 0.8em;
// }
&:hover{
text-decoration: underline 2px;
text-underline-offset: 4px;
}
}
}
.p__baseline{
font-size: var(--fs-medium);
font-weight: var(--fw-medium);
line-height: 1.1;
text-align: center;
margin: calc(var(--spacing)*1) 0;
@media #{$small}{
text-align: center;
margin: var(--spacing) 0;
}
}
.p__details{
font-size: var(--fs-small);
margin-bottom: 0.5em;
color: var(--grey-400);
}
.section__heading{
font-size: var(--fs-normal);
font-weight: var(--fw-medium);
line-height: 1;
text-align: center;
margin-top: calc(var(--spacing)*0.5);
margin-bottom: calc(var(--spacing)*1);
}
ul, ol{
margin-left: 3ch;
margin-bottom: 0.5em;
}
}

View file

@ -0,0 +1,15 @@
body{
min-height: 100dvh;
min-height: 100vh;
display: flex;
flex-direction: column;
main{
flex-grow: 1;
margin-top: var(--header-h);
padding: 0 var(--padding-body);
}
}

View file

@ -0,0 +1,94 @@
#site-footer{
background-color: black;
padding: calc(var(--padding-body)*2) var(--padding-body);
.logo {
margin-top: calc(var(--spacing)*0.25);
margin-bottom: calc(var(--spacing)*1);
svg{
width: 100px;
}
}
p{
margin: calc(var(--spacing)*0.5) 0;
a{
text-decoration: none;
&:hover{
text-decoration: underline;
color: currentColor;
}
}
}
.p__small{
font-size: var(--fs-x-small);
color: var(--grey-600);
}
.footer__mentions{
p{
font-size: var(--fs-small);
color: var(--color-txt)
}
}
@media #{$small}{
margin-top: calc(var(--spacing)*2);
.footer__socials{
margin-top: calc(var(--spacing)*0.75);
padding-top: calc(var(--spacing)*0.25);
border-top: var(--border-light);
.list-socials{
margin-top: calc(var(--spacing)*0.5);
margin-bottom: calc(var(--spacing)*0.75);
}
}
.footer__mentions{
border-top: var(--border-light);
padding-top: calc(var(--spacing)*0.25);
p{
font-size: var(--fs-small);
text-align: center;
}
}
}
@media #{$small-up}{
.site-footer__container{
display: grid;
grid-template-columns: 1fr 1fr;
column-gap: calc(var(--spacing)*2);
max-width: 1200px;
margin: 0 auto;
}
.footer__socials .container{
max-width: 400px;
columns: 2;
margin-top: calc(var(--spacing)*1);
}
.footer__mentions{
grid-column: span 2;
p{
margin-top: calc(var(--spacing)*1);
}
}
}
}

View file

@ -0,0 +1,84 @@
@keyframes add-border {
from {
border-bottom-color: transparent;
}
to {
border-bottom: var(--grey-800);
}
}
#site-header {
position: fixed;
left: var(--padding-body);
top: 0px;
z-index: 900;
--gap: 3ch;
width: calc(100vw - var(--padding-body)*2);
height: var(--header-h);
background-color: var(--color-bg);
border-bottom: var(--border-light);
display: flex;
align-items: center;
justify-content: space-between;
gap: var(--gap);
a{
text-decoration: none;
&:hover{
color: var(--grey-200);
}
}
#site-title {
flex-grow: 2;
svg{
width: 100px;
}
}
ul{
list-style-type: none;
display: flex;
align-items: center;
gap: var(--gap);
}
#btn--soutenir{
color: var(--color-accent);
a:hover{
color: var(--color-accent);
text-decoration: underline;
}
}
ul, #btn--soutenir{
text-transform: uppercase;
}
#lang-toggle{
display: flex;
gap: 1ch;
button:disabled{ color: var(--color-txt-light); }
}
#menu-toggle{
cursor: pointer;
svg{
width: 30px;
}
.close{ display: none; }
}
button{
&:hover{
svg{ fill: var(--grey-200)!important; }
}
}
}

21
assets/css/style.scss Normal file
View file

@ -0,0 +1,21 @@
@charset "UTF-8";
@import 'base/responsive';
@import 'base/var';
@import 'base/body';
@import 'partials/site-header';
// @import 'components/nav-tabs';
// @import 'components/btn--default';
@import 'components/buttons';
@import 'components/form-newsletter';
@import 'components/list-socials';
@import 'components/text';
@import 'partials/site-header';
@import 'partials/site-footer';
@import 'partials/main-layout';

BIN
assets/favicon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 38 KiB

View file

@ -0,0 +1,6 @@
<svg width="34px" height="34px" viewBox="0 0 16 13" 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;">
<rect id="Artboard1" x="0" y="0" width="15.43" height="12.636" style="fill:none;"/>
<g id="Artboard11" serif:id="Artboard1">
<path d="M0,7.29L0,5.373L9.801,5.373C10.67,5.373 11.757,5.4 12.387,5.427C11.952,5.022 11.366,4.455 10.888,3.969L8.432,1.404L9.366,0L15.43,6.318L9.366,12.636L8.432,11.232L10.888,8.667C11.366,8.181 11.952,7.614 12.387,7.236C11.757,7.263 10.67,7.29 9.801,7.29L0,7.29Z" style="fill-rule:nonzero;"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 741 B

View file

@ -0,0 +1,10 @@
<svg width="34px" height="34px" viewBox="0 0 34 34" 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;">
<g transform="matrix(2.125,0,0,2.125,0,3.1875)">
<rect x="0" y="0" width="15.43" height="12.636" style="fill:none;"/>
</g>
<g transform="matrix(1.5026,-1.5026,1.5026,1.5026,-4.69164,18.7124)">
<g>
<path d="M0,7.29L0,5.373L9.801,5.373C10.67,5.373 11.757,5.4 12.387,5.427C11.952,5.022 11.366,4.455 10.888,3.969L8.432,1.404L9.366,0L15.43,6.318L9.366,12.636L8.432,11.232L10.888,8.667C11.366,8.181 11.952,7.614 12.387,7.236C11.757,7.263 10.67,7.29 9.801,7.29L0,7.29Z" style="fill-rule:nonzero;"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 850 B

View file

@ -0,0 +1,4 @@
<svg style="fill: var(--color-txt)" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect y="22.3249" width="31.1111" height="2.22222" transform="rotate(-45 0 22.3249)" />
<rect x="1.80078" width="31.1111" height="2.22222" transform="rotate(45 1.80078 0)" />
</svg>

After

Width:  |  Height:  |  Size: 309 B

5
assets/icons/menu.svg Normal file
View file

@ -0,0 +1,5 @@
<svg style="fill: var(--color-txt)" width="32" height="20" viewBox="0 0 32 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="31.1111" height="2.22222" />
<rect y="8.88892" width="31.1111" height="2.22222" />
<rect y="17.7778" width="31.1111" height="2.22222" />
</svg>

After

Width:  |  Height:  |  Size: 284 B

View file

@ -0,0 +1,10 @@
<svg height="80px" width="80px" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
viewBox="0 0 512 512" xml:space="preserve">
<g>
<g>
<path d="M500.203,236.907L30.869,2.24c-6.613-3.285-14.443-2.944-20.736,0.939C3.84,7.083,0,13.931,0,21.333v469.333
c0,7.403,3.84,14.251,10.133,18.155c3.413,2.112,7.296,3.179,11.2,3.179c3.264,0,6.528-0.747,9.536-2.24l469.333-234.667
C507.435,271.467,512,264.085,512,256S507.435,240.533,500.203,236.907z"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 518 B

View file

@ -0,0 +1,9 @@
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<rect width="39.2157" height="39.2157" fill="url(#pattern0_310_283)"/>
<defs>
<pattern id="pattern0_310_283" patternContentUnits="objectBoundingBox" width="1" height="1">
<use xlink:href="#image0_310_283" transform="scale(0.01)"/>
</pattern>
<image id="image0_310_283" width="100" height="100" preserveAspectRatio="none" xlink:href="data:image/png;base64,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"/>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

View file

@ -0,0 +1,3 @@
<svg width="35" height="35" viewBox="0 0 35 35" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M17.2549 0C7.72549 0 0 7.72549 0 17.2549C0 25.9059 6.37255 33.0486 14.6761 34.2965V21.8282H10.4071V17.2925H14.6761V14.2745C14.6761 9.27765 17.1106 7.08392 21.2635 7.08392C23.2526 7.08392 24.3043 7.23137 24.8024 7.29882V11.258H21.9694C20.2063 11.258 19.5906 12.9294 19.5906 14.8133V17.2925H24.7576L24.0565 21.8282H19.5906V34.3333C28.0126 33.1906 34.5098 25.9898 34.5098 17.2549C34.5098 7.72549 26.7843 0 17.2549 0Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 542 B

View file

@ -0,0 +1,3 @@
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M9.14777 0C4.10333 0 0 4.10713 0 9.15288V22.2248C0 27.2692 4.10713 31.3725 9.15288 31.3725H22.2248C27.2692 31.3725 31.3725 27.2654 31.3725 22.2197V9.14777C31.3725 4.10333 27.2654 0 22.2197 0H9.14777ZM24.8366 5.22876C25.5582 5.22876 26.1438 5.81438 26.1438 6.53595C26.1438 7.25752 25.5582 7.84314 24.8366 7.84314C24.115 7.84314 23.5294 7.25752 23.5294 6.53595C23.5294 5.81438 24.115 5.22876 24.8366 5.22876ZM15.6863 7.84314C20.0118 7.84314 23.5294 11.3608 23.5294 15.6863C23.5294 20.0118 20.0118 23.5294 15.6863 23.5294C11.3608 23.5294 7.84314 20.0118 7.84314 15.6863C7.84314 11.3608 11.3608 7.84314 15.6863 7.84314ZM15.6863 10.4575C14.2995 10.4575 12.9696 11.0084 11.989 11.989C11.0084 12.9696 10.4575 14.2995 10.4575 15.6863C10.4575 17.073 11.0084 18.403 11.989 19.3836C12.9696 20.3641 14.2995 20.915 15.6863 20.915C17.073 20.915 18.403 20.3641 19.3836 19.3836C20.3641 18.403 20.915 17.073 20.915 15.6863C20.915 14.2995 20.3641 12.9696 19.3836 11.989C18.403 11.0084 17.073 10.4575 15.6863 10.4575Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View file

@ -0,0 +1,3 @@
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M28.1905 0H3.80952C1.70667 0 0 1.70667 0 3.80952V28.1905C0 30.2933 1.70667 32 3.80952 32H28.1905C30.2933 32 32 30.2933 32 28.1905V3.80952C32 1.70667 30.2933 0 28.1905 0ZM9.90476 12.1905V26.6667H5.33333V12.1905H9.90476ZM5.33333 7.97714C5.33333 6.91048 6.24762 6.09524 7.61905 6.09524C8.99048 6.09524 9.85143 6.91048 9.90476 7.97714C9.90476 9.04381 9.05143 9.90476 7.61905 9.90476C6.24762 9.90476 5.33333 9.04381 5.33333 7.97714ZM26.6667 26.6667H22.0952C22.0952 26.6667 22.0952 19.6114 22.0952 19.0476C22.0952 17.5238 21.3333 16 19.4286 15.9695H19.3676C17.5238 15.9695 16.7619 17.539 16.7619 19.0476C16.7619 19.741 16.7619 26.6667 16.7619 26.6667H12.1905V12.1905H16.7619V14.141C16.7619 14.141 18.2324 12.1905 21.1886 12.1905C24.2133 12.1905 26.6667 14.2705 26.6667 18.4838V26.6667Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 908 B

View file

@ -0,0 +1,9 @@
<svg width="30" height="31" viewBox="0 0 30 31" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<rect width="29.9355" height="30.8125" fill="url(#pattern0_441_207)"/>
<defs>
<pattern id="pattern0_441_207" patternContentUnits="objectBoundingBox" width="1" height="1">
<use xlink:href="#image0_441_207" transform="matrix(0.01 0 0 0.00971537 0 0.0142315)"/>
</pattern>
<image id="image0_441_207" width="100" height="100" preserveAspectRatio="none" xlink:href="data:image/png;base64,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"/>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

View file

@ -0,0 +1,3 @@
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M29.4 3.5V25.9C29.4 27.8299 27.8299 29.4 25.9 29.4H3.5C1.5701 29.4 0 27.8299 0 25.9V3.5C0 1.5701 1.5701 0 3.5 0H25.9C27.8299 0 29.4 1.5701 29.4 3.5ZM20.6808 22.3391C22.5785 20.4435 22.5253 18.074 21.903 16.6201C21.525 15.7416 20.8474 14.9891 19.9444 14.4445L19.7883 14.3479C19.5573 14.2023 19.362 14.0854 19.0561 13.9685C19.0505 13.7739 19.0386 13.5793 19.0155 13.4036C18.6025 10.2109 16.5298 9.5291 14.8589 9.5186C13.3511 9.5186 12.0967 10.1626 11.3281 11.333L12.4985 12.1016C13.0137 11.3169 13.8082 10.9193 14.8547 10.9193C16.5116 10.9298 17.3922 11.7754 17.6267 13.58C16.828 13.4183 15.9285 13.3602 14.9618 13.4169C12.215 13.5751 11.0691 15.2306 11.1524 16.8021C11.2462 18.5423 12.747 19.7575 14.8036 19.7575C14.8946 19.7575 14.9849 19.7554 15.0724 19.7498C16.6803 19.6616 18.6459 18.8468 18.9994 15.5057C19.0141 15.5148 19.0281 15.5239 19.0428 15.533L19.2199 15.6429C19.8723 16.0363 20.3546 16.5648 20.6157 17.1724C21.0658 18.2231 21.0931 19.9472 19.6903 21.3486C18.4779 22.5596 17.0219 23.0839 14.8351 23.1C12.4061 23.0818 10.5658 22.2985 9.3667 20.7725C8.2495 19.3529 7.6727 17.3054 7.651 14.6986C7.6727 12.089 8.2495 10.0464 9.3667 8.6275C10.5665 7.1008 12.411 6.3182 14.8365 6.3C17.2809 6.3182 19.152 7.1043 20.3973 8.6366C21.0021 9.3807 21.4648 10.3229 21.7728 11.4352L23.1224 11.0628C22.7626 9.7622 22.2117 8.6485 21.4837 7.7532C19.9619 5.8814 17.7296 4.9217 14.8365 4.9C11.9525 4.9217 9.7419 5.8842 8.2656 7.7623C6.9531 9.4304 6.2748 11.7607 6.2503 14.6993C6.2748 17.6344 6.9531 19.9696 8.2656 21.6384C9.7419 23.5158 11.949 24.479 14.8351 24.5C17.3999 24.4811 19.2031 23.8147 20.6808 22.3391ZM17.4951 14.9835C17.5441 14.9947 17.5917 15.0052 17.6365 15.0157C17.633 15.0703 17.6295 15.1179 17.626 15.1543C17.4062 17.9039 16.0195 18.2966 14.9933 18.3526C14.9296 18.3561 14.8666 18.3582 14.8036 18.3582C13.5079 18.3582 12.6028 17.703 12.551 16.7279C12.5055 15.8753 13.1362 14.9247 15.0437 14.8155C15.2516 14.8029 15.456 14.7966 15.6562 14.7966C16.3275 14.7959 16.9463 14.8589 17.4951 14.9835Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 2.1 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 16 KiB

View file

@ -0,0 +1,3 @@
<svg width="34" height="26" viewBox="0 0 34 26" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M32.8615 4.31373C32.549 2.58885 31.0601 1.33272 29.3321 0.940564C26.7463 0.392157 21.9608 0 16.7831 0C11.6085 0 6.74632 0.392157 4.15748 0.940564C2.4326 1.33272 0.940564 2.50919 0.628064 4.31373C0.3125 6.27451 0 9.01961 0 12.549C0 16.0784 0.3125 18.8235 0.704657 20.7843C1.02022 22.5092 2.50919 23.7653 4.23407 24.1575C6.97917 24.7059 11.6851 25.098 16.8627 25.098C22.0404 25.098 26.7463 24.7059 29.4914 24.1575C31.2163 23.7653 32.7053 22.5888 33.0208 20.7843C33.3333 18.8235 33.7255 15.9988 33.8051 12.549C33.6458 9.01961 33.2537 6.27451 32.8615 4.31373ZM12.549 18.0392V7.05882L22.117 12.549L12.549 18.0392Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 737 B

14
assets/index-logo.svg Normal file
View file

@ -0,0 +1,14 @@
<svg style="fill: var(--color-txt)" width="200px" viewBox="0 0 162 29" 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;">
<title>Index.ngo</title>
<g transform="matrix(1.04516,0,0,0.659091,57.4839,-6.59091)">
<rect x="-55" y="10" width="155" height="44" style="fill:none;"/>
<clipPath id="_clip1">
<rect x="-55" y="10" width="155" height="44"/>
</clipPath>
<g clip-path="url(#_clip1)">
<g transform="matrix(0.95679,0,0,1.51724,-55,10)">
<path d="M162,29L148.198,29L141.174,20.767L134.15,29L91.184,29L91.184,0.004L120.653,0.004L120.653,7.351L102.637,7.351L102.637,10.867L120.137,10.867L120.137,18.13L102.637,18.13L102.637,21.606L120.926,21.606L120.926,28.951L134.273,14.414L120.807,0L134.56,0L141.388,7.767L147.76,0L161.201,0L148.236,13.79L161.996,28.997L162,29ZM68.58,29L54.224,29L54.224,0.004L68.637,0.004C74.672,0.004 78.31,0.004 82.046,2.045C86.259,4.379 88.674,8.889 88.674,14.417C88.674,19.406 86.862,23.405 83.427,25.975C79.463,29 75.345,29 68.58,29ZM49.819,29L38.775,29L31.499,19.815C29.746,17.735 28.088,15.545 27.307,14.495C27.387,15.813 27.524,17.238 27.524,20.499L27.524,29L15.965,29L15.965,0.004L27.009,0.004L33.798,8.349C36.223,11.121 37.709,12.993 38.393,13.881C38.347,12.615 38.26,9.911 38.26,6.84L38.26,0.004L49.819,0.004L49.819,29ZM11.559,29L0,29L0,0.004L11.559,0.004L11.559,29ZM65.784,21.818L67.904,21.818C70.918,21.818 73.067,21.818 74.728,20.531C76.074,19.491 76.845,17.308 76.845,14.541C76.845,11.526 76.084,9.541 74.525,8.476C72.895,7.411 71.461,7.224 67.578,7.224L65.784,7.224L65.784,21.818Z" style="fill-rule:nonzero;"/>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.8 KiB

23
assets/js/onload.js Normal file
View file

@ -0,0 +1,23 @@
window.onload = function () {
includeHTML();
headerShrink();
};
window.onscroll = function () {
headerShrink();
};
function headerShrink() {
const header = document.getElementById('site-header');
const scrollPosition = window.scrollY || document.documentElement.scrollTop;
if (scrollPosition > 100) {
header.classList.add('is-shrinked');
} else {
header.classList.remove('is-shrinked');
}
}

View file

@ -0,0 +1,33 @@
// How to use
// <header id="header" w3-include-html="components/header.html"></header>
function includeHTML() {
var z, i, elmnt, file, xhttp;
/* Loop through a collection of all HTML elements: */
z = document.getElementsByTagName("*");
for (i = 0; i < z.length; i++) {
elmnt = z[i];
/*search for elements with a certain atrribute:*/
file = elmnt.getAttribute("w3-include-html");
if (file) {
/* Make an HTTP request using the attribute value as the file name: */
xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 200) {elmnt.innerHTML = this.responseText;}
if (this.status == 404) {elmnt.innerHTML = "Page not found.";}
/* Remove the attribute, and call this function once more: */
elmnt.removeAttribute("w3-include-html");
includeHTML();
}
}
xhttp.open("GET", file, true);
xhttp.send();
/* Exit the function: */
return;
}
}
}

View file

@ -0,0 +1,64 @@
<div class="site-footer__container">
<div class="footer__newsletter">
<div class="logo" w3-include-html="/assets/index-logo.svg"></div>
<p>
Recevez les dernières enquêtes et actualités dIndex directement
dans votre boîte mail.
</p>
<p>Inscrivez-vous à la newsletter</p>
<form class="form__newsletter">
<input
type="email"
name="email"
placeholder="Votre adresse e-mail"
required
/>
<button class="btn--bold" type="submit" aria-label="sinscrire">
<span class="txt">Sinscrire</span>
<span class="icon">
<svg
clip-rule="evenodd"
fill-rule="evenodd"
stroke-linejoin="round"
stroke-miterlimit="2"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="m14.523 18.787s4.501-4.505 6.255-6.26c.146-.146.219-.338.219-.53s-.073-.383-.219-.53c-1.753-1.754-6.255-6.258-6.255-6.258-.144-.145-.334-.217-.524-.217-.193 0-.385.074-.532.221-.293.292-.295.766-.004 1.056l4.978 4.978h-14.692c-.414 0-.75.336-.75.75s.336.75.75.75h14.692l-4.979 4.979c-.289.289-.286.762.006 1.054.148.148.341.222.533.222.19 0 .378-.072.522-.215z"
fill-rule="nonzero"
/>
</svg>
</span>
</button>
</form>
<p class="p__small">
En vous inscrivant, vous acceptez les
<a target="_blank" href="https://www.index.ngo/mentions-legales/"
>conditions dutilisation</a
>
dIndex qui vous informent notamment des droits dont vous disposez
sur vos données personnelles.
</p>
</div>
<div class="footer__socials">
<p>Suivez Index sur les réseaux sociaux</p>
<div class="container" w3-include-html="/components/socials.html">
</div>
</div>
<div class="footer__mentions">
<p>
© 2025 Index Investigation |
<a target="_blank" href="https://www.index.ngo/mentions-legales/">Mentions légales</a>
</p>
</div>
</div>

View file

@ -0,0 +1,42 @@
<h1 id="site-title">
<a
href="https://www.index.ngo/"
aria-label="Retour à laccueil"
title="aller au site d'Index"
w3-include-html="/assets/index-logo.svg">
</a>
</h1>
<nav id="nav-highlight">
<ul>
<li><a href="#">Enquêtes</a></li>
<li><a href="#">Impact</a></li>
</ul>
</nav>
<button id="btn--soutenir">
<a targer="_blank" href="https://soutenir.index.ngo/">Soutenez-nous</a>
</button>
<button id="theme-toggle">
<svg style="fill: var(--color-txt)" class="switch" width="24" height="24" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M22 41C32.4934 41 41 32.4934 41 22C41 11.5066 32.4934 3 22
3C11.5066 3 3 11.5066 3 22C3 32.4934 11.5066 41 22 41ZM7 22C7
13.7157 13.7157 7 22 7V37C13.7157 37 7 30.2843 7 22Z"></path>
</svg>
</button>
<div id="lang-toggle">
<button disabled>FR</button>
<button><a href="/en">EN</a></button>
</div>
<button id="menu-toggle">
<span class="open" w3-include-html="assets/icons/menu.svg"></span>
<span class="close" w3-include-html="assets/icons/menu-close.svg"></span>
</button>

45
components/socials.html Normal file
View file

@ -0,0 +1,45 @@
<ul class="list-socials" aria-label="Liste des réseaux sociaux dIndex">
<li>
<a href="https://x.com/index_ngo" target="_blank" rel="noopener noreferrer">
<span class="icon" w3-include-html="/assets/icons/socials/x-social.svg"></span>
<span class="text">X</span>
</a>
</li>
<li>
<a href="https://www.instagram.com/index.ngo/" target="_blank" rel="noopener noreferrer">
<span class="icon" w3-include-html="/assets/icons/socials/instagram.svg"></span>
<span class="text">Instagram</span>
</a>
</li>
<li>
<a href="https://www.facebook.com/index.ngo/" target="_blank" rel="noopener noreferrer">
<span class="icon" w3-include-html="/assets/icons/socials/facebook.svg"></span>
<span class="text">Facebook</span>
</a>
</li>
<li>
<a href="https://www.youtube.com/index-ngo" target="_blank" rel="noopener noreferrer">
<span class="icon" w3-include-html="/assets/icons/socials/youtube.svg"></span>
<span class="text">Youtube</span>
</a>
</li>
<li>
<a href="https://fr.linkedin.com/company/index-ngo" target="_blank" rel="noopener noreferrer">
<span class="icon" w3-include-html="/assets/icons/socials/linkedin.svg"></span>
<span class="text">LinkedIn</span>
</a>
</li>
<li>
<a href="https://bsky.app/profile/index-ngo.bsky.social" target="_blank" rel="noopener noreferrer">
<span class="icon" w3-include-html="/assets/icons/socials/bluesky.svg"></span>
<span class="text">Bluesky</span>
</a>
</li>
<li>
<a href="https://mastodon.design/@index_ngo@mastodon.social" target="_blank" rel="noopener noreferrer">
<span class="icon" w3-include-html="/assets/icons/socials/mastodon.svg"></span>
<span class="text">Mastodon</span>
</a>
</li>
</ul>

30
index.html Normal file
View file

@ -0,0 +1,30 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>INDEX</title>
<link rel="icon" type="image/png" href="/assets/favicon.png" />
<script src="/assets/js/temp/includeHtml.js"></script>
<script src="/assets/js/onload.js"></script>
<link rel="stylesheet" type="text/css" href="/assets/fonts/stylesheet.css">
<link rel="stylesheet" type="text/css" href="/assets/css/style.css">
</head>
<body>
<header id="site-header" w3-include-html="components/site-header.html"></header>
<main>
<p>Lobjet central de notre action est de concourir à la manifestation de la vérité dans des affaires où celle-ci est entravée par des intérêts de pouvoir.
Nos enquêtes portent principalement principalement sur les cas de violences policières, en France comme à l'international, ainsi que sur les violations des droits humains au sens large. Nous intervenons également dans les situations où nos techniques d'investigation numérique peuvent permettre d'établir les faits autour d'une controverse d'intérêt public, qu'elle soit historique ou contemporaine.
Notre champ daction est avant tout public. Nos enquêtes et rapports dexpertise sont souvent publiés en partenariat avec d'autres médias d'information et sont régulièrement utilisés dans les procédures judiciaires sur les affaires concernées, contribuant ainsi à l'établissement des faits.
Nous œuvrons également à la diffusion des techniques et des méthodes de linvestigation en sources ouvertes (OSINT) au sein de la société civile. Dans le cadre de notre programme de formation, nous animons des ateliers avec des collectifs citoyens, des ONG, des universités et le grand public. Enfin, nous intervenons régulièrement dans la sphère publique pour présenter nos travaux et notre approche.</p>
</main>
<footer id="site-footer" w3-include-html="components/site-footer.html"></footer>
</body>
</html>