source: spip-zone/_plugins_/albums/trunk/prive/style_prive_plugin_albums.html @ 68949

Last change on this file since 68949 was 68949, checked in by tcharlss@…, 7 years ago
  • Notice de l'espace privé pour les modèles : on simplifie.
  • Aperçu des documents de la liste des albums liés : critère {tout} sinon on ne les voit pas si l'album n'est pas publié.
  • Quelques règles de commit au cas-où
File size: 7.8 KB
Line 
1[(#REM)<style>]
2#HTTP_HEADER{Content-Type: text/css; charset=utf-8}
3#HTTP_HEADER{Vary: Accept-Encoding}
4
5#SET{claire,##ENV{couleur_claire,c5e41c}}
6#SET{foncee,##ENV{couleur_foncee,9dba00}}
7
8
9
10
11/*==============================
12  === BOITE COMPLEMENT OBJET ===
13  ==============================*/
14
15/* titre boite */
16.albums > .portfolios > h3              {margin: 0 0 10px;}
17
18/* ONGLETS + ENTETE + FORMULAIRES */
19.albums .entete_ajouter,
20  .albums #associer,
21  .albums .onglets strong.on            {border:1px solid #GET{foncee};}
22
23/* ONGLETS */
24.albums .onglets                        {
25                                        display: table;
26                                        width: 100%;
27                                        font-weight: bold;
28                                        }
29.albums .onglets a,
30  .albums .onglets strong               {
31                                        display: table-cell;
32                                        padding:.2em .8em;
33                                        background-color: #fff;
34                                        border: 1px solid #dfdfdf;
35                                        border-left: none;
36                                        border-bottom: 1px solid #GET{foncee};
37                                        font-size: .92em;
38                                        text-align: center;
39                                        text-transform: uppercase;
40                                        }
41.albums .onglets > *:first-child        {border-left: 1px solid #dfdfdf;}
42.albums .onglets a:hover                {
43                                        background-color: rgba(0,0,0,.04);
44                                        text-decoration: none;
45                                        }
46.albums .onglets strong.on              {
47                                        background-color: #GET{foncee};
48                                        border-bottom: none;
49                                        }
50.albums .onglets .fermer                {
51                                        width: 0; /* pour taille minimale */
52                                        padding: 0 .3em;
53                                        }
54
55/* ENTETE */
56.albums .entete_ajouter                 {
57                                        padding: 1.5em .5em;
58                                        background-color: #GET{foncee};
59                                        border-top: none;
60                                        }
61.albums .entete_ajouter h4              {
62                                        display: inline;
63                                        margin: 0;
64                                        font-size: 1.3em;
65                                        font-weight: normal;
66                                        color: #fff;
67                                        }
68.albums .entete_ajouter img             {vertical-align:bottom;}
69
70/* FORMULAIRE ASSOCIER */
71.albums #associer                       {
72                                        background-color: #fff;
73                                        border-color: #aaa;
74                                        border-top: none;
75                                        }
76.albums #associer .entete               {
77                                        padding:.4em;
78                                        border-top: none;
79                                        border-bottom: none;
80                                        }
81.albums #associer .formulaire_recherche,
82  .albums #associer .filtres            {margin: 0;}
83
84/* FORMULAIRE CREER */
85.albums #creer .formulaire_editer       {margin-top:0; border-top:none;}
86
87
88
89
90/*==============
91  === LISTES ===
92  ==============*/
93
94/*==========
95  = TOUTES =
96  ==========*/
97.albums .entete h2                      {display: inline;}
98.albums .liste-objets,
99  .albums .liste                        {margin:0; border-width:0;}
100.albums td                              {vertical-align: top;}
101.albums td img                          {vertical-align: middle;}
102.albums td.logo                         {width: 1px;}
103.albums th.id,
104  .albums td.id                         {width: 1.5em; text-align: center;}
105.albums td.infos                        {/*min-width: 13em;*/}
106.albums td.descriptif                   {max-width: 15em;}
107.albums td.descriptif p                 {margin: 0;}
108.albums td.action                       {
109                                        /*width: 60px;*/
110                                        text-align: right;
111                                        }
112.albums td.action .submit               {line-height: 0;}
113.albums  td.contenu,
114  .albums  td.liaison                   {min-width: 8em;}
115
116/*============
117  = ASSOCIER =
118  ============*/
119
120
121/*================
122  = ALBUMOTHEQUE =
123  ================*/
124.albums .albumotheque                   {margin-top: 1em;}
125.albums .albumotheque td                {padding: .8em .5em; font-size: 1em;}
126.albums .albumotheque td.id             {font-size: 1.5em;}
127
128/*=============
129  = SELECTEUR =
130  =============*/
131
132.albums .entete.selecteur h2            {font-size: 1em;}
133.albums .liste-objets.selecteur         {font-size: .9em;}
134.albums .selecteur td.id                {width: auto;}
135.albums .selecteur td.action            {display: table-cell; width: auto;}
136.albums .selecteur td.action input[type=radio]  {margin: 0;}
137
138/*========
139  = LIES =
140  ========*/
141/* conteneur général */
142.album.lie                              {
143                                        display: table;
144                                        width: 100%;
145                                        margin: 0 0 10px;
146                                        }
147/* logo */
148.album.lie .logo                        {
149                                        width: 1px; /* taille minimum quel que soit la taille du logo */
150                                        padding-right: 10px;
151                                        }
152.album.lie .logo,
153.album.lie .contenu                     {display: table-cell;}
154/* contenu */
155.album.lie .contenu                     {
156                                        padding: 1px;
157                                        vertical-align: top;
158                                        border: 1px solid #ddd;
159                                        border-color: rgba(0,0,0,.1);
160                                        box-shadow: inset 0 0 1em rgba(0,0,0,.03);
161                                        border-radius: 2px;
162                                        }
163.album.lie .contenu:hover               {
164                                        background-color: #eee;
165                                        background-color: rgba(0,0,0,.025);
166                                        }
167.album.lie.actif .contenu               {border-color: #GET{claire};}
168/* header = tableau */
169.album.lie .header                      {margin: 0;}
170.album.lie .infos                       {
171                                        width: 5em;
172                                        font-size: 0.9em;
173                                        }
174.album.lie .infos img                   {vertical-align: middle;}
175.album.lie .titre > *                   {margin: 0;}
176.album.lie .titre > *:first-letter      {text-transform: uppercase;}
177.album.lie .action                      {width: 10em;}
178/* bouton permuter */
179.album.lie .permuter                    {
180                                        color: #888;
181                                        color: rgba(0,0,0,.5);
182                                        font-size: 0.7em;
183                                        font-weight: bold;
184                                        text-transform: uppercase;
185                                        }
186.album.lie .permuter:before             {display: inline-block; content:''; width: 8px; height: 8px; margin-right: .25em;}
187.album.lie .permuter.afficher:before    {background:url([(#CHEMIN_IMAGE{curseur-depli-8.png})]) no-repeat;}
188.album.lie .permuter.cacher:before      {background:url([(#CHEMIN_IMAGE{curseur-repli-8.png})]) no-repeat;}
189/* */
190.album.lie .apercu,
191  .album.lie .detail                    {
192                                        border-top: 1px dotted #ccc;
193                                        border-top-color: rgba(0,0,0,.1);
194                                        }
195/* documents : apercu */
196.album.lie .apercu                      {
197                                        padding: .5em;
198                                        line-height: 0; /* supprime l'espace apres les images */
199                                        }
200.album.lie .apercu .vignette            {
201                                        float: #ENV{left};
202                                        /*width: 52px;*/ height: 52px;
203                                        line-height: 52px; /* pour centrer verticalement l'image */
204                                        padding: .2em .35em;
205                                        text-align: center;
206                                        }
207.album.lie .apercu .vignette img        {vertical-align: middle;}
208/* documents : vue detaillée */
209.album.lie .detail                      {padding: .5em;}
210.album.lie .portfolios,
211.album.lie .formulaire_joindre          {margin: 0;}
212
213
214
215
216/*===============
217  === ONGLETS ===
218  ===============*/
219
220.albums .onglets_simple .parents li:first-child {margin-#ENV{left}: 2.5em;}
221.albums .onglets_simple img             {
222                                        margin-right: 0.3em;
223                                        vertical-align: middle;
224                                        }
225.albums .onglets_simple.filtres a       {padding-left: .2em; padding-right: .2em;}
226.albums .onglets_simple.filtres strong  {padding-left: .5em; padding-right: .5em;}
227.albums .onglets_simple.filtres a,
228  .albums .onglets_simple.filtres a:hover {
229                                        border-color: transparent;
230                                        background-color: transparent;
231                                        }
232
233
234
235
236/*=========================
237  === BOITE OBJETS LIES ===
238  =========================*/
239.albums.liaison > ul            {
240                                padding-top: 0;
241                                padding-bottom: 0;
242                                }
243.albums.liaison .liste-objets {
244                                padding-bottom: 0;
245                                padding-right: 0;
246                                padding-top: 0;
247                                }
248.albums.liaison label           {
249                                margin-top: .34em;
250                                font-weight: bold;
251                                }
252.albums.liaison .liste td.icone_objet   {width: 20px;}
253.albums.liaison .liste tr:first-child td {border-top: none;}
254.albums.liaison .liste tr:last-child td {border-bottom: none;}
255
256
257
258
259/*==============
260  === DIVERS ===
261  ==============*/
262/* logo */
263.album.logo                     {margin:0 auto;}
264/* bouton action */
265  .albums button:hover,
266  .albums button:hover                  {cursor:pointer;}
267/* formulaire configurer */
268.albums .inline .choix                  {display:inline-block;}
269.albums .inline .choix input            {margin-right:0; vertical-align:bottom;}
270.albums .inline .choix label            {margin-left:0; margin-right:.8em;}
271.albums .inline .choix strong small     {font-weight:normal;}
272/* message compagnon */
273.box.compagnon .albums > ul             {margin:.5em 0;}
274.box.compagnon .albums > ul li > ul     {display:inline-block; vertical-align:top; list-style:none inside;}
275
276
277
278
279/*==============
280  === MODELE ===
281  ==============*/
282/* vue en vignettes */
283.album.vignettes li                     {float: left; margin: 0 10px 10px 0;}
284.album.vignettes li .spip_logos         {float: none; margin: 0;}
285.album.vignettes figure,
286  .album.vignettes .figure              {display: table; width: 1px;} /* width : pour empecher le titre de dépasser */
287.album.vignettes a,
288  .album.vignettes figcaption,
289  .album.vignettes .figcaption,
290  .album.vignettes img                  {display: table-row;}
291
292/* notice espace privé */
293.album.publier                          {opacity:.3}
294.album.publier:hover                    {opacity: 1}
295.album.publier .submit                  {
296                                        padding: 0;
297                                        font-size: .8em;
298                                        }
299.album.publier .submit:hover            {cursor: pointer;}
Note: See TracBrowser for help on using the repository browser.