250 lines
8.5 KiB
CSS
250 lines
8.5 KiB
CSS
|
/**
|
||
|
|
# ***** BEGIN LICENSE BLOCK *****
|
||
|
|
#
|
||
|
|
# Nom du theme : Plop
|
||
|
|
# Auteur : Kozlika
|
||
|
|
# Licence : GNU-GPL
|
||
|
|
#
|
||
|
|
# ***** END LICENSE BLOCK ***** */
|
||
|
|
|
||
|
|
/**
|
||
|
|
Palette
|
||
|
|
- Lien titre blog, liens titres billets : turquouise #21aace;
|
||
|
|
- Titre billet, lire la suite : orange #f60;
|
||
|
|
- Liens par défaut : rouge #ce2155;
|
||
|
|
- Titres catégories sidebar : vert #aace21;
|
||
|
|
*/
|
||
|
|
|
||
|
|
/* -------------------------------------------
|
||
|
|
MINI RESET (cf. Eric Meyer)
|
||
|
|
-------------------------------------------- */
|
||
|
|
* { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
|
||
|
|
|
||
|
|
/* -------------------------------------------
|
||
|
|
STRUCTURE GÉNÉRALE
|
||
|
|
-------------------------------------------- */
|
||
|
|
body {
|
||
|
|
text-align : center;
|
||
|
|
font-size: .86em;
|
||
|
|
background: #fff url(img/new-bg.jpg) repeat-y center top;
|
||
|
|
font-family: arial, helvetica, sans-serif;
|
||
|
|
line-height: 1.3;
|
||
|
|
}
|
||
|
|
#page {
|
||
|
|
margin : 20px auto 0 auto;
|
||
|
|
width : 100%;
|
||
|
|
background: transparent url(img/new-top.jpg) no-repeat center top;
|
||
|
|
}
|
||
|
|
#top {
|
||
|
|
}
|
||
|
|
#top h1 {
|
||
|
|
margin : 0 auto;
|
||
|
|
padding : 20px 0 30px 0;
|
||
|
|
font-family: "arial narrow";
|
||
|
|
font-size: 2.66em;
|
||
|
|
width: 840px;
|
||
|
|
text-align: right;
|
||
|
|
}
|
||
|
|
#top h1 a { color: #21aace; padding-right: 20px;
|
||
|
|
background: transparent url(img/new-title.jpg) no-repeat right .6em; }
|
||
|
|
#top h1 a:hover { color: #ce2155; }
|
||
|
|
#prelude {
|
||
|
|
position: absolute;
|
||
|
|
top: 4px;
|
||
|
|
left: 50%;
|
||
|
|
margin-left: -420px;
|
||
|
|
text-align: left;
|
||
|
|
font-size: .86em;
|
||
|
|
width: 840px;
|
||
|
|
text-indent: 230px;
|
||
|
|
color: #ddd;
|
||
|
|
}
|
||
|
|
#prelude a { color: #bbb; }
|
||
|
|
#wrapper {
|
||
|
|
text-align : left;
|
||
|
|
width: 840px;
|
||
|
|
margin: 0 auto;
|
||
|
|
}
|
||
|
|
#main {
|
||
|
|
width : 100%;
|
||
|
|
margin : 0 0 0 -220px;
|
||
|
|
float : right;
|
||
|
|
}
|
||
|
|
#content {
|
||
|
|
margin : 0 0 0 260px;
|
||
|
|
padding : 20px 40px;
|
||
|
|
background: #fff;
|
||
|
|
}
|
||
|
|
#footer {
|
||
|
|
clear : both;
|
||
|
|
text-align:right;
|
||
|
|
padding-right: 20px;
|
||
|
|
padding-bottom: 20px;
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
#sidebar {
|
||
|
|
width : 220px;
|
||
|
|
float : left;
|
||
|
|
font-size: .95em;
|
||
|
|
margin-top: 80px;
|
||
|
|
}
|
||
|
|
#blognav div, #blogextra div {
|
||
|
|
margin: 1em;
|
||
|
|
padding: .5em;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* -------------------------------------------
|
||
|
|
BALISES HTML
|
||
|
|
-------------------------------------------- */
|
||
|
|
/* Hierarchie des titres */
|
||
|
|
h2, h3, h4, h5, h6 { margin-bottom: 1em; color: #666; }
|
||
|
|
h1 { }
|
||
|
|
h2 { font-size: 1.5em; font-weight: bold;color: #f60}
|
||
|
|
h3 { font-size: 1.33em; margin-top: 1em; color: #f60;}
|
||
|
|
h4 { font-size: 1.2em; margin-top: 1em;color: #f60; }
|
||
|
|
h5 { font-size: 1em; margin-top: 1em;color: #f60;}
|
||
|
|
h6 { font-size: .9em; margin-top: 1em;color: #f60}
|
||
|
|
|
||
|
|
/* Regles des balises courantes */
|
||
|
|
p { margin: 0 0 .5em 0;}
|
||
|
|
img, iframe, object { }
|
||
|
|
form { display: block; }
|
||
|
|
q { font-family: georgia, serif; padding: 1px; background: #E6F0C2; }
|
||
|
|
blockquote { quotes: "\201C" "\201D"; padding: 2px 8px;font-family: georgia, serif; }
|
||
|
|
cite { }
|
||
|
|
ul { margin-left: 1em; padding-left: 0; list-style-type: none;}
|
||
|
|
ul li { background: transparent url(img/li.png) no-repeat 0 .3em;padding-left: 10px;}
|
||
|
|
ol { margin-left: 1em; padding-left: 1em;}
|
||
|
|
sup { font-size: 75%; }
|
||
|
|
abbr, acronym { }
|
||
|
|
hr { }
|
||
|
|
strong { font-weight: bolder; font-size: 95%;}
|
||
|
|
em { font-style: italic;}
|
||
|
|
|
||
|
|
/* Presentation des lignes de code */
|
||
|
|
code, pre { font-family: "lucida monospace", monospace; color: #333;}
|
||
|
|
pre { overflow: auto; background: #fff; padding: 0; margin: 0 auto;
|
||
|
|
border: 1px dashed #bbb; width: 90%; }
|
||
|
|
pre:before { content: "code"; display: block; background: #eee; margin: 0; padding-left: 8px;
|
||
|
|
margin-bottom: 4px;}
|
||
|
|
pre * { padding: 0 8px; line-height: 1.3;}
|
||
|
|
|
||
|
|
/* Comportement des liens */
|
||
|
|
a { text-decoration: none; color: #ce2155; }
|
||
|
|
a:link, a:visited {color:#ce2155;}
|
||
|
|
a:visited { }
|
||
|
|
a:hover { border-bottom: 1px solid;}
|
||
|
|
a:active, a:focus { }
|
||
|
|
a[hreflang]:after { content: "\0000a0[" attr(hreflang) "]"; font-size: .85em; color: #999; }
|
||
|
|
|
||
|
|
|
||
|
|
/* ---------------------------------------------------------
|
||
|
|
NAVIGATIONS - CLASS COMMUNES
|
||
|
|
---------------------------------------------------------- */
|
||
|
|
#navlinks { text-align: right; }
|
||
|
|
#navlinks a { color: #999; }
|
||
|
|
.feed { background: transparent url(img/feed.png) no-repeat 0 2px;
|
||
|
|
padding-left: 14px; }
|
||
|
|
#content-info { margin-bottom: 3em; padding-bottom: 8px;
|
||
|
|
border-bottom: 1px solid #f60; }
|
||
|
|
#content-info h2 { margin-bottom: .5em; }
|
||
|
|
|
||
|
|
/* ---------------------------------------------------------
|
||
|
|
BILLETS
|
||
|
|
---------------------------------------------------------- */
|
||
|
|
.post { margin-bottom: 2em; padding-bottom: 1em; border-bottom: 1px solid #ddd; }
|
||
|
|
.day-date { color: #999;}
|
||
|
|
.post-title {font-weight: bold; color: #f60;}
|
||
|
|
.post-title a:link, .post-title a:visited { color: #21aace;font-weight: bold; }
|
||
|
|
|
||
|
|
.post-info { padding-left: 12px; background: transparent url(img/infos.gif) no-repeat 0 2px;
|
||
|
|
font-size: .95em; color: #999; margin-bottom: 0;}
|
||
|
|
.post-tags { margin-left: 0;}
|
||
|
|
.post-tags li { display: inline; padding-right: 8px;}
|
||
|
|
|
||
|
|
.post-excerpt, .post-content { line-height: 1.4; margin-top: 1.5em;}
|
||
|
|
.post blockquote {background: #EAF6C4; padding: 1px 8px; margin: 1em 0;}
|
||
|
|
.post blockquote:before { content: open-quote; font-weight: bold; font-size: 2.5em;
|
||
|
|
line-height: 1.3em; color: #999; margin: 0; padding: 0;}
|
||
|
|
.post blockquote:after { content: close-quote; font-weight: bold; font-size: 2.5em;
|
||
|
|
line-height: 1.3em; color: #999; margin: 0; padding: 0;}
|
||
|
|
.post blockquote p { margin: 0; padding: 0;}
|
||
|
|
.footnotes { }
|
||
|
|
|
||
|
|
a.read-it { color: #f60;}
|
||
|
|
a.read-it:after { content: "\0000a0\27A2"; }
|
||
|
|
.post-info-co { font-size: .9em; text-align: right;}
|
||
|
|
.post-info-co span { color: #fff;}
|
||
|
|
.post-info a:link, .post-info-co a:link, .post-info a:visited, .post-info-co a:visited,
|
||
|
|
.post-tags a:link, .post-tags a:visited { color: #666; }
|
||
|
|
.comment_count { background: transparent url(img/ico-comment.png) no-repeat; padding-left: 14px; }
|
||
|
|
.ping_count { background: transparent url(img/ping.gif) no-repeat; padding-left: 14px; }
|
||
|
|
|
||
|
|
|
||
|
|
/* -------------------------------------------------------------
|
||
|
|
SIDEBAR
|
||
|
|
---------------------------------------------------------- */
|
||
|
|
#sidebar h2 { color: #aace21; font-weight: bold; font-size: 1.2em; margin-bottom: .33em; }
|
||
|
|
#sidebar h3 { font-size: 1.05em; margin-bottom: .25em; }
|
||
|
|
#sidebar a:link, #sidebar a:visited { color: #666; }
|
||
|
|
#sidebar ul { margin: 0; }
|
||
|
|
|
||
|
|
#search { }
|
||
|
|
#search #q { background: #F7FAEB; width: 10em; line-height: 1.8;}
|
||
|
|
#search .field input { margin: 0;}
|
||
|
|
.syndicate ul { list-style-type: none; padding: 0; }
|
||
|
|
.syndicate ul li { padding: 0; background: transparent; }
|
||
|
|
|
||
|
|
/* -------------------------------------------------------------
|
||
|
|
TRACBACKS ET COMMENTAIRES
|
||
|
|
---------------------------------------------------------- */
|
||
|
|
#pings h3, #comments h3, #pr h3, #comment-form h3 {
|
||
|
|
color: #aace21; margin-top: 2em; }
|
||
|
|
#pings, #comments, #pr, #comment-form {}
|
||
|
|
#comments dt, #pings dt { background: transparent url(img/personal.gif) no-repeat 0 3px;
|
||
|
|
padding: 3px 0 0 18px; color: #666; margin-top: 1.5em; margin-bottom: .25em; }
|
||
|
|
#comments dd, #pings dt { background: #C4EBF6; padding: 4px; }
|
||
|
|
.comment-number { font-size: 1.2em;}
|
||
|
|
|
||
|
|
/* Formulaires
|
||
|
|
-------------------------------------------------------- */
|
||
|
|
fieldset { }
|
||
|
|
#comment-form input { padding: 2px; }
|
||
|
|
input[type] { background: #f5f5f0; border: 1px solid #ddd;}
|
||
|
|
input[type=submit] { background: #aace21; color: #fff;}
|
||
|
|
input[type=reset] { }
|
||
|
|
input[type=submit]:hover { background: #666; }
|
||
|
|
textarea[name] { }
|
||
|
|
p.field { margin-bottom: .5em; line-height: 1.6;}
|
||
|
|
p.field label { clear: left; display: block; width: 10em; text-align: right; float: left; color: #666;}
|
||
|
|
p.field input { margin-left: 1em;}
|
||
|
|
p.form-help { }
|
||
|
|
p.validate { }
|
||
|
|
textarea#c_content { background: #f5f5f0; border: 1px solid #ddd; width: 95%;}
|
||
|
|
|
||
|
|
/* Error messages
|
||
|
|
-------------------------------------------------------- */
|
||
|
|
.error { border: 1px solid red; background: #ccc; padding: 0.5em; }
|
||
|
|
.error ul { padding-left: 20px; }
|
||
|
|
.error li { list-style: square; }
|
||
|
|
|
||
|
|
/* -------------------------------------------------------------
|
||
|
|
OTHER CONTEXTS
|
||
|
|
---------------------------------------------------------- */
|
||
|
|
.dc-archive .content-inner h3 { clear: left; float: left; width: 3em;
|
||
|
|
margin-top: 0; font-size: 2em; color: #21aace; }
|
||
|
|
.dc-archive .content-inner ul { margin-left: 5.5em; margin-bottom: 3em; padding-top: .5em; }
|
||
|
|
.dc-archive-month .content-inner h2 { margin: 0; font-size: 1.2em; }
|
||
|
|
.dc-archive-month .content-inner .day-date {
|
||
|
|
margin-top: 2em; margin-bottom: .25em; color: #f60; }
|
||
|
|
/* -------------------------------------------------------------
|
||
|
|
BONUS
|
||
|
|
---------------------------------------------------------- */
|
||
|
|
.clearer { clear: both; }
|
||
|
|
.box-center { margin-left :auto; margin-right: auto; }
|
||
|
|
.text-center { text-align: center; }
|
||
|
|
.text-right { text-align: right; }
|
||
|
|
.text-left { text-align: left; }
|
||
|
|
.petites-cap { font-size: 0.82em; text-transform: uppercase; }
|
||
|
|
.petit { font-size: x-small; }
|
||
|
|
.text-justify { text-align: justify; }
|