wip header
This commit is contained in:
parent
aeb9595d42
commit
c4c4121b74
4 changed files with 108 additions and 7 deletions
|
|
@ -1,3 +1,76 @@
|
|||
:root {
|
||||
--lavender: #cdb4db;
|
||||
--light-pink: #ffc8dd;
|
||||
--pink: #ffafcc;
|
||||
--light-blue: #bde0fe;
|
||||
--blue: #a2d2ff;
|
||||
--darker-pink: #ff75a7;
|
||||
--darkerer-pink: #ff4287;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: crimson;
|
||||
background-image: url(assets/images/tiledbgpink.webp);
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
height: 100lvh;
|
||||
width: 100lvw;
|
||||
overflow: auto;
|
||||
font-family: "DotGothic16", sans-serif;
|
||||
|
||||
main {
|
||||
padding-top: 3.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* Navbar */
|
||||
navbar {
|
||||
font-family: "VT323", monospace;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100svw;
|
||||
height: 3.5rem;
|
||||
background-color: #c0c0c0;
|
||||
border-bottom: 2px solid #000;
|
||||
|
||||
navbar-content {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
|
||||
label {
|
||||
cursor: pointer;
|
||||
padding: 4px 8px;
|
||||
border: 2px solid;
|
||||
border-color: #ffffff #808080 #808080 #ffffff;
|
||||
background: #c0c0c0;
|
||||
|
||||
&:has(input:checked) {
|
||||
background: #ff75a7;
|
||||
color: #ffffff;
|
||||
border-color: #808080 #ffffff #ffffff #808080;
|
||||
}
|
||||
|
||||
&:active {
|
||||
border-color: #808080 #ffffff #ffffff #808080;
|
||||
padding: 5px 7px 3px 9px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: #0004;
|
||||
}
|
||||
}
|
||||
|
||||
input {
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
& a {
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
|
@ -3,8 +3,9 @@
|
|||
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" type="image/gif" href="/static/assets/gifs/pcgif.gif" />
|
||||
<link rel="icon" type="image/gif" href="/static/assets/gifs/pcgif.gif">
|
||||
<title>Agahnim</title>
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=DotGothic16&family=VT323&display=swap">
|
||||
<link rel="stylesheet" href="/static/style.css" />
|
||||
<script src="/static/vendor/htmx.min.js"></script>
|
||||
</head>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,8 @@
|
|||
<header>
|
||||
<nav>
|
||||
<a href="/">Accueil</a>
|
||||
</nav>
|
||||
</header>
|
||||
<navbar>
|
||||
<navbar-content>
|
||||
<label>
|
||||
<input type="radio" name="nav" id="nav-home" checked>
|
||||
<a href="/">Accueil</a>
|
||||
</label>
|
||||
</navbar-content>
|
||||
</navbar>
|
||||
|
|
@ -1 +1,25 @@
|
|||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
<h1>Bonjour</h1>
|
||||
Loading…
Add table
Add a link
Reference in a new issue