From e13339fec03be1c217d406990c6e93c7b914a531 Mon Sep 17 00:00:00 2001 From: Simon C Date: Fri, 22 Oct 2021 16:43:20 +0200 Subject: [PATCH] =?UTF-8?q?feat:=20Mise=20=C3=A0=20jour=20du=20design?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- assets/styles/font.sass | 12 ++++ assets/styles/main.sass | 108 +++++++++++++++++++++++++++-------- content/_index.md | 30 +++++----- content/mentions-legales.md | 35 ++++++------ layouts/partials/footer.html | 10 ++-- layouts/partials/header.html | 3 +- 6 files changed, 137 insertions(+), 61 deletions(-) create mode 100644 assets/styles/font.sass diff --git a/assets/styles/font.sass b/assets/styles/font.sass new file mode 100644 index 0000000..d3717ac --- /dev/null +++ b/assets/styles/font.sass @@ -0,0 +1,12 @@ +html + font-size: 1.25rem + line-height: 1.15 + +body + font-size: 1.125rem + font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol" + @media screen and (max-width: $size-small) + font-size: .9rem + +p + line-height: 1.4 diff --git a/assets/styles/main.sass b/assets/styles/main.sass index 51ad4b0..a8aa056 100644 --- a/assets/styles/main.sass +++ b/assets/styles/main.sass @@ -1,23 +1,34 @@ -$size-small: 400px +$size-small: 500px + +@import "font" body - color: #2d3824 - background: #fff8eb - font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol" + --color-background: #fff8eb + --color-paragraph: #2d3824 + --color-highlight: #c14508 + + --border-style: dashed + --border-size: 4px + --link-style: dotted + + --tile: 2rem + + color: var(--color-paragraph) + background: var(--color-background) margin: 0 auto - padding: 0 1rem + padding: 0 var(--tile) max-width: 800px - font-size: 1.125rem - // background-image: repeating-conic-gradient(#fff 0 9deg, rgba(0, 0, 0, .1) 9deg 18deg) - // background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCI+CjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIyIiBoZWlnaHQ9IjEiIGZpbGw9IiNjY2MiPjwvcmVjdD4KPHJlY3QgeD0iNSIgeT0iNSIgd2lkdGg9IjIiIGhlaWdodD0iMSIgZmlsbD0iI2NjYyI+PC9yZWN0Pgo8L3N2Zz4=") + @media screen and (max-width: $size-small) - font-size: 1rem + --border-size: 2px + --tile: 1rem + hr - background: repeating-linear-gradient(90deg, transparent, transparent 9px, black 10px) - height: 12px - margin: 2em auto - position: relative border: 0 + border-bottom: var(--border-size) var(--border-style) var(--color-highlight) + margin: var(--tile) auto + @media screen and (max-width: $size-small) + margin: calc(var(--tile)*2) calc(var(--tile)*-1) ul.no-style margin: 0 @@ -25,41 +36,90 @@ ul.no-style list-style-type: none a, h1, h2, h3 - color: #c14508 + color: var(--color-highlight) -h1 +a + text-decoration: underline var(--link-style) + &:hover + text-decoration: underline + +h1, h2, h3 text-align: center +h2 + margin: calc(var(--tile)*1.5) auto + +h3 + border: var(--border-size) var(--border-style) var(--color-highlight) + // display: inline-block + margin: calc(var(--tile)*1.5) auto var(--tile) + padding: var(--tile) + .footer font-size: 0.8rem -.services - margin: 0 + @media screen and (max-width: $size-small) + .cell, .cell.-right + text-align: center + flex: 0 0 100% + +.flex + --margin-tile: calc(var(--tile)/2) + margin: calc(var(--margin-tile) * -1) padding: 0 list-style-type: none - $tile: 1rem - width: calc(100% + 2*$tile) - margin-left: -$tile + width: calc(100% + 2 * var(--margin-tile)) display: flex flex-wrap: wrap li text-align: center - padding: $tile - flex: 0 0 calc(100% * 6 / 12) + padding: var(--margin-tile) + flex: 0 0 50% box-sizing: border-box img max-width: 100% width: 40% -.contacts - width: 100% + @media screen and (max-width: $size-small) + margin: 0 + width: 100% + li + flex: 0 0 100% +.quote + border: var(--border-size) var(--border-style) var(--color-highlight) + padding: var(--tile) + margin: calc(1.5 * var(--tile)) 0 + position: relative + text-align: center + + h2 + color: var(--color-paragraph) + margin: 0 + + strong + color: var(--color-highlight) + font-size: 130% + + // &::before + // content: "" + // position: absolute + // width: 100% + // height: 100% + // right: -1rem + // bottom: -1rem + // background-color: var(--color-highlight) + // mask: url(/icons/quote.svg) no-repeat 100px 100px + // mask-size: 80px + // opacity: .2 + // transform: rotate(180deg) // Grid .grid { display: flex; flex-wrap: wrap; } .grid.\-middle { align-items: center; } +.grid.\-bottom { align-items: end; } .cell { flex: 1; box-sizing: border-box; } .cell.\-left { text-align: left ;} .cell.\-right { text-align: right; } diff --git a/content/_index.md b/content/_index.md index d7977cc..18ac64d 100644 --- a/content/_index.md +++ b/content/_index.md @@ -3,19 +3,20 @@ title: RésiLien, Hébergeur de services numériques Open Source description: RésiLien est un hébergeur de services numériques localisé en France dont l'infrastructure est décentralisée. --- -## [RésiLien](/) accompagner les organisations qui ont une conscience sociétale vers la réappropriation de leurs outils numériques. +> ## **Accompagner**
les organisations
qui ont une **conscience sociétale**
vers la réappropriation de
leurs **outils numériques**. +{.quote} -RésiLien est un hébergeur de services numériques localisé en France dont l'infrastructure est décentralisée. Nous respectons la charte des [C.H.A.T.O.N.S](https://chatons.org/) et avons déposé notre candidature afin de rejoindre leur collectif. +**RésiLien** est un hébergeur de services numériques localisé en France 🇫🇷 dont l'infrastructure est décentralisée. Nous respectons [la charte](https://www.chatons.org/charte) du [Collectif des Hébergeurs Alternatifs, Transparents, Ouverts, Neutres et Solidaires](https://chatons.org/) et avons déposé notre candidature afin de rejoindre leur collectif. -Reprenez le contrôle sur vos données en utilisant exclusivement des logiciels libres et en les stockant sur du matériel de confiance. +Reprenez le contrôle sur vos données en utilisant exclusivement des **logiciels libres** et en les stockant sur du matériel de confiance. -Engagez vous dans la transition écologique en optant pour une sobriété numérique. +Engagez vous dans la transition écologique 🍃 en optant pour une **sobriété numérique**. Si vous avez une connexion Internet suffisante, hébergez dans votre local votre serveur contenant vos propres données. L'équipe de RésiLien en fera la maintenance à distance. -RésiLien est géré par un collectif d'entreprises de l'Économie Sociale et Solidaire. Aujourd'hui, ce collectif est composé de [Weko](https://weko.io) et de [Libenume](https://libenume.fr). +RésiLien est géré par un **collectif** d'entreprises de l'**Économie Sociale et Solidaire**. Aujourd'hui, ce collectif est composé de **[Weko](https://weko.io)** et de **[Libenume](https://libenume.fr)**. -### Quels services propose RésiLien ? +### Quels services propose RésiLien ? - ![Collaboration sur un document](/icons/writting.svg) #### Prise de notes collaborative @@ -29,16 +30,19 @@ RésiLien est géré par un collectif d'entreprises de l'Économie Sociale et So - ![Éco-conception de site internet](/icons/website.svg) #### Site web statique Avec le logiciel libre Hugo, l'équipe de RésiLien peut concevoir un site web selon votre demande et l'héberger sur son infrastructure. -{ .services } +{ .flex .services } ### Comment bénéficier des services de RésiLien ? Pour tous les services hébergés par RésiLien, ce sera l'entreprise Weko (département de la Loire) ou Libenume (département des Côtes d'Armor) votre interlocutrice principale selon votre proximité géographique. -[Weko](https://weko.io) | [Libenume](https://libenume.fr/) -:--: | :--: -[simon@weko.io](mailto:simon@weko.io) | [contact@libenume.fr](mailto:contact@libenume.fr) -[07 57 18 01 68](tel:0757180168) | [07 64 70 62 94](tel:0764706294) -{ .contacts } +- #### [Weko](https://weko.io) -Ayant à cœur d'avoir une relation de proximité, nous vous conseillons de contacter l'entreprise la plus proche. Celle-ci vous enverra une proposition commerciale en fonction de vos besoins. Chaque prestation inclut une période d'accompagnement pour l'utilisation des services. + [simon@weko.io](mailto:simon@weko.io) + [07 57 18 01 68](tel:0757180168) +- #### [Libenume](https://libenume.fr/) + [contact@libenume.fr](mailto:contact@libenume.fr) + [07 64 70 62 94](tel:0764706294) +{ .flex } + +Ayant à cœur d'avoir une **relation de proximité**, nous vous conseillons de contacter l'entreprise la plus proche. Celle-ci vous enverra une proposition commerciale en fonction de vos besoins. Chaque prestation inclut une **période d'accompagnement pour l'utilisation des services**. diff --git a/content/mentions-legales.md b/content/mentions-legales.md index 9d6fa1a..d165370 100644 --- a/content/mentions-legales.md +++ b/content/mentions-legales.md @@ -3,32 +3,33 @@ title: RésiLien, Mentions légales description: --- -# Mentions légales +## Mentions légales + +### Édition du site web -## Édition du site web Co-édité par Libenume et Weko -Libenume +#### Libenume -Killian Kemps - Libenume -Entrepreneur titulaire d’un contrat CAPE au sein de la Coopérative d’Activités et d’Emploi Avant-Premières. -Siège social : Bâtiment Penthièvre - Novapôle - 2 rue de la Croix Lormel, 22190 Plérin -Site Web : libenume.fr -SIRET : 482 395 464 00035 -Code APE : 7022Z +Killian Kemps - Libenume +Entrepreneur titulaire d’un contrat CAPE au sein de la Coopérative d’Activités et d’Emploi Avant-Premières. +Siège social : Bâtiment Penthièvre - Novapôle - 2 rue de la Croix Lormel, 22190 Plérin +Site Web : libenume.fr +SIRET : 482 395 464 00035 +Code APE : 7022Z TVA Intracommunautaire : FR45 482 395 464 -Weko +#### Weko -Simon Constans - Weko -Entrepreneur titulaire d’un contrat CAPE au sein de la Coopérative d’Activités et d’Emploi Talents Croisés. -Siège social : XXX -Site Web : XXX -SIRET : XXX -Code APE : XXX +Simon Constans - Weko +Entrepreneur titulaire d’un contrat CAPE au sein de la Coopérative d’Activités et d’Emploi Talents Croisés. +Siège social : XXX +Site Web : XXX +SIRET : XXX +Code APE : XXX TVA Intracommunautaire : -## Hébergement +### Hébergement Services et données actives hébergés sur micro-ordinateurs dans les locaux de Weko à Crémeaux (42). Siège social : XXX diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index 6914c8c..d6b94cc 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -1,15 +1,15 @@
-