feat: Mise à jour du design
This commit is contained in:
parent
337571376a
commit
e13339fec0
|
@ -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
|
|
@ -1,23 +1,34 @@
|
||||||
$size-small: 400px
|
$size-small: 500px
|
||||||
|
|
||||||
|
@import "font"
|
||||||
|
|
||||||
body
|
body
|
||||||
color: #2d3824
|
--color-background: #fff8eb
|
||||||
background: #fff8eb
|
--color-paragraph: #2d3824
|
||||||
font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"
|
--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
|
margin: 0 auto
|
||||||
padding: 0 1rem
|
padding: 0 var(--tile)
|
||||||
max-width: 800px
|
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)
|
@media screen and (max-width: $size-small)
|
||||||
font-size: 1rem
|
--border-size: 2px
|
||||||
|
--tile: 1rem
|
||||||
|
|
||||||
hr
|
hr
|
||||||
background: repeating-linear-gradient(90deg, transparent, transparent 9px, black 10px)
|
|
||||||
height: 12px
|
|
||||||
margin: 2em auto
|
|
||||||
position: relative
|
|
||||||
border: 0
|
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
|
ul.no-style
|
||||||
margin: 0
|
margin: 0
|
||||||
|
@ -25,41 +36,90 @@ ul.no-style
|
||||||
list-style-type: none
|
list-style-type: none
|
||||||
|
|
||||||
a, h1, h2, h3
|
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
|
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
|
.footer
|
||||||
font-size: 0.8rem
|
font-size: 0.8rem
|
||||||
|
|
||||||
.services
|
@media screen and (max-width: $size-small)
|
||||||
margin: 0
|
.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
|
padding: 0
|
||||||
list-style-type: none
|
list-style-type: none
|
||||||
$tile: 1rem
|
width: calc(100% + 2 * var(--margin-tile))
|
||||||
width: calc(100% + 2*$tile)
|
|
||||||
margin-left: -$tile
|
|
||||||
display: flex
|
display: flex
|
||||||
flex-wrap: wrap
|
flex-wrap: wrap
|
||||||
li
|
li
|
||||||
text-align: center
|
text-align: center
|
||||||
padding: $tile
|
padding: var(--margin-tile)
|
||||||
flex: 0 0 calc(100% * 6 / 12)
|
flex: 0 0 50%
|
||||||
box-sizing: border-box
|
box-sizing: border-box
|
||||||
|
|
||||||
img
|
img
|
||||||
max-width: 100%
|
max-width: 100%
|
||||||
width: 40%
|
width: 40%
|
||||||
|
|
||||||
.contacts
|
@media screen and (max-width: $size-small)
|
||||||
width: 100%
|
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
|
||||||
|
|
||||||
.grid { display: flex; flex-wrap: wrap; }
|
.grid { display: flex; flex-wrap: wrap; }
|
||||||
.grid.\-middle { align-items: center; }
|
.grid.\-middle { align-items: center; }
|
||||||
|
.grid.\-bottom { align-items: end; }
|
||||||
.cell { flex: 1; box-sizing: border-box; }
|
.cell { flex: 1; box-sizing: border-box; }
|
||||||
.cell.\-left { text-align: left ;}
|
.cell.\-left { text-align: left ;}
|
||||||
.cell.\-right { text-align: right; }
|
.cell.\-right { text-align: right; }
|
||||||
|
|
|
@ -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.
|
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** <br>les organisations <br>qui ont une **conscience sociétale** <br>vers la réappropriation de<br>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.
|
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 ?
|
||||||
|
|
||||||
- 
|
- 
|
||||||
#### Prise de notes collaborative
|
#### Prise de notes collaborative
|
||||||
|
@ -29,16 +30,19 @@ RésiLien est géré par un collectif d'entreprises de l'Économie Sociale et So
|
||||||
- 
|
- 
|
||||||
#### Site web statique
|
#### 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.
|
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 ?
|
### 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.
|
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/)
|
- #### [Weko](https://weko.io)
|
||||||
:--: | :--:
|
|
||||||
[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 }
|
|
||||||
|
|
||||||
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**.
|
||||||
|
|
|
@ -3,32 +3,33 @@ title: RésiLien, Mentions légales
|
||||||
description:
|
description:
|
||||||
---
|
---
|
||||||
|
|
||||||
# Mentions légales
|
## Mentions légales
|
||||||
|
|
||||||
|
### Édition du site web
|
||||||
|
|
||||||
## Édition du site web
|
|
||||||
Co-édité par Libenume et Weko
|
Co-édité par Libenume et Weko
|
||||||
|
|
||||||
Libenume
|
#### Libenume
|
||||||
|
|
||||||
Killian Kemps - 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.
|
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
|
Siège social : Bâtiment Penthièvre - Novapôle - 2 rue de la Croix Lormel, 22190 Plérin
|
||||||
Site Web : libenume.fr
|
Site Web : libenume.fr
|
||||||
SIRET : 482 395 464 00035
|
SIRET : 482 395 464 00035
|
||||||
Code APE : 7022Z
|
Code APE : 7022Z
|
||||||
TVA Intracommunautaire : FR45 482 395 464
|
TVA Intracommunautaire : FR45 482 395 464
|
||||||
|
|
||||||
Weko
|
#### Weko
|
||||||
|
|
||||||
Simon Constans - 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.
|
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
|
Siège social : XXX
|
||||||
Site Web : XXX
|
Site Web : XXX
|
||||||
SIRET : XXX
|
SIRET : XXX
|
||||||
Code APE : XXX
|
Code APE : XXX
|
||||||
TVA Intracommunautaire :
|
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).
|
Services et données actives hébergés sur micro-ordinateurs dans les locaux de Weko à Crémeaux (42).
|
||||||
Siège social : XXX
|
Siège social : XXX
|
||||||
|
|
|
@ -1,15 +1,15 @@
|
||||||
<hr>
|
<hr>
|
||||||
<footer class="footer grid">
|
<footer class="footer grid -bottom">
|
||||||
<div class="cell">
|
<div class="cell">
|
||||||
<p>Alimenté par <a href="https://www.enercoop.fr/">Enercoop</a> ⚡</p>
|
<p>Alimenté par <a href="https://www.enercoop.fr/">Enercoop</a> ⚡</p>
|
||||||
<p>Ce site est réalisé de façon éco-responsable,<br>il émet seulement 0.45g de CO<sub>2</sub> à chaque visite.</p>
|
<p>Ce site est réalisé de façon éco-responsable,<br>il émet seulement 0.45g de CO<sub>2</sub> à chaque visite.</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="cell -center">
|
<div class="cell -right">
|
||||||
<p>
|
<p>
|
||||||
<ul class="no-style">
|
<ul class="no-style">
|
||||||
<li><a href="/mentions-legales/">Mentions légales</a></li>
|
<li><a href="/politique/">Politique de protection des données</a></li>
|
||||||
<li><a href="/mentions-legales/">Infrastructure</a></li>
|
<li><a href="/mentions-legales/">Mentions légales</a> - <a href="/cgv/">CGV</a> - <a href="/cgu/">CGU</a></li>
|
||||||
<li><a href="/mentions-legales/">CGV</a></li>
|
<li><a href="/infrastructure/">Infrastructure</a> - <a href="/sous-traitance">Sous-traitance</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -3,8 +3,7 @@
|
||||||
<nav class="menu cell -right">
|
<nav class="menu cell -right">
|
||||||
<ul class="no-style">
|
<ul class="no-style">
|
||||||
<li><a href="#comment-bénéficier-des-services-de-résilien-">Contact</a></li>
|
<li><a href="#comment-bénéficier-des-services-de-résilien-">Contact</a></li>
|
||||||
<li><a href="#quels-services-propose-résilien-">Services</a></li>
|
<li><a href="#quels-services-propose-résilien">Services</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
</header>
|
</header>
|
||||||
<hr>
|
|
||||||
|
|
Loading…
Reference in New Issue