110 lines
7.3 KiB
HTML
110 lines
7.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="fr" data-theme="dark">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Drags and Nerds — OFF</title>
|
|
<link rel="icon" type="image/x-icon" href="assets/favicon.jpg">
|
|
<!--OPENGRAPH-->
|
|
<meta property="og:title" content="Drags and Nerds">
|
|
<meta property="og:description" content="Drag shows, musique électronique, synthés vidéos et autre performances nerds">
|
|
<meta property="og:url" content="https://drags-nerds.net/">
|
|
<meta property="og:image" content="https://drags-nerds.net/assets/favicon.jpg">
|
|
<meta property="og:type" content="website">
|
|
<!--STYLE-->
|
|
<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">
|
|
<link rel="stylesheet" href="style/responsive.css">
|
|
|
|
<link rel="stylesheet" href="style/reduced.css">
|
|
</head>
|
|
<body>
|
|
<main>
|
|
<section id="seeYouLater" class="floating">
|
|
<h1>
|
|
Merci à touxes !
|
|
</h1>
|
|
<div>
|
|
<p>
|
|
Drags and Nerds c'est fini...<br><strong>pour l'instant !</strong>
|
|
<br><br>
|
|
On revient bientôt avec toujours plus de drags et de nerds !
|
|
<br><br>
|
|
En attendant tu peux aller voir<br>les sites et projets de nos copaines
|
|
</p>
|
|
</div>
|
|
</section>
|
|
|
|
<div id="colorBtnContainer" aria-hidden="true">
|
|
<svg class="icon" viewBox="0 0 34.01 34.53">
|
|
<path d="M10.91,27.58c-1.85-1.07-3.31-2.52-4.37-4.36-1.07-1.84-1.6-3.89-1.6-6.16s.53-4.32,1.6-6.15c1.07-1.84,2.52-3.29,4.37-4.36,1.85-1.07,3.91-1.6,6.17-1.6s4.29.53,6.14,1.6c1.85,1.07,3.3,2.52,4.37,4.37,1.07,1.85,1.6,3.89,1.6,6.14s-.53,4.29-1.6,6.14c-1.07,1.85-2.52,3.31-4.37,4.37-1.85,1.07-3.89,1.6-6.14,1.6s-4.32-.53-6.17-1.6ZM20.51,22.94c1.03-.59,1.85-1.41,2.44-2.44s.89-2.18.89-3.43-.3-2.4-.89-3.43-1.41-1.85-2.44-2.44c-1.04-.59-2.18-.89-3.43-.89s-2.43.3-3.46.89c-1.03.59-1.85,1.41-2.44,2.44-.59,1.03-.89,2.18-.89,3.43s.3,2.4.89,3.43c.59,1.03,1.41,1.85,2.44,2.44,1.03.59,2.19.89,3.46.89s2.4-.3,3.43-.89Z"/>
|
|
<path d="M15.29.08l3.31-.08-.15,3.71h-2.86s-.31-3.63-.31-3.63Z"/>
|
|
<path d="M19.13,34.43l-3.97.1.18-4.45h3.42s.37,4.35.37,4.35Z"/>
|
|
<path d="M30.95,28.29l-2.37,2.49-2.61-2.83,2.08-2.1,2.9,2.44Z"/>
|
|
<path d="M33.93,15.34l.08,3.31-3.71-.15v-2.86s3.63-.31,3.63-.31Z"/>
|
|
<path d="M28.48,3.38l2.47,2.35-2.81,2.59-2.08-2.07,2.42-2.87Z"/>
|
|
<path d="M5.79,30.92l-2.49-2.37,2.83-2.62,2.1,2.09-2.45,2.9Z"/>
|
|
<path d="M.08,18.76l-.08-3.35,3.76.15v2.89s-3.68.31-3.68.31Z"/>
|
|
<path d="M3.46,5.82l2.29-2.41,2.53,2.74-2.02,2.03-2.8-2.37Z"/>
|
|
</svg>
|
|
<label class="switch">
|
|
<input type="checkbox">
|
|
<span class="slider"></span>
|
|
</label>
|
|
<svg class="icon" viewBox="0 0 31.8 30.75">
|
|
<path d="M4.06,8.45l-2.47,1.39-1.58-2.84,2.41-1.39-2.41-1.39L1.58,1.39l2.47,1.35V0h3.23v2.74l2.51-1.35,1.55,2.84-2.38,1.39,2.38,1.39-1.55,2.84-2.51-1.39v2.8h-3.23v-2.8Z"/>
|
|
<path d="M31.8,18.58c0-2.12-.52-4.11-1.57-5.97-1.03-1.8-2.48-3.26-4.36-4.39-.06-.03-.1-.07-.16-.11-1.64-.96-3.35-1.5-5.11-1.67,0,1.22-.12,2.45-.42,3.71-.13.54-.28,1.07-.45,1.6-.49,1.51-1.16,3.01-2.03,4.49-1.18,2.01-2.55,3.73-4.1,5.15-.04.04-.09.07-.13.11-1.41,1.26-2.93,2.21-4.58,2.86.11.21.22.42.34.62.88,1.38,2.03,2.54,3.43,3.5.26.18.52.37.8.53,1.96,1.14,4,1.72,6.13,1.74,2.13.01,4.13-.5,5.97-1.55,1.85-1.05,3.35-2.55,4.49-4.5s1.72-4,1.73-6.12ZM22.95,24.51c-1.04.59-2.15.88-3.34.87-.68,0-1.34-.13-1.98-.34,2-1.74,3.67-3.72,4.97-5.94.9-1.55,1.62-3.2,2.15-4.95.3.34.57.69.79,1.08.59,1.03.88,2.15.87,3.34-.01,1.19-.33,2.33-.97,3.41s-1.47,1.92-2.5,2.51Z"/>
|
|
</svg>
|
|
</div>
|
|
|
|
<section id="musicPlayer" class="floating">
|
|
<h1>
|
|
artist — track
|
|
</h1>
|
|
<nav aria-hidden="true">
|
|
<button class="iconBtn" id="previousTrack">
|
|
<svg class="icon" viewBox="0 0 18.25 17.52">
|
|
<polygon points="18.25 0 5.28 6.21 5.28 .23 0 .23 0 8.75 0 8.81 0 17.29 5.28 17.29 5.28 11.33 18.25 17.52 18.25 11.58 11.88 8.78 18.25 5.94 18.25 0"/>
|
|
</svg>
|
|
</button>
|
|
<button class="iconBtn" id="toggleMusic">
|
|
<svg class="icon" viewBox="0 0 18.25 17.52">
|
|
<path d="M0,17.52v-5.94l6.37-2.84L0,5.94V0l18.25,8.71v.07L0,17.52Z"/>
|
|
</svg>
|
|
</button>
|
|
<button class="iconBtn">
|
|
<svg class="icon" viewBox="0 0 18.25 17.52">
|
|
<polygon points="12.97 .23 12.97 6.19 0 0 0 5.94 6.37 8.75 0 11.58 0 17.52 12.97 11.31 12.97 17.29 18.25 17.29 18.25 8.78 18.25 8.71 18.25 .23 12.97 .23"/>
|
|
</svg>
|
|
</button>
|
|
</nav>
|
|
</section>
|
|
|
|
<footer id="webRing" class="solid" aria-label="les copaines du LOL">
|
|
<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>
|
|
<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://labolyon.fr" target="_blank" aria-label="laboratoire ouvert lyonnais, hackerspace ">
|
|
<img src="/assets/webRings/labolyon.fr.png" alt="LOL en morse dans un cadre épais, en jaune sur fond noir">
|
|
</a>
|
|
</footer>
|
|
</main>
|
|
<aside>
|
|
<img id="texture" src="assets/background-noise.png" alt="un léger grain animé qui texture le fond">
|
|
<video id="gradient" src="assets/background.webm" autoplay muted loop aria-label="un gradient de couleur rose, vert, noir et blanc"></video>
|
|
</aside>
|
|
|
|
<script type="module" src="js/main.js"></script>
|
|
</body>
|
|
</html> |