Skip to content

l3m-website
l3m-website
Commit 7bbd5b26 authored by Corentin Bettiol's avatar Corentin Bettiol 💻
Browse files
Options

minor tweaks

parent 51781624
Hide whitespace changes
Inline Side-by-side
Showing with 64 additions and 7 deletions
css/design.css
View file @ 7bbd5b26
......@@ -4,6 +4,10 @@
CSS
*/
*{
color: #1f1f2e;
}
body{
margin: 0;
padding: 0;
......@@ -48,6 +52,19 @@ ul{
li a{
padding: 7px;
margin: 5px;
text-decoration: none;
background-color: #d9d9d9;
transition: color 0.2s, background-color 0.2s;
}
li a:hover{
color: #47476b;
background-color: #f0f0f0;
transition: color 0.2s, background-color 0.2s;
}
section{
padding-left: 15px;
}
......@@ -80,6 +97,10 @@ Media Queries
h1{
margin-left: 2px;
}
li{
margin: 0 5px;
}
}
@media all and (max-width: 1020px){
......@@ -89,7 +110,11 @@ Media Queries
}
}
@media all and (max-width: 900px){
@media all and (max-width: 920px){
body{
font-size: 1.2em;
}
header{
flex-direction: column;
margin-top: 5px;
......@@ -120,15 +145,35 @@ Media Queries
}
li{
margin: 2px 5px;
margin: 5px;
}
li a{
background-color: #f2f2f2;
padding: 3px;
}
li a:hover{
background-color: #e3e3e3;
}
}
@media all and (max-width: 370px){
body{
font-size: 1em;
}
li{
width: 100%;
width: 90%;
margin: auto;
text-align: center;
}
ul li a{
display: inline-block;
width: 90%;
padding: 0 5px;
}/*
li:nth-child(5){
margin-top: 8px;
}*/
}
/*
......
index.php
View file @ 7bbd5b26
......@@ -2,10 +2,23 @@
<html lang="fr">
<head>
<meta charset="utf-8" />
<title>l3m website -- Blog</title>
<link rel="stylesheet" href="css/design.css" />
<meta name="description" content="Site perso de Corentin Bettiol." />
<meta name="viewport" content="width=device-width" />
<title>l3m website -- Blog</title>
<link rel="stylesheet" href="css/design.css" />
<style>
*{
color: #1f1f2e;
}
li a{
background-color: #e3e3e3;
}
@media all and (max-width: 700px){
li a{
background-color: #f2f2f2;
}
}
</style>
</head>
<body>
......@@ -20,10 +33,9 @@
</header>
<nav>
<ul>
<li><a href="#home" title="Accueil">Accueil</a></li>
<li><a href="#blog" title="Blog">Blog</a></li>
<li><a href="#about" title="À propos">À propos</a></li>
<li><a href="#projects" title="Projets">Projets</a></li>
<li><a href="#blog" title="Blog">Blog</a></li>
<li><a href="#contact" title="Contact">Contact</a></li>
<li><a href="#login" title="Connexion">Connexion</a></li>
</ul>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment