source: spip-zone/_plugins_/details_interface_3/squelettes/details.css.html @ 67436

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

petits détails; couleur et survol des boutons supprimer

File size: 14.3 KB
Line 
1#HTTP_HEADER{Content-Type: text/css; charset=iso-8859-15}
2#HTTP_HEADER{Vary: Accept-Encoding}
3#CACHE{0}
4
5body {
6        font-family: 'Lucida Grande', Tahoma, Ubuntu, Arial, Verdana, sans-serif;
7        background-color: #f9f9f9;
8        background-color: #[(#ENV{claire}|couleur_luminance{0.01}|couleur_saturation{0.015})];
9}
10#bando_identite {
11        font-size: 90%;
12        padding: 1px 0px;
13        background-color: #[(#ENV{foncee}|couleur_luminance{0.15})];
14
15        color: #[(#ENV{foncee}|couleur_luminance{0.6})];;
16        a, strong {
17                color: #[(#ENV{foncee}|couleur_luminance{0.7})];;
18               
19                . :hover {
20                        color: #333;
21                }
22        }
23}
24#bando_haut {
25        ul.deroulant {
26                li {
27                        a {
28                                font-weight: normal;
29                                text-decoration: none;
30                                color: #666;
31                               
32                                . :hover {
33                                        color: black;
34                                }
35                        }
36                        ul {
37                                li {
38                                        background-color: transparent;                         
39                                }
40                                . > li:last-child {
41                                        -spip-border-bottom-left-radius: 5px;
42                                        -spip-border-bottom-right-radius: 5px;
43                                }
44                                li.actif, li.actif_tempo {
45                                        background-color: #[(#ENV{foncee}|couleur_luminance{0.15})];
46                                        -spip-box-shadow:  0px 0px 10px #[(#ENV{foncee}|couleur_luminance{0.25})] inset;
47                                        a:hover {
48                                                background-color: transparent;
49                                        }
50                                }
51                        }
52                }
53        }
54}
55               
56#bando_navigation {
57        ul {
58                li {
59                        line-height: 125%;
60                       
61                        ul {
62                                min-width: 170px;
63                                -spip-border-bottom-left-radius: 5px;
64                                -spip-border-bottom-right-radius: 5px;
65                                background-color: white;
66
67                                a {
68                                        padding: 0.5em;
69                                }
70
71                        }
72                       
73                }
74        }
75}
76#bando_navigation ul.deroulant > li {min-width: 95px;}
77.large #bando_navigation ul.deroulant > li {min-width: 105px;}
78
79.large #contenu {
80        margin-left: 24px;
81        width: 525px;
82}
83#bando_outils {
84        border-top: 1px solid #999;
85        background-color: #444;
86        -spip-gradient: top, #555555, #333333;
87       
88        ul.deroulant {
89                font-size: 0.9em;
90                line-height: 120%;
91        }
92}
93.navigation_avec_icones {
94        #bando_navigation {
95                ul.deroulant {
96                        > li {
97                                > a {
98                                        font-size: 90%;
99                                       
100                                        . :hover {
101                                                background-color: ##ENV{foncee};
102                                        }
103                                }
104                        }
105                }
106        }
107        #bando1_menu_accueil {
108                background-image: url("#CHEMIN{accueil-48.png}");
109        }
110        #bando1_menu_edition {
111                background-image: url("#CHEMIN{edition-48.png}");
112        }
113        #bando1_menu_publication {
114                background-image: url("#CHEMIN{publication-48.png}");
115        }
116        #bando1_menu_activite {
117                background-image: url("#CHEMIN{suivi-activite-48.png}");
118        }
119        #bando1_menu_squelette {
120                background-image: url("#CHEMIN{squelettes-48.png}");
121        }
122        #bando1_menu_administration {
123                background-image: url("#CHEMIN{maintenance-48.png}");
124        }
125        #bando1_menu_configuration {
126                background-image: url("#CHEMIN{configuration-48.png}");
127        }
128}
129
130
131.simple .inner {
132        -spip-border-radius: 5px;
133        border: 1px solid #e7e7e7;
134
135       
136        . :hover {
137                        -spip-box-shadow:  0px 0px 2px #dddddd;
138        }
139       
140        .hd {
141                background-color: #f0f0f0;
142                color: #444;
143                text-shadow: white 0px 1px 0px;
144                font-size: 0.85em;
145                line-height: 120%;
146        }
147}
148#contenu .fiche_objet {
149        .propose .inner {
150                border: 0;
151                -spip-border-radius: 0;
152                background-color: #ffde00;
153                margin: 0px -15px;
154               
155                p {
156                        margin: 0;
157                }
158        }
159
160
161        > .inner {
162                border: 0px;
163                -spip-box-shadow:  0px 0px 20px #e0e0e0;
164
165               
166                .hd {
167                        background-color: transparent;
168                        padding: 25px 15px 10px 15px;
169                       
170                        .surtitre, .soustitre {
171                                font-size: 1.6em;
172                                line-height: 125%;
173                        }
174                        .surtitre {
175                                margin-bottom: 8px;
176                        }
177                        .soustitre {
178                                margin-top: 8px;
179                        }
180                }
181                .bd {
182                        padding: 15px;
183                }
184        }
185        .editer_urls {
186                margin: 20px 0px 0px 0px;
187                .formulaire_editer_url_objet  {
188                        margin: 10px -15px 0px -15px;
189                }
190                .formulaire_editer_url_objet, .boutons {
191                        -spip-border-radius: 0px;
192                }
193        }
194}
195h1, .h1 {
196        font-size: 2em;
197        line-height: 125%;
198}
199
200
201.sous-rub {
202        .inner {
203                border: 0;
204                background-color: #[(#ENV{foncee}|couleur_luminance{0.15})];
205                -spip-box-shadow:  0px 0px 10px #[(#ENV{foncee}|couleur_luminance{0.20})] inset;
206
207                . :hover {
208                -spip-box-shadow:  0px 0px 10px #[(#ENV{foncee}|couleur_luminance{0.20})] inset;
209                }
210               
211                .hd {
212                        background-color: transparent;
213                        font-size: 100%;
214                }
215                .bd {
216                        padding: 0;
217                       
218                        .liste-items {
219                                font-size: 0.85em;
220                                line-height: 120%;
221                               
222                                .item {
223                                        padding: 0px;
224                                                                               
225                                        a {
226                                                padding: 5px 18px;
227                                                display: block;
228                                        }
229                                       
230                                        . :hover {
231                                                background-color: #[(#ENV{foncee}|couleur_luminance{0.25})];
232                                                a {
233                                                        color: black;
234                                                }
235                                        }
236                                }       
237                                > .item:last-child {
238                                        border-bottom: 0px;
239                                }
240                        }
241                }
242        }
243}
244
245
246.liste-objets {
247        -spip-border-top-left-radius: 5px;
248        -spip-border-top-right-radius: 5px;
249        position: relative;
250        z-index: 1;
251        display: block;
252
253        . :hover {
254                -spip-box-shadow:  0px 0px 0px #dddddd;
255        }
256        . :before, . :after {
257          -spip-box-shadow: 0 15px 10px rgba(0, 0, 0, .5);
258          -spip-transform: rotate(-3deg);
259          position: absolute;
260          left: 10px;
261          bottom: 20px;
262          z-index: -1;
263          width: 50%;
264          max-width: 300px;
265          height: 20%;
266          content: "";
267        }
268        . :after {
269          -spip-transform: rotate(3deg);       
270          left: auto;
271          right: 10px;
272        }
273       
274        . .selection-articles {
275                table {
276                        background-color: white;
277                        border-bottom: 1px solid #ccc;
278                }
279                form {
280                        background-color: #[(#ENV{claire}|couleur_luminance{0.25})];
281                }
282        }
283       
284        table {
285                background: transparent;
286               
287                caption {
288                        background: #e5e5e5;
289                        -spip-gradient: top, #f0f0f0, #e0e0e0;
290                       
291                        strong.caption {
292                                padding-top: 7px;
293                                padding-bottom: 7px;
294                                color: #444;
295                                background-color: transparent;
296                                text-shadow: white 0px 1px 0px;
297                                font-size: 0.85em;
298                                line-height: 120%;
299                        }
300                }
301                thead {
302                                font-size: 0.85em;
303                                line-height: 120%;
304                               
305                                th {
306                                        padding-top: 5px;
307                                        padding-bottom: 5px;
308                                }
309                }
310                tbody > tr:last-child td {
311                        border-bottom: 0;
312                }
313                tr {
314                        td {
315                                line-height: 125%;
316                        }
317                }
318        }
319}
320.liste-objets-lies {
321        . .auteurs, . .mots {
322                thead {
323                        display: none;
324                }
325        }
326}
327.icone, .en-edition {
328        line-height: 120%;
329}
330
331div.titrem, h3.titrem {
332        font-size: 1em;
333        line-height: 125%;
334        padding-top: 7px;
335        padding-bottom: 7px;
336}
337
338
339.icone {
340        a, .submit {
341                img {
342                        -spip-transition-property: background-color;
343                        -spip-transition-duration: 0.2s;
344                        border: 0;
345                        background-color: #eee;
346                        -spip-border-radius: 5px;
347                        padding: 7px;
348                }               
349                . :hover {
350                        img {
351                                background-color: #aaa;
352                        }
353                }
354        }
355}
356
357#navigation {
358        .formulaire_spip {
359                border-color: ##ENV{claire};
360                font-size: 90%;
361                line-height: 120%;
362
363                h3.titrem {
364                        background-color: ##ENV{claire};
365                        color: white;
366                        padding-top: 5px;
367                        padding-bottom: 5px;
368                }
369                input.text, input.password, textarea {
370                        font-size: 0.9em;
371                        line-height: 125%;
372                        padding: 3px;
373                }
374               
375                p.boutons {
376                        input.submit {
377                                padding: 2px 5px;
378                        }
379                }
380        }
381}
382.formulaire_spip {
383        margin: 1.3em 0em;
384        -spip-border-radius: 5px;
385       
386        h3.titrem {
387                background-color: ##ENV{foncee};
388                color: white;
389        }
390       
391        input.text, input.password, textarea {
392                border: 1px solid #e9e9e9;
393                padding: 5px;
394                font-size: 1.1em;
395                -spip-border-radius: 4px;
396        }
397        img.ui-datepicker-trigger {
398                -spip-border-radius: 0px;
399        }
400
401        li fieldset {
402                input.text, input.password, textarea {
403                        border: 1px solid #e9e9e9;
404                }
405        }
406        label {
407                color: #777;
408                font-size: 90%;
409                line-height: 120%;
410        }
411        label[for] {
412                cursor: pointer;
413        }
414        .explication {
415                padding: 5px 10px;
416                font-size: 90%;
417                line-height: 125%;
418                color: #666;
419                -spip-border-top-left-radius: 5px;
420                -spip-border-top-right-radius: 5px;
421                background-color: #e9e9e9;
422                -spip-gradient: top, #e9e9e9, #e0e0e0;
423
424               
425                + input.text, + textarea, +input.password, +div.choix:first-of-type {
426                        margin-top: 0px;
427                        -spip-border-top-left-radius: 0px;
428                        -spip-border-top-right-radius: 0px;
429                }
430        }
431        div.choix {
432                background-color: white;
433                padding: 3px 10px;
434                border: 1px solid #e9e9e9;
435                border-top: 0px;
436                border-bottom: 0px;
437               
438                + div.choix {
439                        padding-top: 0px;
440                }
441
442                + .explication {
443                        margin-top: 0px;
444                        -spip-border-top-left-radius: 0px;
445                        -spip-border-top-right-radius: 0px;
446                }
447        }
448       
449        div.choix:last-of-type {
450                -spip-border-bottom-left-radius: 5px;
451                -spip-border-bottom-right-radius: 5px;
452                border-bottom: 1px solid #e9e9e9;
453        }
454        div.choix:first-of-type {
455                -spip-border-top-left-radius: 5px;
456                -spip-border-top-right-radius: 5px;
457                border-top: 1px solid #e9e9e9;
458        }
459        .boutons {
460                -spip-border-bottom-left-radius: 5px;
461                -spip-border-bottom-right-radius: 5px;
462               
463                input.submit {
464                        background-color: ##ENV{claire};
465                        color: #[(#ENV{foncee}|couleur_luminance{0.7})];
466                        -spip-border-radius: 5px;
467                        border: 0;
468                        padding: 3px 7px;
469                        font-size: 90%;
470                       
471                        . :hover,. :focus {
472                                background-color: ##ENV{foncee};
473                                color: white;
474                                -spip-box-shadow:  0px 0px 4px #[(#ENV{foncee}|couleur_luminance{0.6})];
475                        }
476                       
477                        . :active {
478                                background-color: #[(#ENV{foncee}|couleur_luminance{0.7})];
479                        }
480                }
481        }
482
483        .toggle_box_link {
484                visibility: hidden;
485                z-index: 1;
486                font-size: 10px;
487                color: ##ENV{lien};
488               
489                button {
490                        font-size: 10px;
491                        color: ##ENV{lien};
492                }
493               
494        }
495        . :hover {
496                .toggle_box_link {
497                        visibility: visible;
498                }
499        }
500
501}
502
503#chemin {
504        font-size: 85%;
505        line-height: 120%;
506        .bouton_deplacer {
507                font-size: 10px;
508                color: ##ENV{lien};
509                visibility: hidden;
510        }
511       
512        . :hover {
513                .bouton_deplacer {
514                        visibility: visible;
515                }
516        }       
517}
518.box {
519        .inner {
520                -spip-border-radius: 5px;
521        }
522}
523.note, .notice {
524        border: 0;
525}
526.box_mediabox, .largeur {
527        .formulaire_spip.formulaire_recherche  {
528                position: relative;
529                border: 0px;
530                width: 170px;
531                background-color: transparent;
532               
533                input.text {
534                        background-color: #777;
535                        border: 0;
536                        border: 1px solid #999;
537                        font-size: 0.9em;
538                        -spip-border-radius: 4px;
539                        padding-right: 22px;
540                        width: 100%;
541                        -spip-box-sizing: border-box;
542                       
543                        . :focus {
544                                background-color: #333;
545                                border-color: white;
546                                -spip-box-shadow:  0px 0px 4px #ffffff;
547                                color: white;
548                                outline: none;
549                        }
550                }
551                input.image {
552                        position: absolute;
553                        top: 0px;
554                        right: 1px;
555                }
556        }
557}
558.entete-formulaire {
559        -spip-border-top-left-radius: 5px;
560        -spip-border-top-right-radius: 5px;
561       
562        . + .formulaire_spip {
563                -spip-border-top-left-radius: 0px;
564                -spip-border-top-right-radius: 0px;
565        }
566}
567.popin .formulaire_spip {
568                -spip-border-top-left-radius: 0px;
569                -spip-border-top-right-radius: 0px;
570}
571
572#navigation > .formulaire_spip {
573        margin: 2em 0em;
574}
575
576#wysiwyg, .preview {
577        padding: 0;
578        font-size: 1.2em;
579        line-height: 145%;
580        font-family: Cambria, Georgia, 'Times New Roman', Times, serif;
581       
582        text-align: justify;
583        text-justify:newspaper;
584        -spip-hyphens: auto;
585       
586        p {
587                margin: 0.8em 0;
588        }
589        h3.spip {
590                margin-top: 2.5em;
591                margin-bottom: 1.8em;
592                font-family: 'Lucida Grande', Tahoma, Ubuntu, Arial, Verdana, sans-serif;
593                font-weight: normal;
594        }
595        .spip_note_ref {
596                vertical-align: super;
597                font-size: 80%;
598                font-family: 'Lucida Grande', Tahoma, Ubuntu, Arial, Verdana, sans-serif;
599        }
600        .contenu_descriptif, .contenu_nom_site {
601                border: 0;
602                background-color: #eee;
603                margin-left: -15px;
604                margin-right: -15px;
605               
606                padding: 10px 15px;
607               
608                .label {
609                        font-family: 'Lucida Grande', Tahoma, Ubuntu, Arial, Verdana, sans-serif;
610                        font-size: 0.8em;
611                        display: block;
612                        margin-bottom: 0.5em;
613                        color: #999;
614                        font-weight: normal;
615                }
616                p {
617                        margin: 0.5em 0em;
618                }
619        }
620        .contenu_nom_site {
621                .label, .nom_site {
622                        display: inline-block;
623                        padding: 0;
624                        margin: 0;
625                }
626        }
627        .contenu_notes {
628                background-color: transparent;
629                border-top: 0px solid #ccc;
630                background-color: #eee;
631                margin-left: -15px;
632                margin-right: -15px;
633               
634                padding: 10px 15px;
635
636                .label {
637                        font-family: 'Lucida Grande', Tahoma, Ubuntu, Arial, Verdana, sans-serif;
638                        display: block;
639                        margin-bottom: 0.5em;
640                        color: #999;
641                        font-weight: normal;
642                }
643                .notes {
644                        p {
645                                margin: 0.5em 0;
646                               
647                                .spip_note_ref {
648                                        margin-left: -28px;
649                                }
650                        }
651                }
652        }
653       
654}
655#text_area {
656        height: 450px;
657        padding: 10px;
658        outline: none;
659        -spip-border-top-left-radius: 0px;
660        -spip-border-top-right-radius: 0px;
661}
662.formulaire_editer_liens .liste-objets tr > .action button {
663        visibility: hidden;
664       
665        font-size: 90%;
666        img {
667                float: none;
668                margin-left: 0px;
669                vertical-align: bottom;
670        }
671}
672.formulaire_editer_liens .liste-objets tr:hover > .action button {
673        visibility: visible;
674}
675.formulaire_spip {
676        button {
677                . .delete {
678                        color: red;
679                       
680                        . :hover, . :focus {
681                                text-decoration: underline;
682                                border: none;
683                        }
684                }
685        }
686}
687
688.logo_du_site {
689        text-align: center;
690}
691.fiche_objet .formulaire_spip {
692        border: 1px solid #ddd;
693       
694        . .formulaire_dater {
695                border: 0;
696                -spip-border-radius: 0;
697                margin-left: -15px;
698                margin-right: -15px;
699               
700                padding: 10px 15px;
701                background-color: #eee;
702
703                label {
704                        font-size: 85%;
705                        font-weight: normal;
706                }
707                input.text {
708                        padding: 3px;
709                }
710                p.boutons {
711                        -spip-border-radius: 0px;
712                        margin: 0px -15px -10px -15px;;
713                }
714        }
715}
716
717.onglets_simple {
718        ul {
719                li {
720                        strong, a {
721                                -spip-border-top-left-radius: 5px;     
722                                -spip-border-top-right-radius: 5px;     
723                        }
724                        strong {
725                                background-color: transparent;
726                                border-bottom-color: #f9f9f9;
727                        }
728                        a {
729                                -spip-opacity: 0.3;
730                               
731                                . :hover, . :focus {
732                                        -spip-opacity: 1;
733                                }
734                        }
735                       
736                }
737        }
738}
739.infos .instituer_objet {
740        border: 0px;
741}
742.en-edition {
743        font-size: 95%;
744        line-height: 120%;
745
746        button.submit {
747                background-color: transparent;
748                border: 0;
749                color: red;
750                cursor: pointer;
751        }
752       
753        .bd {
754                padding: 0;
755                padding-bottom: 5px;
756               
757                .liste-items  {
758                        border-top: 1px solid white;
759                       
760                        li {
761                                border-bottom: 1px solid white;
762                                padding-left: 10px;
763                                padding-right: 10px;
764                               
765                        }
766                }
767        }
768}
769.barre_onglet ul {
770        li {
771                margin-right: 0px;
772                border-left-width: 0px;
773                border-color: #ccc;
774               
775                strong.on {
776                                        background-color: #[(#ENV{foncee})];
777                                        -spip-box-shadow:  0px 0px 10px #[(#ENV{foncee}|couleur_luminance{0.80})] inset;
778               
779                }
780               
781                a {
782                        background-color: #eeeeee;
783                        -spip-gradient: top, #ffffff, #eeeeee;
784                       
785                        . :hover, . :focus {
786                                background-color: white;
787                                -spip-gradient: top, #ffffff, #ffffff;
788                                color: #[(#ENV{foncee}|couleur_luminance{0.7})];
789                        }
790                }
791        }
792        . > li:first-child {
793                border-left-width: 1px;
794        }
795        . > li:first-child, . > li:first-child a {
796                -spip-border-bottom-left-radius: 5px;   
797                -spip-border-top-left-radius: 5px;     
798        }
799        . > li:last-child, . > li:last-child a {
800                -spip-border-bottom-right-radius: 5px; 
801                -spip-border-top-right-radius: 5px;     
802        }
803}
804#portfolios h3  {
805        padding: 7px 10px;
806        background-color: ##ENV{foncee};
807        color: white;
808        -spip-border-top-left-radius: 5px;     
809        -spip-border-top-right-radius: 5px;     
810       
811}
812
813.navigation .sous_navigation .item {
814        padding: 0px;
815        a {
816                margin: 0;
817                padding: 10px;
818                padding-left: 34px;
819                background-position: 10px center;
820               
821                . :hover, . :focus {
822                        background-color: #[(#ENV{foncee}|couleur_luminance{0.15})];
823                        -spip-box-shadow:  0px 0px 10px #[(#ENV{foncee}|couleur_luminance{0.20})] inset;
824                        color: black;
825                }
826        }
827}
828
829#FILTRE{css_imbriques_decouper}
Note: See TracBrowser for help on using the repository browser.