design/lab/top-nav.html

163 lines
4.6 KiB
HTML
Raw Normal View History

2021-10-17 14:37:04 +00:00
<!DOCTYPE html>
2021-10-23 21:22:39 +00:00
<html lang="fr">
2021-10-17 14:37:04 +00:00
<head>
<meta charset="utf-8" />
2021-10-23 21:22:39 +00:00
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
2021-10-17 14:37:04 +00:00
<title>Deuxfleurs</title>
<link rel="stylesheet" href="assets/css/normalize.css">
2021-10-23 21:22:39 +00:00
<!-- <link rel="stylesheet" href="assets/css/chota.css"> -->
<link rel="stylesheet" href="assets/css/top-nav.css">
2021-10-17 14:37:04 +00:00
</head>
<body>
2021-10-23 21:22:39 +00:00
<nav class="nav">
<div class="nav-left">
<h1>
<a class="home" href="#">Deuxfleurs</a>
</h1>
</div>
<div class="nav-right">
<ul>
<li>
<a href="#">Documentation</a>
</li>
<li>
<a href="#">Blog</a>
</li>
<li>
<a href="#">Mon compte</a>
</li>
</ul>
</div>
</nav>
2021-10-17 16:36:38 +00:00
2021-10-23 21:22:39 +00:00
<header>
2021-10-17 16:36:38 +00:00
<p>
Nous sommes un hébergeur associatif expérimental.<br>
2021-10-17 17:39:07 +00:00
Avec nos machines et nos logiciels, <br>
nous créons un numérique plus sobre et humain.<br>
2021-10-17 16:36:38 +00:00
<em>Sortez des sentiers battus avec nous !</em>
</p>
</header>
<main class="container">
2021-10-17 16:36:38 +00:00
<section>
<h2>Nos services</h2>
<p>
Aujourd'hui, les grandes plateformes numériques ont pour objectif de maximiser le temps que nous passons dessus, de collecter et recouper des données à notre insu pour nous influencer, de limiter nos possibilités d'expression au-delà du cadre légal et de créer de nouveaux monopoles. Ces effets nous montrent que la technologie n'est pas neutre et a un réel impact sur nos vies.<br><br>
En choisissant et en hébergeant nos propres services, sans but lucratif ni hégémonique, nous espérons nous affranchir de ces nuisances et préserver nos libertés.<br><br>
Nous proposons actuellement :
</p>
<figure></figure>
</section>
<section>
<h2>Nos infrastructures</h2>
<p>
Nous hébergeons nous-même notre infrastructure matérielle.<br>
On aime bien le ronronnement des ventilateurs d'ancienne génération.<br>
Et ça réchauffe nos soirées d'hiver.
</p>
<figure></figure>
</section>
<section>
<h2>Nous rejoindre</h2>
<p>
Nous pensons qu'une personne souhaitant rejoindre un hébergeur indépendant a besoin d'un accompagnement. D'abord parce que nos logiciels sont inhabituels et différents, ensuite parce que nous souhaitons garder le dialogue et si possible vous donner la possibilité de prendre part à nos choix. C'est pourquoi les inscriptions se font par cooptation.
</p>
<div id="niveaux" class="row">
<section class="col">
2021-10-17 16:36:38 +00:00
<h3>Ami⋅e</h3>
<p>
En tant qu'<em>ami⋅e</em> de l'association, vous avez toute notre affection !<br>
Et aussi accès à nos salons de discussion, pour qu'on puisse vous exprimer notre amour. Quand même.
</p>
</section>
<section class="col">
2021-10-17 16:36:38 +00:00
<h3>Membre</h3>
<p>
En tant que <em>membre</em>, vous participez à la vie de l'association, et bénéficiez de tous nos services !
</p>
</section>
<section class="col">
2021-10-17 16:36:38 +00:00
<h3>Hébergeur⋅euse</h3>
<p>
Les <em>hébergeur⋅euses</em> mettent des ordinateurs à disposition de l'association.<br>
<q>De grands pouvoirs impliquent de grandes reponsabilités !</q>
</p>
</section>
</div>
<div id="trombinoscope" class="row">
<figure class="col-6 col-3-md">
2021-10-23 21:22:39 +00:00
<!-- <img src=""> -->
2021-10-17 16:36:38 +00:00
<figcaption>
<h4>Esther</h4>
Magicienne des images
</figcaption>
</figure>
<figure class="col-6 col-3-md">
2021-10-23 21:22:39 +00:00
<!-- <img src=""> -->
2021-10-17 16:36:38 +00:00
<figcaption>
<h4>Quentin</h4>
Bidouilleur d'ordinateurs
</figcaption>
</figure>
<figure class="col-6 col-3-md">
2021-10-23 21:22:39 +00:00
<!-- <img src=""> -->
2021-10-17 16:36:38 +00:00
<figcaption>
<h4>Adrien</h4>
Généraliste
</figcaption>
</figure>
<figure class="col-6 col-3-md">
2021-10-23 21:22:39 +00:00
<!-- <img src=""> -->
2021-10-17 16:36:38 +00:00
<figcaption>
<h4>Maximilien</h4>
Ordinateurologue
</figcaption>
</figure>
<figure class="col-6 col-3-md">
2021-10-23 21:22:39 +00:00
<!-- <img src=""> -->
2021-10-17 16:36:38 +00:00
<figcaption>
<h4>Alex</h4>
Bâtisseur d'empires
</figcaption>
</figure>
</div>
</section>
2021-10-23 21:22:39 +00:00
</main>
2021-10-17 16:36:38 +00:00
<footer>
<p>Brodé avec amour par Deuxfleurs.</p>
<p class="is-right">Il y a sans doute un copyright.</p>
2021-10-17 16:36:38 +00:00
</footer>
2021-10-17 14:37:04 +00:00
</body>
</html>