240 lines
14 KiB
HTML
240 lines
14 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="fr">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
<link rel="stylesheet" href="style/typo.css">
|
|
<link rel="stylesheet" href="style/default.css">
|
|
<link rel="stylesheet" href="style/common.css">
|
|
<link rel="stylesheet" href="style/animation.css">
|
|
<link rel="stylesheet" href="style/main.css">
|
|
|
|
<!--REPONSIVE-->
|
|
<link rel="stylesheet" href="style/responsive.css">
|
|
<!--REDUCED MOTION-->
|
|
<link rel="stylesheet" href="style/reduced.css">
|
|
|
|
<title>Laboratoire Ouvert Lyonnais</title>
|
|
|
|
<!--OPEN GRAPHS-->
|
|
<meta property="og:title" content="Laboratoire Ouvert Lyonnais">
|
|
<meta property="og:description" content="Hackerspace Queer">
|
|
<meta property="og:url" content="https://labolyon.fr/">
|
|
<meta property="og:image" content="assets/logo/logo_picto.svg">
|
|
<meta property="og:type" content="website">
|
|
|
|
|
|
<link rel="icon" type="image/svg" href="assets/favicon.svg">
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<h1>
|
|
<img id="logo" src="assets/logo/logo-forme.svg" alt="Logo du LOL : en jaune sur fond noir, la transcription visuelle des lettre L, O et L en morse, encadré d'un épaisse bordure">
|
|
<span aria-hidden="true" class="cool-name">LOL</span>
|
|
<span class="plain-name">LOL</span>
|
|
</h1>
|
|
|
|
<nav aria-label="outils numériques du LOL">
|
|
<ul>
|
|
<li><a href="https://git.labolyon.fr/explore/repos" class="textBtnStyle" target="_blank">Git</a></li>
|
|
<li><a href="https://wiki.labolyon.fr/" class="textBtnStyle" target="_blank">Wiki</a></li>
|
|
<li><a href="https://matrix.to/#/#lol-space:chat.labolyon.fr" class="textBtnStyle" target="_blank">Matrix</a></li>
|
|
<li><a href="https://nerdculture.de/@labolyon" class="textBtnStyle" target="_blank">Fediverse</a></li>
|
|
</ul>
|
|
</nav>
|
|
</header>
|
|
|
|
<main>
|
|
<div id="homeContent">
|
|
|
|
<section id="titleSection" class="solidBox">
|
|
<h2>
|
|
Hackerspace
|
|
</h2>
|
|
<p>
|
|
<br>
|
|
Lieu autogéré <br>
|
|
de réappropriation, <br>
|
|
réparation & recyclage <br>
|
|
des objets techniques <br>
|
|
& technologiques
|
|
</p>
|
|
</section>
|
|
|
|
<section id="hourSection" class="solidBox">
|
|
<h3>Horaires d'ouverture</h3>
|
|
<ol>
|
|
<li>
|
|
Mar. <strong>17h → 23h</strong>
|
|
</li>
|
|
<li>
|
|
Sam. <strong>14h → 20h</strong>
|
|
</li>
|
|
</ol>
|
|
<!-- pour plus tard
|
|
<h3>Nocturne</h3>
|
|
<ol>
|
|
<li>Ven. <strong>21h → 5h</strong></li>
|
|
</ol>
|
|
-->
|
|
</section>
|
|
|
|
<div class="access-info-box transparentBox">
|
|
<address aria-label="Adresse du lieu">
|
|
7 place Chazette<br>
|
|
69001 Lyon<br>
|
|
<br>
|
|
45° 46' 23.698" N<br>
|
|
4° 50' 14.052" E
|
|
</address>
|
|
|
|
<ul aria-label="Téléphones du lieu">
|
|
<li> 🖷 Fax : <a href="tel:+33482533028">04 82 53 30 28</a></li>
|
|
<li> ✆ Tel EPVPN : <a href="tel:5256">5256</a></li>
|
|
<li> 🖷 Fax EPVPN : <a href="tel:5257">5257</a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
|
|
<div id="planSection" class="transparentBox" aria-label="Plan d'accès du local">
|
|
<div id="planContainer" class="transparentBox">
|
|
<img src="assets/plan.svg" id="plan" alt="Sonnez à l'interphone Laboratoire Ouvert Lyonnais au 7 Place Chazette 69001, puis avancez tout droit, traversez la cour, et avancez encore, la porte se situe après l'ascenceur, sur la droite">
|
|
<svg aria-hidden="true" id="fleche" viewBox="0 0 4215.93 2604.36">
|
|
<g>
|
|
<path d="M118.58,2250.24l88.9,7.6,20.81,53.59,2035.49-1175.29,534.6-308.72c47.83-27.62,106.77-27.57,154.55.13l610.19,353.56-36.27,19.61,202.14,8.94-20.79-113.99-36.27,21.29-691.73-397.83c-65.1-37.42-145.2-37.35-210.23.2L118.58,2250.24Z"/>
|
|
<g>
|
|
<path d="M3957.03,1272.8c-8.27,4.78-8.28,12.52,0,17.3,8.27,4.78,21.69,4.78,29.96,0,8.27-4.78,8.27-12.52,0-17.3-8.27-4.78-21.69-4.78-29.96,0Z"/>
|
|
<path d="M3886.4,1232.02c8.27-4.78,8.27-12.52,0-17.3-8.27-4.78-21.69-4.78-29.96,0-8.27,4.78-8.28,12.52,0,17.3,8.27,4.78,21.69,4.78,29.96,0Z"/>
|
|
<path d="M3836.35,1260.92c8.27-4.78,8.27-12.52,0-17.3-8.27-4.78-21.69-4.78-29.96,0-8.27,4.78-8.27,12.52,0,17.3,8.27,4.78,21.69,4.78,29.96,0Z"/>
|
|
<path d="M3878.4,1294.69c1.54-.89,1.54-2.33,0-3.22l-24.39-14.08c-1.54-.89-4.04-.89-5.58,0l-54.35,31.38c-1.54.89-1.54,2.33,0,3.22l24.39,14.08c1.54.89,4.04.89,5.58,0l54.35-31.38Z"/>
|
|
<path d="M3906.98,1301.7c-8.27,4.78-8.27,12.52,0,17.3,8.27,4.78,21.69,4.78,29.96,0,8.27-4.78,8.27-12.52,0-17.3-8.27-4.78-21.69-4.78-29.96,0Z"/>
|
|
<path d="M3873.65,1320.95l-54.35,31.38c-1.54.89-1.54,2.33,0,3.22l24.39,14.08c1.54.89,4.04.89,5.58,0l54.35-31.38c1.54-.89,1.54-2.33,0-3.22l-24.39-14.08c-1.54-.89-4.04-.89-5.58,0Z"/>
|
|
<path d="M3948.69,1254.1c1.54-.89,1.54-2.33,0-3.22l-24.39-14.08c-1.54-.89-4.04-.89-5.58,0l-54.35,31.38c-1.54.89-1.54,2.33,0,3.22l24.39,14.08c1.54.89,4.04.89,5.58,0l54.35-31.38Z"/>
|
|
<path d="M3575.35,1320.96l227.65,131.45,294.35-169.96-227.65-131.45-294.35,169.96ZM4074.57,1282.45l-271.56,156.8-204.87-118.29,271.56-156.8,204.87,118.29Z"/>
|
|
<path d="M3748.68,1311.55l54.35-31.38c1.54-.89,1.54-2.33,0-3.22l-24.39-14.08c-1.54-.89-4.04-.89-5.58,0l-54.35,31.38c-1.54.89-1.54,2.33,0,3.22l24.39,14.08c1.54.89,4.04.89,5.58,0Z"/>
|
|
<path d="M3816.27,1388.68c8.27-4.78,8.27-12.52,0-17.3-8.27-4.78-21.69-4.78-29.96,0-8.27,4.78-8.27,12.52,0,17.3,8.27,4.78,21.69,4.78,29.96,0Z"/>
|
|
<path d="M3753.75,1366.66l54.35-31.38c1.54-.89,1.54-2.33,0-3.22l-24.39-14.08c-1.54-.89-4.04-.89-5.58,0l-54.35,31.38c-1.54.89-1.54,2.33,0,3.22l24.39,14.08c1.54.89,4.04.89,5.58,0Z"/>
|
|
<path d="M3715.68,1330.6c8.27-4.78,8.27-12.52,0-17.3-8.27-4.78-21.69-4.78-29.96,0-8.27,4.78-8.27,12.52,0,17.3,8.27,4.78,21.69,4.78,29.96,0Z"/>
|
|
</g>
|
|
</g>
|
|
<rect class="cls-1" x=".05" y=".05" width="4215.83" height="2604.26" rx="133.4" ry="133.4" fill="none"/>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="extLinkSection" class="transparentBox" aria-label="Liens externes">
|
|
<a href="https://www.hackerspaces.org/" id="hackerLogo" target="_blank" aria-label="hackerspace.org est un site qui recense les hackerspaces en Europe">
|
|
<img src="assets/logo_hackerspaces_monde.png" aria-hidden="true" alt="">
|
|
</a>
|
|
</div>
|
|
|
|
<!-- MESSAGE DE BIENVENUE -->
|
|
<aside>
|
|
<button type="button" popovertarget="msgWindow" popoveraction="show" class="iconBtnStyle" id="openMsg" aria-label="ouvrir le message de bienvenue">
|
|
<svg class="icon" viewBox="0 0 40.19 38.9" aria-hidden="true">
|
|
<path d="M33.56,0H0v38.9h40.19V0h-6.62ZM34.91,33.62H5.28V8.09l15.05,19.04,14.58-18.56v25.05ZM11.12,5.28h18.39l-9.25,12.02L11.12,5.28Z"/>
|
|
</svg>
|
|
</button>
|
|
|
|
<div id="msgWindow" popover="auto">
|
|
<dialog class="floatingWindow" aria-label="Message de bienvenue du LOL">
|
|
<h4 class="title">
|
|
Bienvenue sur le site du LOL!
|
|
<button class="iconBtnStyle" popovertarget="msgWindow" popoveraction="hide" aria-label="Fermer la fenêtre">
|
|
<svg viewBox="0 0 53.73 53.59" class="icon" aria-hidden="true">
|
|
<path d="M26.87,40.16l-13.43,13.43L0,40.16l13.43-13.43L.29,13.43,13.72,0l13.15,13.29L40.01.14l13.43,13.43-13,13.15,13.29,13.29-13.43,13.43-13.43-13.29Z"/>
|
|
</svg>
|
|
</button>
|
|
</h4>
|
|
|
|
<p>
|
|
hellooo, <br>
|
|
bienvenue sur le site du LOL ^^<br><br>
|
|
en ce moment on cherche du monde pour nous aider à faire fonctionner le lieu, le faire évoluer et le péreniser.<br><br>
|
|
si jamais ça t'intéresse<br><strong>contacte nous sur Matrix, <br>
|
|
ou passe nous voir au local </strong>directement, quand il est ouvert !<br>
|
|
</p>
|
|
</dialog>
|
|
</div>
|
|
</aside>
|
|
</div>
|
|
<section id="statuSection" class="solidBox">
|
|
<div id="statusDesc">
|
|
<h3>
|
|
Le LOL peut ouvrir en dehors des horaires habituels.
|
|
En fonction de nos envies et disponibilités.
|
|
</h3>
|
|
<p>
|
|
<small>Un capteur sur la porte d'entrée indique si le local est ouvert:</small>
|
|
</p>
|
|
</div>
|
|
<a href="status" target="_blank" class="textBtnStyle">Vérifier <br>si c'est<br> ouvert <br>→ → →</a>
|
|
</section>
|
|
<aside id="extraContent">
|
|
<div id="aboutSection" class="solidBox" aria-label="Description de l'asso, de ses objectifs et valeurs">
|
|
<p>
|
|
Le Laboratoire Ouvert Lyonnais (LOL) est un lieu de rassemblement et d'expérimentations pour tous·tes les passionné·es d'informatique, d'électronique et de technique,
|
|
qui souhaitent réparer, recycler, et se réapproprier les objets et outils qui nous entourent.<br>
|
|
Le LOL est un lieu d'exploration des alternatives<br>et de bidouille anti-systèmes.
|
|
<br><br>
|
|
Au LOL, nous expérimentons et créons autours du détournement, de la réutilisations d'objets en tout genre.
|
|
Nous constituons une communautée ouverte où chacun·e peut apprendre et partager avec les autres pour créer ensemble et comprendre les outils, les objets, les techniques etc.
|
|
Le lieu est autogéré, défini par ses utilisateur·ices et en fonctions de ses besoins : peu importe sur quoi tu travailles, il y'a une place pour toi !
|
|
<br><br>
|
|
Nous revendiquons l'ouverture du code et des techniques,<br>
|
|
le partage des connaissances et l'autogestion,<br>
|
|
l'anti-capitalisme et l'anti-fascisme. <br><br>
|
|
Nous condamnons donc toute forme de violence<br>et de discrimination dans nos locaux.<br>
|
|
Tout comportement assimilé pourra, sur décision collective,<br>vous mener à la sortie.
|
|
</p>
|
|
|
|
<dl>
|
|
<dt>Hackerspace</dt>
|
|
<dd>
|
|
n.m. : Tiers lieu de réunion et de rencontre entre personnes désirant comprendre, créer ou détourner des objets techniques ou technologiques.
|
|
</dd>
|
|
|
|
<dt>Hackeuse, Hacker</dt>
|
|
<dd>
|
|
n. : Personne ayant un intérêt dans la technique ou la technologie et faisant un usage creatif et/ou utile de celle-ci par le détournement.
|
|
</dd>
|
|
</dt>
|
|
</dl>
|
|
</div>
|
|
|
|
<section id="eventSection" class="transparentBox">
|
|
<h3>Événements <small>à venir</small></h3>
|
|
<article class="solidBox">
|
|
<h4>Permanences du LOL</h4>
|
|
<p class="date">↻ Mardi & Samedi</p>
|
|
<a href="/affiches/mardis/" class="iconBtnStyle" target="_blank" aria-label="Plus d'infos sur cet évènement">
|
|
<svg viewBox="0 0 53.73 53.59" class="icon" aria-hidden="true">
|
|
<path d="M26.87,40.16l-13.43,13.43L0,40.16l13.43-13.43L.29,13.43,13.72,0l13.15,13.29L40.01.14l13.43,13.43-13,13.15,13.29,13.29-13.43,13.43-13.43-13.29Z"/>
|
|
</svg>
|
|
</a>
|
|
</article>
|
|
</section>
|
|
</aside>
|
|
<footer id="webRingSection" aria-label="les copaines du LOL">
|
|
<a href="https://berthe.cc" target="_blank" aria-label="berthe.cc">
|
|
<img src="/assets/webRings/berthe.cc.png" alt="une créature étrange verte et rouge avec 4 grands yeux et un inscription blanche : berthe.cc">
|
|
</a>
|
|
<a href="https://murmure.cafe" target="_blank" aria-label="murmure.café, collectif de réappropriation du web et des réseaux">
|
|
<img src="/assets/webRings/murmure-cafe-webring.png" alt="une une tasse de café pixélisées en couleurs pastel avec des chevrons, quelques gouttes de café renversées et une écriture noire : murmure.café">
|
|
</a>
|
|
<a href="https://drags-nerds.net" target="_blank" aria-label="drags and nerds, collectif d'organisation d'évènements queer et nerds inclusifs">
|
|
<img class="needOutline" src="/assets/webRings/DNNwebring.gif" alt="les mots drags, and et nerds qui défilent dans tous les sens sur un fond rose et vert fluo qui clignote">
|
|
</a>
|
|
</footer>
|
|
<noscript>
|
|
<video src="/assets/video/closed.webm" class="closedBackground" autoplay muted loop aria-hidden="true"></video>
|
|
</noscript>
|
|
<video data-cute-texture-video class="cute-texture-video" src="/assets/video/background.webm" autoplay muted loop aria-hidden="true"></video>
|
|
<canvas class="cute-texture" aria-hidden="true"></canvas>
|
|
</main>
|
|
<!-- SCRIPT PRINCIPAL -->
|
|
<script type="module" src="js/main.js"></script>
|
|
</body>
|
|
</html>
|