dimitri/blog
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Change CSS

Browse source
This commit is contained in:
Dimitri Lozeve 2018-11-14 21:32:32 +01:00
parent 528b427c43
commit 80947b72d9
1 changed files with 107 additions and 103 deletions
Download patch file Download diff file Expand all files Collapse all files

210
css/default.css
View file

@ -1,141 +1,145 @@
img {
max-width: 100%;
}
html { html {
font-size: 62.5%; font-size: 62.5%;
} }
body { body {
font-size: 1.6rem; font-size: 1.6rem;
color: #000; color: #000;
} }
header { header {
border-bottom: 0.2rem solid #000; border-bottom: 0.2rem solid #000;
} }
nav { nav {
text-align: right; text-align: right;
} }
nav a { nav a {
font-size: 1.8rem; font-size: 1.6rem;
font-weight: bold; font-weight: bold;
color: black; color: black;
text-decoration: none; text-decoration: none;
text-transform: uppercase; text-transform: uppercase;
} }
footer { footer {
margin-top: 3rem; margin-top: 3rem;
padding: 1.2rem 0; padding: 1.2rem 0;
border-top: 0.2rem solid #000; border-top: 0.2rem solid #000;
font-size: 1.2rem; font-size: 1.2rem;
color: #555; color: #555;
} }
h1 { h1 {
font-size: 2.4rem; font-size: 2.4rem;
} }
h2 { h2 {
font-size: 2rem; font-size: 2rem;
} }
article .header { article .header {
font-size: 1.4rem; font-size: 1.4rem;
font-style: italic; font-style: italic;
color: #555; color: #555;
} }
.logo a { .logo a {
font-weight: bold; font-weight: bold;
color: #000; color: #000;
text-decoration: none; text-decoration: none;
} }
@media (max-width: 319px) { @media (max-width: 319px) {
body { body {
width: 90%; width: 90%;
margin: 0; margin: 0;
padding: 0 5%; padding: 0 5%;
} }
header { header {
margin: 4.2rem 0; margin: 4.2rem 0;
} }
nav { nav {
margin: 0 auto 3rem; margin: 0 auto 3rem;
text-align: center; text-align: center;
} }
footer { footer {
text-align: center; text-align: center;
} }
.logo { .logo {
text-align: center; text-align: center;
margin: 1rem auto 3rem; margin: 1rem auto 3rem;
} }
.logo a { .logo a {
font-size: 2.4rem; font-size: 2.4rem;
} }
nav a { nav a {
display: block; display: block;
line-height: 1.6; line-height: 1.6;
} }
} }
@media (min-width: 320px) { @media (min-width: 320px) {
body { body {
width: 90%; width: 90%;
margin: 0; margin: 0;
padding: 0 5%; padding: 0 5%;
} }
header { header {
margin: 4.2rem 0; margin: 4.2rem 0;
} }
nav { nav {
margin: 0 auto 3rem; margin: 0 auto 3rem;
text-align: center; text-align: center;
} }
footer { footer {
text-align: center; text-align: center;
} }
.logo { .logo {
text-align: center; text-align: center;
margin: 1rem auto 3rem; margin: 1rem auto 3rem;
} }
.logo a { .logo a {
font-size: 2.4rem; font-size: 2.4rem;
} }
nav a { nav a {
display: inline; display: inline;
margin: 0 0.6rem; margin: 0 0.6rem;
} }
} }
@media (min-width: 640px) { @media (min-width: 640px) {
body { body {
width: 60rem; width: 80rem;
margin: 0 auto; margin: 0 auto;
padding: 0; padding: 0;
} }
header { header {
margin: 0 0 3rem; margin: 0 0 3rem;
padding: 1.2rem 0; padding: 1.2rem 0;
} }
nav { nav {
margin: 0; margin: 0;
text-align: right; text-align: right;
} }
nav a { nav a {
margin: 0 0 0 1.2rem; margin: 0 0 0 1.2rem;
display: inline; display: inline;
} }
footer { footer {
text-align: right; text-align: right;
} }
.logo { .logo {
margin: 0; margin: 0;
text-align: left; text-align: left;
} }
.logo a { .logo a {
float: left; float: left;
font-size: 1.8rem; font-size: 1.8rem;
} }
} }