pro/2022_WEBSITE_kosmopolit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

texte menu en vrac

Browse Source
This commit is contained in:
hugogogo
2020-12-02 11:06:06 +01:00
parent c1f8942f06
commit 8d56295b20
6 changed files with 94 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
asso.html Normal file
View File

@@ -0,0 +1,7 @@
sdkfjk
sdfkj
sdf
dsf
sdf
sdfsdf

12
index.html
View File

@@ -11,6 +11,18 @@
<body> <body>
<div id="main"> <div id="main">
<img class="contain" src="./docs/fond.png"> <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> </div>
</body> </body>
</html> </html>

0
lettresdeeda.html Normal file
View File

0
litterall.html Normal file
View File

28
menu.html Normal file
View 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>

50
styles/style.css
View File

@@ -127,7 +127,6 @@ blockquote, q {
/*/////////////////////////////////////////////*/ /*/////////////////////////////////////////////*/
/*GLOBAL VARIABLE*/ /*GLOBAL VARIABLE*/
:root { :root {
@@ -135,9 +134,16 @@ blockquote, q {
--color-texts: rgb(1, 1, 1); --color-texts: rgb(1, 1, 1);
--color-links: 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 */ /* fonts */
--font-titles: 'louisgeorge'; --font-titles: 'paradroid';
--font-texts: 'paradroid'; --font-texts: 'louisgeorge';
--font-fallback: 'cabrion'; --font-fallback: 'cabrion';
} }
/*GLOBAL VARIABLE*/ /*GLOBAL VARIABLE*/
@@ -193,6 +199,7 @@ em {
#main { #main {
position: relative;
height: 100vh; height: 100vh;
width: 100vw; width: 100vw;
} }
@@ -206,3 +213,40 @@ img {
.cover { .cover {
object-fit: 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);
}