WIP proto site web
This commit is contained in:
parent
6fdd3edd04
commit
dd8797c753
10 changed files with 87 additions and 15 deletions
BIN
docker/landing/html/landing/fonts/texgyreheros-bold.otf
Normal file
BIN
docker/landing/html/landing/fonts/texgyreheros-bold.otf
Normal file
Binary file not shown.
BIN
docker/landing/html/landing/fonts/texgyreheros-bolditalic.otf
Normal file
BIN
docker/landing/html/landing/fonts/texgyreheros-bolditalic.otf
Normal file
Binary file not shown.
BIN
docker/landing/html/landing/fonts/texgyreheros-italic.otf
Normal file
BIN
docker/landing/html/landing/fonts/texgyreheros-italic.otf
Normal file
Binary file not shown.
BIN
docker/landing/html/landing/fonts/texgyreheros-regular.otf
Normal file
BIN
docker/landing/html/landing/fonts/texgyreheros-regular.otf
Normal file
Binary file not shown.
BIN
docker/landing/html/landing/fonts/texgyreheroscn-bold.otf
Normal file
BIN
docker/landing/html/landing/fonts/texgyreheroscn-bold.otf
Normal file
Binary file not shown.
BIN
docker/landing/html/landing/fonts/texgyreheroscn-bolditalic.otf
Normal file
BIN
docker/landing/html/landing/fonts/texgyreheroscn-bolditalic.otf
Normal file
Binary file not shown.
BIN
docker/landing/html/landing/fonts/texgyreheroscn-italic.otf
Normal file
BIN
docker/landing/html/landing/fonts/texgyreheroscn-italic.otf
Normal file
Binary file not shown.
BIN
docker/landing/html/landing/fonts/texgyreheroscn-regular.otf
Normal file
BIN
docker/landing/html/landing/fonts/texgyreheroscn-regular.otf
Normal file
Binary file not shown.
Before Width: | Height: | Size: 3.7 KiB After Width: | Height: | Size: 3.7 KiB |
|
@ -1,11 +1,15 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>deuxfleurs</title>
|
||||
<title>💮💮 deuxfleurs</title>
|
||||
<meta charset="utf-8"/>
|
||||
<style>
|
||||
@font-face {
|
||||
font-family: "Heroes";
|
||||
src: url('fonts/texgyreheros-regular.otf') format('truetype');
|
||||
}
|
||||
* {
|
||||
font-family: Helvetica;
|
||||
font-family: Heroes;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
@ -13,34 +17,102 @@
|
|||
header {
|
||||
background-color: #519c60;
|
||||
color: #ffffff;
|
||||
padding: 50px 40px 1px 40px;
|
||||
padding: 50px 0px 1px 0px;
|
||||
}
|
||||
|
||||
header > h1 {
|
||||
font-size: 80px;
|
||||
margin: 10px 0px -31px 0px;
|
||||
h1 {
|
||||
font-size: 5em;
|
||||
}
|
||||
|
||||
header > .site-name > img, header > .site-name > span {
|
||||
vertical-align: middle;
|
||||
h2 {
|
||||
font-size: 3em;
|
||||
}
|
||||
|
||||
header > .site-name > span {
|
||||
.spacing {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
header > .container > h1 {
|
||||
margin: 10px 0px -27px 0px;
|
||||
}
|
||||
|
||||
header > .container > .site-name > img {
|
||||
vertical-align: -9px;
|
||||
}
|
||||
|
||||
header > .container > .site-name > a {
|
||||
font-size: 30px;
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.container {
|
||||
padding: 0px 40px 0px 40px;
|
||||
}
|
||||
|
||||
.chapeau {
|
||||
font-size: 1.8em;
|
||||
font-weight: bold;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.service-box {
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
border: 0.2em solid #000;
|
||||
width: 250px;
|
||||
text-align:center;
|
||||
margin-right: 1em;
|
||||
}
|
||||
|
||||
.service-box:hover {
|
||||
background-color: #000;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<!-- <div class="site-name">
|
||||
<img src="1f4ae.svg" width="32">
|
||||
<img src="1f4ae.svg" width="32">
|
||||
<span>deuxfleurs<span>
|
||||
</div> -->
|
||||
<h1>documentation</h1>
|
||||
<div class="container">
|
||||
<div class="site-name" style="float:right">
|
||||
<a href="./prototype.html">deuxfleurs</a>
|
||||
<img src="img/flower.svg" width="38">
|
||||
<img src="img/flower.svg" width="38">
|
||||
</div>
|
||||
<h1>notre internet</h1>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<div class="container spacing"/>
|
||||
<div class="chapeau">⇨ protège votre vie privée</div>
|
||||
<div class="chapeau">⇨ défend vos libertés et vos droits</div>
|
||||
<div class="chapeau">⇨ ne vous manipule pas</div>
|
||||
|
||||
<section class="spacing">
|
||||
<h2>et vous permet de</h2>
|
||||
|
||||
<div class="list" />
|
||||
<a href="" class="service-box spacing">
|
||||
<div style="font-size: 80px">💬</div>
|
||||
<h3>chatter</h3>
|
||||
</a>
|
||||
<a href="" class="service-box spacing">
|
||||
<div style="font-size: 80px">📄</div>
|
||||
<h3>sauvegarder vos documents</h3>
|
||||
</a>
|
||||
<a href="" class="service-box spacing">
|
||||
<div style="font-size: 80px">📨</div>
|
||||
<h3>envoyer des emails</h3>
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
|
|
Reference in a new issue