add: style.css : transformation de l'image d'arriere plan en generation par le client + debut de stylisation des differentes categories de balises et elements
This commit is contained in:
@@ -8,9 +8,10 @@
|
|||||||
<title>Hatmos</title>
|
<title>Hatmos</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<header id="page-top">
|
||||||
<h1><a href="index.html">Hatmos</a></h1>
|
<h1><a href="index.html">Hatmos</a></h1>
|
||||||
<h2>Your favorite wannabe technician</h2>
|
<h2>Your favorite wannabe technician</h2>
|
||||||
<nav>
|
<nav id="top-nav">
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="#myself">A propos</a></li>
|
<li><a href="#myself">A propos</a></li>
|
||||||
<li><a href="#projects">Projets</a></li>
|
<li><a href="#projects">Projets</a></li>
|
||||||
@@ -18,6 +19,7 @@
|
|||||||
<li><a href="#garden">Jardin</a></li>
|
<li><a href="#garden">Jardin</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
|
</header>
|
||||||
<main>
|
<main>
|
||||||
<a href="about.html"><div id="myself">
|
<a href="about.html"><div id="myself">
|
||||||
<h1>A propos</h1>
|
<h1>A propos</h1>
|
||||||
|
|||||||
@@ -1,9 +1,20 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html lang="fr-FR">
|
||||||
<head>
|
<head>
|
||||||
|
<meta chartset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<link rel="stylesheet" href="styles/style.css">
|
||||||
|
<link rel="icon" href="">
|
||||||
|
<title>Hatmos</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<h1><a href="index.html">Hatmos</a></h1>
|
||||||
|
<h2>Your favorite wannabe technician<h2>
|
||||||
|
<nav>
|
||||||
|
<ul>
|
||||||
|
<li><a href="lewoapws.html">Apprendre l'Electronique en faisant un Arroseur de Plante Autonome</a></li>
|
||||||
|
<li><a href="projects/self_hosted_debian_server.html">Serveur Debian Auto-heberge</a></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
21
projects/lewoapws.html
Normal file
21
projects/lewoapws.html
Normal file
@@ -0,0 +1,21 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr-FR">
|
||||||
|
<head>
|
||||||
|
<meta chartset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<link rel="stylesheet" href="../styles/style.css">
|
||||||
|
<link rel="icon" href="">
|
||||||
|
<title>Hatmos</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1><a href="../index.html">Hatmos</a></h1>
|
||||||
|
<h2>Your favorite wannabe technician<h2>
|
||||||
|
<main>
|
||||||
|
<h1>Apprendre l'Electronique avec un Arroseur de Plante Automatique</h1>
|
||||||
|
<figure>
|
||||||
|
<img id="work_in_progress" src="https://media1.tenor.com/m/FPsODnFH-dEAAAAC/typing-fast.gif"/>
|
||||||
|
<figcaption>Work In Progress</figcaption>
|
||||||
|
</figure>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
22
projects/self_hosted_debian_server.html
Normal file
22
projects/self_hosted_debian_server.html
Normal file
@@ -0,0 +1,22 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr-FR">
|
||||||
|
<head>
|
||||||
|
<meta chartset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<link rel="stylesheet" href="../styles/style.css">
|
||||||
|
<link rel="icon" href="">
|
||||||
|
<title>Hatmos</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1><a href="../index.html">Hatmos</a></h1>
|
||||||
|
<h2>Your favorite wannabe technician<h2>
|
||||||
|
<main>
|
||||||
|
<h1>Serveur Debian Auto-heberge</h1>
|
||||||
|
<figure>
|
||||||
|
<img id="work_in_progress" src="https://media1.tenor.com/m/FPsODnFH-dEAAAAC/typing-fast.gif"/>
|
||||||
|
<figcaption>Work In Progress</figcaption>
|
||||||
|
</figure>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
@@ -1,5 +1,29 @@
|
|||||||
body {
|
body {
|
||||||
background-image: url('../images/fond_minimaliste.png');
|
background-color: #ffffff;
|
||||||
background-size: cover;
|
background-image: radial-gradient(circle, #d0d0d5 1.5px, transparent 1px);
|
||||||
background-repeat: repeat-y;
|
background-size: 50px 50px;
|
||||||
|
background-repeat: repeat;
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
#top-nav {
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
div {
|
||||||
|
background-color: white;
|
||||||
|
transition: box-shadow 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
div:hover{
|
||||||
|
background-color: white;
|
||||||
|
box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
background-color: #333333;
|
||||||
|
color: #eeeeee;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user