forked from ti-nuage/site
Redisposition des menus et du pied de page (fix #3).
This commit is contained in:
David Soulayrol
@@ -10,6 +10,7 @@ body {
|
||||
}
|
||||
|
||||
.Container {
|
||||
clear: both;
|
||||
max-width: 960px;
|
||||
margin: 0 auto;
|
||||
padding: 0 32px;
|
||||
@@ -19,6 +20,13 @@ a {
|
||||
color: #373d3f;
|
||||
}
|
||||
|
||||
a.external::after {
|
||||
content: url(/images/external-link.svg);
|
||||
display: inline-flex;
|
||||
height: 1em;
|
||||
padding-left: 0.4em;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
@@ -126,58 +134,44 @@ abbr {
|
||||
|
||||
.logo-front {
|
||||
display: block;
|
||||
margin: 10em auto 0;
|
||||
height: 25vh;
|
||||
margin: 3em auto 2em;
|
||||
}
|
||||
|
||||
.logo-small {
|
||||
width: 3em;
|
||||
display: inline-block;
|
||||
margin: 0.4em;
|
||||
}
|
||||
|
||||
menu {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
.container-logo,
|
||||
.menu-item {
|
||||
height: 30%;
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
display: inline;
|
||||
margin: 0 2em 0 0;
|
||||
height: 3em;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
float: right;
|
||||
margin-left: 2em;
|
||||
nav {
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.menu-button {
|
||||
padding: 8px 24px;
|
||||
background: #05b;
|
||||
color: #fff;
|
||||
text-transform: uppercase;
|
||||
text-decoration: none;
|
||||
font-size: 12.8px;
|
||||
font-weight: bold;
|
||||
border-radius: 0 0 24px 24px;
|
||||
line-height: 24px;
|
||||
display: inline-block;
|
||||
nav section {
|
||||
display: grid;
|
||||
grid-template-columns: 2fr 3fr;
|
||||
}
|
||||
|
||||
.menu-button-login {
|
||||
background: #2eae2e;
|
||||
nav section h2 {
|
||||
font-size: 1em;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.Hero {
|
||||
height: calc(75vh - 6em);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
nav section ul {
|
||||
border-left: black 1px solid;
|
||||
margin: 0;
|
||||
padding-left: 0.8em;
|
||||
}
|
||||
|
||||
nav section ul li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.Hero h1 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
.services-title {
|
||||
@@ -251,6 +245,13 @@ menu {
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
.three-cols {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
grid-template-rows: 1fr 1fr;
|
||||
gap: 1em 0;
|
||||
}
|
||||
|
||||
.Two-cols-One-row,
|
||||
.Two-cols-Two-rows {
|
||||
display: grid;
|
||||
@@ -259,23 +260,18 @@ menu {
|
||||
gap: 64px 0;
|
||||
}
|
||||
|
||||
.Article-Title {
|
||||
margin-top: 64px;
|
||||
margin-bottom: 32px;
|
||||
.footer h2 {
|
||||
font-size: 1.2em;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.footer {
|
||||
.footer hr + p {
|
||||
font-size: 0.8em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
|
||||
.footer ul,
|
||||
.footer li {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.footer .Two-cols-One-row {
|
||||
grid-row-gap: 0;
|
||||
.footer p + p {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 768px) {
|
||||
@@ -283,10 +279,49 @@ menu {
|
||||
font-size: 48.33px;
|
||||
}
|
||||
|
||||
nav section {
|
||||
border-left: black 1px solid;
|
||||
display: block;
|
||||
padding-left: 2em;
|
||||
}
|
||||
|
||||
nav section h2 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
nav section ul {
|
||||
border: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.Hero {
|
||||
height: calc(75vh - 16em);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.Hero h1 {
|
||||
font-size: 48.33px;
|
||||
}
|
||||
|
||||
.logo-chatons {
|
||||
height: 12vw;
|
||||
}
|
||||
|
||||
.logo-front {
|
||||
margin: 10em auto 0;
|
||||
height: 25vh;
|
||||
}
|
||||
|
||||
.three-cols {
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
grid-template-rows: 1fr;
|
||||
grid-column-gap: 64px;
|
||||
grid-row-gap: 0;
|
||||
}
|
||||
|
||||
.Two-cols-One-row {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
grid-template-rows: 1fr;
|
||||
|
||||
1
assets/production/images/external-link.svg
Normal file
1
assets/production/images/external-link.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg width="24px" height="24px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-external-link"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/><polyline points="15 3 21 3 21 9"/><line x1="10" y1="14" x2="21" y2="3"/></svg>
|
||||
|
After Width: | Height: | Size: 370 B |
@@ -9,7 +9,7 @@ title: Mentions légales
|
||||
<br>SIREN : `904 949 534 00013`
|
||||
<br>Siège social : `Mairie, 11 places aux Chevaux, 22420 Le Vieux Marché - France`
|
||||
|
||||
## Hébergement
|
||||
## Hébergement des données
|
||||
|
||||
Ce site et toutes les données de l'association sont actuellement stockées chez la Sas OVH.
|
||||
<br>Siège social : `2 rue Kellermann, 59100 Roubaix - France`
|
||||
@@ -20,4 +20,10 @@ Ce site est conçu avec le logiciel libre [Metalsmith](https://www.metalsmith.io
|
||||
|
||||
Sauf mention contraire sur les supports utilisés, tout le contenu affiché sur le site [ti-nuage.fr](/) appartient à l'association **Ti Nuage** et est distribuable sous licence [CC-BY-SA version 2.0 ou ultérieure](https://creativecommons.org/licenses/by-sa/2.0/fr).
|
||||
|
||||
Les icones utilisés pour la description des services sont réalisés avec **Uicons** de [Flaticon](https://www.flaticon.com/uicons).
|
||||
Les icones utilisés pour la description des services sont réalisés avec **Uicons** de [Flaticon](https://www.flaticon.com/uicons). L'icône utilisée pour marquer les liens externes fait partie du jeu d'icône [Feather](https://feathericons.com) et est distribué sous les termes de [la licence MIT](https://mit-license.org).
|
||||
|
||||
## Nous contacter
|
||||
|
||||
L'adresse électronique de contact de l'association est : contact @ ti-nuage.fr. Le courrier doit être adressé au siège social.
|
||||
|
||||
Il est possible de nous rencontrer tous les premiers jeudi du mois à partir de 20 heures à [la Hutte](https://lahutte.ti-nuage.fr/), l'espace de travail partagé à Vieux Marché.
|
||||
|
||||
@@ -30,59 +30,44 @@
|
||||
{% endif %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="Container">
|
||||
<menu>
|
||||
<li class="container-logo">
|
||||
{% if not hidemenuicon %}
|
||||
<a href="/"><img class="logo-small" src="/images/logo.svg" alt=""></a>
|
||||
{% endif %}
|
||||
</li>
|
||||
<li class="menu-item">
|
||||
<a class="menu-button menu-button-login" href="https://mon.ti-nuage.fr">Espace adhérents</a>
|
||||
</li>
|
||||
<li class="menu-item">
|
||||
<a class="menu-button" href="https://status.ti-nuage.fr/">État des services</a>
|
||||
</li>
|
||||
<li class="menu-item">
|
||||
<a class="menu-button" href="https://wiki.ti-nuage.fr/">Documentation</a>
|
||||
</li>
|
||||
<li class="menu-item">
|
||||
<a class="menu-button" href="/blog">Actualités</a>
|
||||
</li>
|
||||
</menu>
|
||||
<nav class="Container three-cols">
|
||||
<section>
|
||||
<h2>Association</h2>
|
||||
<ul>
|
||||
<li><a href="/association.html">Découvrir l'association</a></li>
|
||||
<li><a href="/blog">Actualités</a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<section>
|
||||
<h2>Documentation</h2>
|
||||
<ul>
|
||||
<li><a class="external" href="https://wiki.ti-nuage.fr">Wiki</a></li>
|
||||
</ul>
|
||||
</section>
|
||||
<section>
|
||||
<h2>Services</h2>
|
||||
<ul>
|
||||
<li><a class="external" href="https://mon.ti-nuage.fr">Espace adhérents</a></li>
|
||||
<li><a href="/services.html">Tous les services</a></li>
|
||||
<li><a class="external" href="https://status.ti-nuage.fr/">Suivi des incidents</a></li>
|
||||
</ul>
|
||||
</section>
|
||||
</nav>
|
||||
|
||||
{% block article %}{% endblock %}
|
||||
</div>
|
||||
<section class="Container">
|
||||
{% block article %}{% endblock %}
|
||||
</section>
|
||||
|
||||
<footer class="footer mt128">
|
||||
<div class="Container">
|
||||
<p class="tad">Page générée le {{ moment(article.date).format('LL') }}.</p>
|
||||
<hr>
|
||||
<div class="Two-cols-One-row">
|
||||
<div>
|
||||
<h4>Ti Nuage</h4>
|
||||
<ul>
|
||||
<li><a href="/">Accueil</a></li>
|
||||
<li><a href="/association.html">L'association</a></li>
|
||||
<li><a href="/blog">Le blog</a></li>
|
||||
<li><a href="/services.html">Les services</a></li>
|
||||
<li><a href="/cgu.html">CGU</a></li>
|
||||
<li><a href="/mentions_legales.html">Mentions légales</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h4>Nous contacter</h4>
|
||||
<h5>Adresse</h5>
|
||||
<p>
|
||||
Mairie - Le Vieux-Marché<br>
|
||||
11 place aux Chevaux<br>
|
||||
22420 Le Vieux Marché
|
||||
</p>
|
||||
<h5>Email</h5>
|
||||
<p>contact @ ti-nuage.fr</p>
|
||||
<br>
|
||||
</div>
|
||||
</div>
|
||||
<p class="tac">
|
||||
<a href="/"><img class="logo-small" src="/images/logo.svg" alt=""></a>
|
||||
<b><a href="/cgu.html">Conditions Générales d'Utilisation</b></a>
|
||||
—
|
||||
<b><a href="/mentions_legales.html">Mentions légales et contact</a></b>
|
||||
</p>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user