added header for crocoloop
This commit is contained in:
parent
e20e7d25ea
commit
616c937036
1 changed files with 33 additions and 13 deletions
42
croco.html
42
croco.html
|
|
@ -1,9 +1,13 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Terrarium Crocos</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link href="https://fonts.googleapis.com/css2?family=EB+Garamond:wght@400;700&family=Inter:wght@300;400;600;700&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="./style.css">
|
||||
|
||||
<title>Crocoloop - Decosse Adrien</title>
|
||||
|
||||
<style>
|
||||
:root{
|
||||
--bg-day:#a6e3b0;
|
||||
|
|
@ -13,10 +17,10 @@
|
|||
--plant:#1f7a3a;
|
||||
--accent:#ffe66d;
|
||||
}
|
||||
html,body{height:100%;margin:0;font-family:Inter,system-ui,Arial}
|
||||
body{
|
||||
html{height:100%;margin:0;font-family:Inter,system-ui,Arial}
|
||||
.croco-root{
|
||||
display:flex;align-items:center;justify-content:center;background:var(--bg-day);transition:background 1s linear;
|
||||
height:100vh;overflow:hidden;color:#042a16
|
||||
min-height:100vh;overflow:hidden;color:#042a16;
|
||||
}
|
||||
|
||||
.frame{
|
||||
|
|
@ -27,21 +31,36 @@
|
|||
|
||||
canvas{display:block;width:100%;height:100%;background:transparent}
|
||||
|
||||
/* UI: left/right links preserved */
|
||||
.nav {
|
||||
/* UI: left/right links preserved (scoped to frame to avoid overriding site header) */
|
||||
.frame .nav {
|
||||
position:absolute;left:12px;top:12px;right:12px;display:flex;justify-content:space-between;pointer-events:auto;
|
||||
}
|
||||
.nav a{color:var(--soil);background:rgba(255,255,255,0.12);padding:8px 12px;border-radius:8px;text-decoration:none;font-weight:600}
|
||||
.frame .nav a{color:var(--soil);background:rgba(255,255,255,0.12);padding:8px 12px;border-radius:8px;text-decoration:none;font-weight:600}
|
||||
|
||||
/* simple legend */
|
||||
.legend{position:absolute;left:12px;bottom:12px;background:rgba(255,255,255,0.06);padding:8px 10px;border-radius:8px;font-size:13px}
|
||||
/* simple legend (scoped to frame) */
|
||||
.frame .legend{position:absolute;left:12px;bottom:12px;background:rgba(255,255,255,0.06);padding:8px 10px;border-radius:8px;font-size:13px}
|
||||
|
||||
/* sleeping Zs */
|
||||
.zzz{font-weight:900;color:#dfefff;filter:drop-shadow(0 4px 6px rgba(0,0,0,0.4))}
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<header class="site-header">
|
||||
<div class="container">
|
||||
<a class="brand" href="index.html">Decosse Adrien</a>
|
||||
<nav class="nav" aria-label="Main navigation">
|
||||
<a href="index.html">Accueil</a>
|
||||
<a href="syllabus.html">Syllabus</a>
|
||||
<a href="cours/index.html">Cours</a>
|
||||
<a href="riichi">Riichi</a>
|
||||
<a href="croco.html">Crocoloop</a>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="croco-root">
|
||||
<div class="frame" id="frame">
|
||||
<div class="nav">
|
||||
<a id="leftLink" href="https://perso.eleves.ens-rennes.fr/people/jules.timmerman/croco.html"><= Croco</a>
|
||||
|
|
@ -67,6 +86,7 @@
|
|||
|
||||
<div class="legend" id="legend">Terrarium — Heures: <span id="timeText"></span></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
/* Terrarium Crocos
|
||||
|
|
|
|||
Loading…
Reference in a new issue