From c594aedf8c37e275ded35e4dcf499fc11974c9db Mon Sep 17 00:00:00 2001 From: nicosomb Date: Tue, 9 Apr 2013 15:18:39 +0200 Subject: modif css --- css/style.css | 142 +++++++++++++++++++++++++++++++++++++++++++++------------- 1 file changed, 111 insertions(+), 31 deletions(-) (limited to 'css') diff --git a/css/style.css b/css/style.css index 812ccca7..41ea0d00 100644 --- a/css/style.css +++ b/css/style.css @@ -1,3 +1,4 @@ +/*** GENERAL ***/ body { color: #222222; font: 20px/1.3em Palatino,Georgia,serif; @@ -5,41 +6,15 @@ body { margin: 10px; } -body.article { - color: #222222; - font: 20px/1.3em Palatino,Georgia,serif; - background-color: #F1F1F1; -} a, a:hover, a:visited { color: #000; } + header { text-align: center; } -#article header { - text-align: left; - border-bottom: 1px solid #222222; -} - -#article header a { - text-decoration: none; -} - -#article article { - border-bottom: 1px solid #222222; -} - -.vieworiginal a { - color: #888888; - text-decoration: none; -} - -#main, #article { - margin: 0 auto; -} - #main ul#links { padding: 0; list-style-type: none; @@ -57,6 +32,10 @@ header { color: #F1F1F1; } +#main, #article { + margin: 0 auto; +} + #links a, .backhome a{ text-decoration: none; padding: 5px 10px; @@ -68,6 +47,59 @@ header { color: #F1F1F1; } +footer { + text-align: right; +} + +/*** ***/ +/*** GRID DISPLAY ***/ + +#content { + width: 800px; + margin: 0 auto; +} + +#entries { + -moz-column-count: 3; + -moz-column-gap: 20px; + -webkit-column-count: 3; + -webkit-column-gap: 20px; + column-count: 3; + column-gap: 20px; + width: 800px; +} + +#entries span.content { + display: inline-block; + margin-bottom: 0px; + width: 100%; +} + +@media only screen and (max-width : 599px), +only screen and (max-device-width : 599px){ + #entries { + -moz-column-count: 2; + -moz-column-gap: 10px; + -webkit-column-count: 2; + -webkit-column-gap: 10px; + column-count: 2; + column-gap: 10px; + width: 400px; + } + + #content { + width: 400px; + } +} + +/*** ***/ +/*** LINKS DISPLAY ***/ + +#main a.tool { + text-decoration: none; + cursor: pointer; +} + #main #entries { margin-top: 20px; } @@ -82,6 +114,7 @@ header { border-radius: 2px; -webkit-box-shadow: 0px 0px 2px -1px #000; box-shadow: 0px 0px 2px -1px #000; + list-style-type: none; } #main #entries .entrie h2 a { @@ -100,10 +133,57 @@ header { margin-left: -20px; } -#main a.tool { +#main #entries .entrie .tools a.tool span { + display: inline-block; + width: 16px; + height: 16px; +} + +a.fav span { + background: url('../img/fav-on.png') no-repeat; +} + +a.fav-off span { + background: url('../img/fav-off.png') no-repeat; +} + +a.archive span { + background: url('../img/archive-on.png') no-repeat; +} + +a.archive-off span { + background: url('../img/archive-off.png') no-repeat; +} + +a.delete span { + background: url('../img/delete.png') no-repeat; +} + +/*** ***/ +/*** ARTICLE PAGE ***/ + +body.article { + color: #222222; + font: 20px/1.3em Palatino,Georgia,serif; + background-color: #F1F1F1; +} + +#article header { + text-align: left; + border-bottom: 1px solid #222222; +} + +#article header a { text-decoration: none; } -footer { - text-align: right; -} \ No newline at end of file +#article article { + border-bottom: 1px solid #222222; +} + +.vieworiginal a { + color: #888888; + text-decoration: none; +} + +/*** ***/ \ No newline at end of file -- cgit v1.2.3