better style for selfie, added link to English version

This commit is contained in:
Phuntsok Drak-pa 2019-07-10 20:18:13 +02:00
parent 7d8ec15181
commit 7ac8a28a44
2 changed files with 16 additions and 10 deletions

View File

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="fr"> <html lang="fr" translate="no">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
@ -38,10 +38,11 @@
<li><a href="#cont-training">Formations</a></li> <li><a href="#cont-training">Formations</a></li>
<li><a href="#cont-portfolio">Portfolio</a></li> <li><a href="#cont-portfolio">Portfolio</a></li>
<li><a href="#cont-hobbies">Loisirs</a></li> <li><a href="#cont-hobbies">Loisirs</a></li>
<li><a href="https://en.phundrak.fr/" lang="en">English Version</a></li>
</ul> </ul>
</div> </div>
<div class="sidebar"> <div class="sidebar">
<img class="side-picture center" src="https://cdn.phundrak.fr/img/photo-de-ma-gueule.jpg" alt="Photo de 2016" width="240" height="240" /> <div class="side-picture"><img class="picture center" src="https://cdn.phundrak.fr/img/photo-de-ma-gueule.jpg" alt="Photo de moi-même" /></div>
<div class="side-card side-contact"> <div class="side-card side-contact">
<div> <div>
<div class="header-container"> <div class="header-container">

View File

@ -11,7 +11,7 @@ body {
'ribbon ribbon' 'ribbon ribbon'
'sidebar content'; 'sidebar content';
grid-template-columns: 300px auto; grid-template-columns: 300px auto;
background-color: #34495e; background-color: #3498db;
margin: 0; margin: 0;
padding: 0; padding: 0;
font-family: 'Fira Sans', serif; font-family: 'Fira Sans', serif;
@ -23,13 +23,13 @@ a {
color: #ecf0f1; color: #ecf0f1;
text-decoration: none; text-decoration: none;
font-style: italic; font-style: italic;
box-shadow: inset 0 -3px 0 #9b59b6; border-bottom: 5px solid #9b59b6;
transition: all .3s ease-in-out; transition: color 0.2s;
} }
a:hover { a:hover {
box-shadow: inset 0 -21px 0 #9b59b6; color: #9b59b6;
transition: all .3s ease-in-out; transition: color 0.4s;
} }
h1, h1,
@ -41,7 +41,7 @@ h2 {
.sidebar, .sidebar,
.content { .content {
padding: 10px; padding: 10px;
background-color: #2c3e50; background-color: #bdc3c7;
} }
.center { .center {
@ -107,7 +107,12 @@ h2 {
.side-picture { .side-picture {
grid-area: side-picture; grid-area: side-picture;
margin: 10px auto; margin: 10px;
}
.side-picture > .picture {
max-width: 100%;
margin: 0 auto;
} }
.side-contact { .side-contact {
@ -128,7 +133,7 @@ h2 {
.side-card { .side-card {
margin: 10px; margin: 10px;
background-color: #34495e; background-color: #2c3e50;
} }
.side-card h4, .side-card h4,