texte menu en vrac
This commit is contained in:
12
index.html
12
index.html
@@ -11,6 +11,18 @@
|
||||
<body>
|
||||
<div id="main">
|
||||
<img class="contain" src="./docs/fond.png">
|
||||
<div class="link-index container-link-asso">
|
||||
<div class="dot-link dot-link-asso"></div>
|
||||
<a class="menu-link link-asso"><h1>KOSMOPOLIT l'association</h1></a>
|
||||
</div>
|
||||
<div class="link-index container-link-litterall">
|
||||
<div class="dot-link dot-link-litterall"></div>
|
||||
<a class="menu-link link-litterall"><h1>LITTERall</h1></a>
|
||||
</div>
|
||||
<div class="link-index container-link-lettredeeda">
|
||||
<div class="dot-link dot-link-lettredeeda"></div>
|
||||
<a class="menu-link link-lettredeed"><h1>lettres d'europe et d'ailleurs</h1></a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
0
lettresdeeda.html
Normal file
0
lettresdeeda.html
Normal file
0
litterall.html
Normal file
0
litterall.html
Normal file
28
menu.html
Normal file
28
menu.html
Normal file
@@ -0,0 +1,28 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" dir="ltr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>kosmopolit</title>
|
||||
<meta name="description" content="description du site web">
|
||||
<meta name="keywords" content="truc, bidule, chouette">
|
||||
<link href="./styles/style.css" type="text/css" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<div id="main">
|
||||
<img class="contain" src="./docs/fond.png">
|
||||
<div class="link-index container-link-asso">
|
||||
<div class="dot-link dot-link-asso"></div>
|
||||
<a class="menu-link link-asso"><h1>KOSMOPOLIT l'association</h1></a>
|
||||
</div>
|
||||
<div class="link-index container-link-litterall">
|
||||
<div class="dot-link dot-link-litterall"></div>
|
||||
<a class="menu-link link-litterall"><h1>LITTERall</h1></a>
|
||||
</div>
|
||||
<div class="link-index container-link-lettredeeda">
|
||||
<div class="dot-link dot-link-lettredeeda"></div>
|
||||
<a class="menu-link link-lettredeed"><h1>lettres d'europe et d'ailleurs</h1></a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -127,7 +127,6 @@ blockquote, q {
|
||||
|
||||
|
||||
|
||||
|
||||
/*/////////////////////////////////////////////*/
|
||||
/*GLOBAL VARIABLE*/
|
||||
:root {
|
||||
@@ -135,9 +134,16 @@ blockquote, q {
|
||||
--color-texts: rgb(1, 1, 1);
|
||||
--color-links: rgb(1, 1, 1);
|
||||
|
||||
--color-purple: #ee1998;
|
||||
--color-pink: #ff7bca;
|
||||
--color-green: #8fce3c;
|
||||
--color-yellow: #e3e00a;
|
||||
--color-blue: #51cee4;
|
||||
--color-water: #0c9cb5;
|
||||
|
||||
/* fonts */
|
||||
--font-titles: 'louisgeorge';
|
||||
--font-texts: 'paradroid';
|
||||
--font-titles: 'paradroid';
|
||||
--font-texts: 'louisgeorge';
|
||||
--font-fallback: 'cabrion';
|
||||
}
|
||||
/*GLOBAL VARIABLE*/
|
||||
@@ -193,6 +199,7 @@ em {
|
||||
|
||||
|
||||
#main {
|
||||
position: relative;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
}
|
||||
@@ -206,3 +213,40 @@ img {
|
||||
.cover {
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.link-index {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
}
|
||||
.dot-link {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin: auto;
|
||||
margin-right: 10px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.menu-link {
|
||||
margin: auto;
|
||||
}
|
||||
.container-link-asso {
|
||||
top: 100px;
|
||||
left: 200px;
|
||||
}
|
||||
.dot-link-asso {
|
||||
background-color: var(--color-purple);
|
||||
}
|
||||
.container-link-litterall {
|
||||
top: 300px;
|
||||
left: 600px;
|
||||
}
|
||||
.dot-link-litterall {
|
||||
background-color: var(--color-green);
|
||||
}
|
||||
.container-link-lettredeeda {
|
||||
top: 600px;
|
||||
left: 900px;
|
||||
}
|
||||
.dot-link-lettredeeda {
|
||||
background-color: var(--color-blue);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user