diff options
| -rw-r--r-- | lightweight/static/css/main.css | 140 |
1 files changed, 96 insertions, 44 deletions
diff --git a/lightweight/static/css/main.css b/lightweight/static/css/main.css index 7dad177..eed184e 100644 --- a/lightweight/static/css/main.css +++ b/lightweight/static/css/main.css @@ -2,7 +2,7 @@ font-family: 'Goudy Bookletter 1911'; font-style: normal; font-weight: normal; - src: local('Goudy Bookletter 1911'), local('GoudyBookletter1911'), url('http://themes.googleusercontent.com/font?kit=l5lwlGTN3pEY5Bf-rQEuILmKcuvUA98TddnVPjOJl_w') format('truetype'); + src: local('Goudy Bookletter 1911'), local('GoudyBookletter1911'), url('../fonts/Goudy Bookletter 1911.ttf') format('truetype'); } header, footer, section, nav { @@ -14,19 +14,16 @@ body { min-width: 800px; margin: 0; padding: 0; - /* Pensez à utiliser une collection de polices (2), par ex: - *///font-family: Arial, Helvetica, FreeSans, sans-serif; - font-size: .8em; /* À adapter pour la police choisie. (3) */ - line-height: 1.3; /* À adapter au design. (4) */ + font-size: .8em; + line-height: 1.3; color: #111; background: white; } -/* Titres */ h1, h2, h3, h4, h5, h6 { - margin: 1em 0 .5em 0; /* Rapproche le titre du texte. (5) */ + margin: 1em 0 .5em 0; line-height: 1.2; - font-weight: bold; /* Valeur par défaut. (6) */ + font-weight: bold; font-family: 'Goudy Bookletter 1911'; color: #111; font-style: normal; @@ -57,30 +54,39 @@ h4 { margin-left: 30px; } -/* Listes */ ul, ol { margin: .75em 0 .75em 32px; padding: 0; } -/* Paragraphes */ p { - margin: .75em; /* Marges plus faibles que par défaut. (7) */ + margin: .75em; } -pre, blockquote, table { - border: 2px dotted silver; +pre, blockquote { + border: 2px dotted grey; margin: 15px 10px; padding: 5px; scroll: auto; } +table { + border: 1px dashed grey; + padding: 0; + margin: 15px 10px; +} + td, th { + margin: 0; + padding: 2px 5px; + border: 1px dotted grey; + } + hr { height: 0; width: 60%; margin: 15px auto; color: transparent; - border-bottom: 2px dotted silver; + border-bottom: 2px dotted grey; } address { @@ -88,7 +94,6 @@ address { font-style: normal; } -/* Liens */ a { text-decoration: underline; } @@ -103,12 +108,10 @@ a:hover, a:focus, a:active { color: slategrey; } -/* Pas de bordure autour des images dans les liens */ a img { border: none; } -/* Divers éléments de type en-ligne (8) */ em { font-style: italic; } @@ -116,41 +119,38 @@ strong { font-weight: bold; } -/* Formulaires */ -form, fieldset { - margin: 0; - padding: 0; - border: none; -} -input, button, select { - vertical-align: middle; /* Solution pb. d'alignement. (9) */ -} div#page { width: 75%; margin: 5% auto 5% auto; background: #EFEFEF; - border: 1px solid silver; + border: 1px solid grey; border-radius: 10px; } header#header { width: 100%; - height: 60px; clear: both; text-align: center; - border-bottom: 1px solid silver; + border-bottom: 1px solid grey; } - #header#header>h1 { + #header>h1 { font-family: 'Goudy Bookletter 1911'; font-style: italic; - font-size: 200%; + font-size: 3em; + padding: 0; + margin: 15px 0 15px 0; } - - #header#header>h1>a { + #header>h1:before { + content: '~ '; + } + #header>h1:after { + content: ' ~'; + } + #header>h1>a { text-decoration: inherit; color: inherit; } @@ -159,7 +159,7 @@ div#page { width: 100%; padding-top: 2px; padding-bottom: 2px; - border-bottom: 1px solid silver; + border-bottom: 1px solid grey; text-align: center; } @@ -168,39 +168,91 @@ div#page { text-decoration: none; margin: 2px; padding: 1px; - border: 1px solid silver; + border: 1px solid grey; + border-radius: 3px; font-weight: bold; color: #222; } - nav#menu a:hover, nav#menu.active { - border: 1px solid SlateGrey; - color: #11C; + nav#menu a:hover, nav#menu a.active { + border: 1px solid black; + color: black; } section#content { float: left; width: 75%; - border-right: 1px solid silver; + border-right: 1px solid grey; } section#content article.post { margin: 10px; } + article.post h2.post_title { + margin: 20px 0 0 0; + padding: 0; + } + + article.post details.meta { + margin: 5px 0 0 0; + padding: 0; + } + article.post details.meta p { + margin: 0; + padding: 0; + } section.post_content, section.page_content { margin: 10px; } + .post details.meta { + margin: 0; + padding: 2px 3px; + border-bottom: 1px dotted grey; + font-size: .8em; + } + + #content a#all_tags { + text-align: center; + font-size: 1.8em; + } + #content ul#tag_list { + text-align: center; + list-style-type: none; + } + #content dl#archives dt { + margin-left: 40px; + } + #content dl#archives dd { + text-align: center; + } aside#sidebar { float: right; width: 24%; } + #sidebar .widget { + margin-bottom: 10px; + } + #sidebar .widget ul { + list-style-type: none; + margin: auto auto auto 15px; + } + #sidebar .widget ul li:before { + content: '» '; + } -footer#footer { - clear:both; - border-top: 1px solid silver; - padding: 5px 20px; -} + #sidebar .widget ul a.more { + display: inline-block; + padding-top: 5px; + text-decoration: none; + } + + + footer#footer { + clear:both; + border-top: 1px solid grey; + padding: 5px 20px; + } |