source: spip-zone/_galaxie_/code.spip.net/spip-zora/theme/css/theme.less @ 75110

Last change on this file since 75110 was 75110, checked in by marcimat@…, 8 years ago

Affichage plus léger des todo qui sont terminées ainsi que de celles qui nécessitent une action

File size: 11.6 KB
Line 
1@import "css/variables.less";
2@import "css/mixins.less";
3
4/* typo */
5body {
6    font-size:90%;
7    /*font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;*/
8    font-family:Georgia, Cambria, Times New Roman, Times, serif;
9}
10
11code {
12    font-family:"Courier New", Courier, monospace;
13    font-size: 0.9em;
14    padding: 0;
15}
16pre {white-space: pre;}
17
18
19/* [spip] spiperies */
20.spip_code {
21    background-color: transparent;
22    border: none;
23    border-radius: none;
24    color: #308999;
25    font-size: 0.9em;
26    padding: 0;
27}
28.spip_cadre {
29    font-size: 0.9em;
30}
31
32/* liens */
33/* violet #B476AF , 91548C */
34a {
35    color: #91548C;
36}
37a:hover {
38    color: #6D446A;
39}
40
41/* titraille */
42/*
43h1,.h1,.h1-like { font-size: 2em; line-height: 1em; margin-bottom: .5em; }
44h2,.h2,.h2-like { font-size: 1.5em; line-height: 1em; margin-bottom: .5em; }
45h3,.h3,.h3-like { font-size: 1.25em; line-height: 1em; margin-bottom: .5em; }
46h4,.h4,.h4-like { font-size: 1.1em; line-height: 1.1em; margin-bottom: .5em; }
47h5,.h5,.h5-like { font-size: 1em; font-weight: bold; margin-bottom: .5em; }
48h6,.h6,.h6-like { font-size: 1em; font-weight: bold; }
49
50h1 small,.h1 small, .h1-like small { font-size: 0.65em; }
51h2 small,.h2 small, .h2-like small { font-size: 0.70em; }
52h3 small,.h3 small, .h3-like small { font-size: 0.80em; }
53*/
54h1 small {
55        color:#555;
56        display: block;
57}
58
59h2.intertitre {
60    margin-top:2em; /*color:#91548C;*/
61    clear:both;
62}
63
64/* [spip] compatibilité des apis */
65em.compatibilite {float: left;}
66
67/* personnalisations */
68
69/* entetes */
70.header {
71    background-color: #660e5c;
72    padding: 0;
73    color:white;
74
75    background: -moz-linear-gradient(250deg, #660e5c 0%, #a887b8 100%) repeat scroll 0 0 transparent;
76
77    position: relative;
78    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4), 0 0 30px rgba(0, 0, 0, 0.075);
79}
80.subhead h1 {
81    font-size:40px;
82    margin-bottom:0; margin-top:0;
83    padding:34px 0 10px 150px; 
84    font-weight: normal;
85}
86.subhead h1 a {color:white;}
87.subhead h1 a:hover {color:white; text-decoration:none;}
88.subhead .titre, .subhead .accueil {position:relative;}
89.subhead h1 span {
90    position:absolute;
91    top:8px; left:-20px;
92    width:176px; height:122px; display:block;
93    background:url(../images/logo.png) no-repeat top left;
94}
95@media (max-width: 767px) {
96        .subhead h1 {
97                font-size:30px;
98                padding:34px 0 10px 100px; 
99        }
100        .subhead h1 span {
101                background:url(../images/logo_petit.png) no-repeat top left;
102                width:100px; height:69px; left:-10px;
103        }
104}
105@media (max-width: 580px) {
106        .subhead h1 {
107                font-size:20px;
108                padding:34px 0 10px 60px; 
109        }
110        .subhead h1 span {
111                background:url(../images/logo_mini.png) no-repeat top left;
112                width:60px; height:42px; left:-5px; top:20px;
113        }
114}
115
116/* barre de navigation */
117.navbar .babarre {margin-left:150px;}
118@media (max-width: 767px) {
119        .navbar .babarre {margin-left:0px;}
120}
121#nav.navbar .nav {
122    margin-left:135px; /*padding: 10px 20px;*/
123}
124#nav.navbar .nav .separateur {
125    border-left:1px solid #ccc;
126}
127
128/* [spip] bloc principal */
129.principal { margin-top:3em; }
130
131/* [spip] bloc de commentaires */
132.comments { margin-top: 4em; }
133
134/* pied de page */
135.footer {
136    background-color: #F5F5F5;
137    border-top: 1px solid #E5E5E5;
138    margin-top: 70px;
139    padding: 40px 0;
140}
141.footer .generator { right:2em; top:40px; }
142
143
144/* barre de menu latérale */
145.menunav {
146    background-color: #FFFFFF;
147    border-radius: 6px 6px 6px 6px;
148    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.067);
149    margin: 15px 0 1px;
150    padding: 0;
151}
152
153.menunav > li:first-child > a {
154    border-radius: 6px 6px 0 0;
155}
156.menunav li > a {
157    padding: 8px 14px;
158    display: block;
159    margin: 0 0 -1px;
160    border: 1px solid #E5E5E5;
161}
162/* colorer les premiers dossiers */
163.menunav > .groupe > a {background:#f3f3f3;}
164.menunav > .groupe > a:hover {background:#eee;}
165
166.menunav > .active > a,
167.menunav > .active > a:hover {
168    background-color: #B476AF;
169    color: #FFFFFF;
170}
171
172.menunav ul > li > a { padding-left:34px;}
173.menunav ul ul > li > a { padding-left:54px; }
174.menunav ul ul ul > li > a { padding-left:74px; }
175.menunav ul {
176    padding: 0;
177}
178
179.nav-list > .active > a, .nav-list > .active > a:hover, .nav-list > .active > a:focus {
180    background-color:#B476AF;
181}
182
183/* fil d'ariane */
184.breadcrumb {margin-bottom:2em; margin-top: 0em;}
185
186/* blocs dépliables */
187.accordion-heading .description {display:block; color:#666; margin-top:.2em;}
188.accordion-heading .description:hover {text-decoration:none;}
189.accordion.espace .accordion-group {margin-bottom:1em;}
190.accordion .accordion-group .accordion-heading a { text-decoration:none; }
191.accordion .accordion-group .accordion-heading a strong { font-size:110%;}
192.accordion .accordion-group .accordion-heading a:hover { box-shadow: 0 0 4px #B476AF; }
193.accordion .accordion-group.active .accordion-heading a:focus { outline: none; }
194.accordion .active {
195    border-color:#B476AF; /* #bbb #ccc */
196  -webkit-box-shadow: 0 0 4px #B476AF;
197     -moz-box-shadow: 0 0 4px #B476AF;
198          box-shadow: 0 0 4px #B476AF;
199}
200.accordion .active .accordion-heading {background:#B476AF; border-radius:4px 4px 0 0; color:white}
201.accordion .active .accordion-heading a {color:white;}
202.accordion .active .accordion-heading .description {color:white;}
203.accordion .active .accordion-inner{padding:2em 1em;}
204.accordion .active .accordion-inner .presentation { margin-bottom:2em; }
205
206.accordion .accordion-heading.api a {background:url('../images/api-48.png') top right no-repeat;}
207.accordion .accordion-heading.deprecated a {background:url('../images/deprecated-48.png') top right no-repeat;}
208
209
210/* coloration de la signature d'une fonction */
211.coloration .nom {font-weight:bold; color:#FF6600;}
212.coloration .parenthese {color:#BA4000;}
213.coloration .return {padding-right:.5em;}
214.coloration .var {padding-right:.5em;}
215.coloration .type, .coloration .type a {color:#73AB35; font-style:italic;}
216.coloration .sep {color:#527B25; }
217.coloration .variable {color:#C96DB5; }
218.coloration .affectation {color:#8982FF;}
219.coloration .defaut {color:#655CFF;}
220
221/* [spip] article d'api */
222.main .api > div {
223    background-color: #F9F6E5;
224    border: 1px solid #EFC571;
225    border-radius: 4px 4px 4px 4px;
226    margin-bottom: 20px;
227    padding: 8px 35px 8px 14px;
228    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
229}
230.main .api > div h2 { color: #A07A3A; }
231/* espacer les paramètres des fonctions */
232.main .api ul.spip li { margin-bottom:1em;}
233
234
235/* liste résumées, mais avec sous-titre */
236.entry-title .sous_titre {color:#505050; font-size:85%; display:block; margin-top:2px;}
237.article.entry .entry-title {
238    margin-bottom: 0px;
239}
240.api_fonctions.entry .entry-title {
241    margin-bottom: 0px;
242}
243
244/* blocs d'information dans un flux de texte */
245.warning {
246    background-color: #FFF1B0;
247    border: 1px solid #FFB522;
248    color: #413726;
249    text-shadow: none;
250}
251
252.info {
253    background-color: #D9EDF7;
254    border: 1px solid #66B1C2;
255    color: #162B34;
256    text-shadow: none;
257}
258
259/* cartouches */
260.cartouche .publication, .hero-unit .publication {
261    opacity: 0.7;
262    text-align:right;
263}
264.article.entry .entry-content,
265.api_fonction.entry .entry-content{
266        color:#444;
267        margin-bottom:0;
268}
269.long .publication { opacity: 0.7; }
270.chapo {
271    font-weight:normal;
272    font-size:120%;
273}
274
275/* [spip] dates des articles et auteurs, déplacées au pied */
276footer.publication {
277        margin-top:10em;
278        background:#eee;
279        border:1px solid #ddd;
280        .border-radius(@inputBorderRadius);
281        padding:1em;
282}
283footer.publication p {margin-bottom:0;}
284
285/* ajax */
286.chargement {background:#f6f6f6 url('../images/loader-32.gif') 10px 10px no-repeat;
287        margin-top:5px;
288        border: 1px solid #EEEEEE;
289        margin: 1em;
290        padding:18px 8px 2px 50px;
291        min-height: 32px;
292}
293
294/* colonnes */
295.colonnes {
296        -moz-column-count: 3;
297        -webkit-column-count: 3;
298        column-count: 3;
299        -moz-column-gap: 20px;
300        -webkit-column-gap: 20px;
301        column-gap: 20px;
302}
303@media (max-width: 979px) {
304        .colonnes {
305                -moz-column-count: 2;
306                -webkit-column-count: 2;
307                column-count: 2;
308        }
309}
310@media (max-width: 767px) {
311        .colonnes {
312                -moz-column-count: 1;
313                -webkit-column-count: 1;
314                column-count: 1;
315                -moz-column-gap: 0;
316                -webkit-column-gap: 0;
317                column-gap: 0;
318        }
319}
320
321/* hero (presentation, mise en exergue) */
322.hero-unit {
323    padding:1.5em 1.5em .5em;
324    font-size:1.1em;
325    background-color: #7a4482;
326    color:white;
327}
328.hero-unit a { color:#fff; border-bottom:1px dotted #fff;}
329.hero-unit a:hover { color:#fff; border-bottom:1px solid #fff; text-decoration:none;}
330
331
332/* [spip] formulaires */
333form input.text { width: 100%;}
334form textarea { width: 100%;}
335textarea#champ_docblock {
336    font-family:"Courier New", Courier, monospace;
337}
338.code_original { font-size:90%; }
339
340.btn-primary {
341    background-color: #B459C1;
342    background-image:linear-gradient(to bottom, #B459C1, #7a4482)
343}
344.btn-primary:hover, .btn-primary:active, .btn-primary.active, .btn-primary.disabled, .btn-primary[disabled] {
345    background-color: #7a4482;
346    color: #FFFFFF;
347}
348
349
350/** [spip] coloration code */
351.coloration_code {
352  .cadre_download { text-align:right; margin:-9px 5px 9px 0; }
353}
354textarea.spip_cadre { cursor:text; }
355.coloration_code .spip_cadre {
356  #font > .shorthand(@baseFontSize,normal,@baseLineHeight); // Set size, weight, line-height here
357  font-family: @baseFontFamily;
358  display: inline-block;
359  padding: 6px 8px;
360  font-size: @baseFontSize;
361  line-height: @baseLineHeight;
362  color: @gray;
363  .border-radius(@inputBorderRadius);
364  vertical-align: middle;
365
366  background-color: #f3f3f3; /*@inputBackground;*/
367  border: 1px solid #dddddd;
368  .border-radius(3px);
369  .box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
370  .transition(~"border linear .2s, box-shadow linear .2s");
371
372  .box-shadow(inset 0 1px 2px rgba(0,0,0,.025));
373
374  /* http://forum.alsacreations.com/topic-4-59824-1-Mise-en-forme-liste-ol.html */
375  ol {
376    border: 1px solid #dddddd;
377    .border-radius(0 5px 5px 0);
378    padding-left:0;
379    counter-reset: section; /* on instancie un compteur */
380    margin-left: 2em;
381    margin-bottom:0;
382  }
383  ol li:before {
384    display: block;
385    float: left;
386    content: counter(section) ""; /* on utilise notre compteur */
387    counter-increment: section; /* on ajoute +1 au compteur */
388    width: 3em;
389    margin-left:-4em;
390    text-align:right;
391  }
392  ol li { list-style-type: none; padding:2px 5px; margin:0; background:white}
393  ol li:first-child { .border-radius(0 5px 0 0); }
394  ol li:last-child { .border-radius(0 0 5px 0); }
395}
396
397/* coloration des api spip */
398.main .api .coloration_code .spip_cadre {
399        /*background:white; border:1px solid #eee;*/
400        padding: 0; border:none;
401        ol {
402                padding:.5em;
403                list-style-type:none; margin:0; 
404                border: 1px solid #DDDDDD;
405                .border-radius(5px);
406                background:white;
407                /* pas de numérotation */
408                li:before { content: "";}
409        }
410}
411
412
413/* décoration des tableaux */
414table { width:100%; margin:2em 0;}
415table td, table th { padding: 0.3em 0.4em; }
416table tr { border-bottom:  1px dotted #ccc; }
417table tr:last-child { border-bottom:  1px solid #cfcfcf; }
418table caption { border-bottom:  1px solid #cfcfcf; padding:.2em; }
419table thead tr { border-bottom:  1px solid #cfcfcf; background:#f6f6f6; }
420
421/* [spip] décoration des todo */
422table.todolist th { text-align: left; }
423table.todolist td, table.todolist th {
424    padding: 0.3em 0.4em;
425}
426table.todolist td.rang {
427    opacity: 1; color:#aaa;
428}
429table.todolist tbody > tr:hover > td, table.spip tbody > tr:hover > th {
430    background-color: #f5f5f5;
431}
432table.todolist td.statut, table.todolist th.statut { width:20px; text-align:center; }
433table.todolist td.rang, table.todolist th.rang { width:30px;}
434
435table.todolist tr.termine td del { text-decoration:none; }
436table.todolist tr.alerte { background-color: #FBE3E4; }
437table.todolist tr.alerte .titre span.majeure { background-color: transparent; color:#333; }
438table.todolist tbody > tr.alerte:hover td,
439table.todolist tbody > tr.alerte:hover th { background-color: #FFBFBF; }
440
Note: See TracBrowser for help on using the repository browser.