Complétion

This commit is contained in:
Romain de Laage 2020-01-30 17:47:26 +01:00
parent a17a349255
commit 67335bdb70
3 changed files with 60 additions and 3 deletions

View File

@ -10,11 +10,22 @@
<h1>Romain de Laage</h1>
</header><nav>
<ul>
<li>test</li>
<li>test</li>
<a href="https://cloud.rdelaage.ovh"><li>Cloud</li></a>
<a href="https://dev.rdelaage.ovh"><li>Développement</li></a>
<a href="https://rdelaage.ovh/cv"><li>CV</li></a>
</ul>
</nav><section>
Lorem ipsum dolor sit amet
<div class="logo">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="225" width="225">
<g transform="translate(55,37)" id="content">
<rect id="yellow" ry="5" rx="5" y="0" x="0" height="150" width="50" fill="white" />
<rect id="blue" ry="5" rx="5" y="0" x="65" height="90" width="50" fill="white" />
<circle id="red" r="25" cy="125" cx="90" fill="white" />
</g>
</svg>
</div>
<p>Bienvenue sur mon espace personnel.</p>
<p>Vous pouvez retrouver mes hébérgements perso sur <a href="#">https://pi.rdelaage.ovh</a> et mon CV <a href="https://rdelaage.ovh/cv">ici</a></p>
</section><footer>
Made with ❤ by <a href="#">Romain de Laage</a>
</footer>

8
logo.svg Normal file
View File

@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8" ?>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="225" width="225">
<g transform="translate(55,37)" id="content">
<rect ry="5" rx="5" y="0" x="0" height="150" width="50" fill="white" />
<rect ry="5" rx="5" y="0" x="65" height="90" width="50" fill="white" />
<circle r="25" cy="125" cx="90" fill="white" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 386 B

View File

@ -2,6 +2,7 @@
box-sizing: border-box;
margin: 0;
font-family: sans-serif;
box-sizing: border-box;
}
html, body{
height: 100%;
@ -18,12 +19,23 @@ nav{
height: calc(100% - 150px);
width: 200px;
vertical-align:top;
background-color: #34495e;
color: #D0D0D0;
padding: 15px;
}
nav ul{
list-style-type: none;
padding: 0;
}
section{
display: inline-block;
height: calc(100% - 150px);
width: calc(100% - 200px);
vertical-align:top;
background-color: #2c3e50;
vertical-align:middle;
color: #D0D0D0;
padding: 15px;
}
footer{
background-color: #16a085;
@ -32,3 +44,29 @@ footer{
line-height: 50px;
color: #ecf0f1;
}
rect, circle{
transition: 0.3s;
fill: #D0D0D0;
}
#yellow:hover{
fill: #f6b93b;
}
#blue:hover{
fill: #1e3799;
}
#red:hover{
fill: #eb2f06;
}
nav li{
transition: 0.3s;
line-height: 1.5em;
}
nav li:hover{
background-color: rgba(255, 255, 255, 0.3);
}
section .logo{
text-align: center;
}
a{
color: #C0C0C0;
}