source: spip-zone/_squelettes_/soyezcreateurs_net/plugins_2.1/plugins/soyezcreateurs/layout.css.html @ 52395

Last change on this file since 52395 was 52395, checked in by real3t@…, 9 years ago

Correction de l'affichage du mode 34 (LayouGala?).

Un élément en plus dans la ToDo?

File size: 17.4 KB
Line 
1#CACHE{24*3600,cache-client}
2#HTTP_HEADER{Content-Type: text/css; charset=iso-8859-15}
3#HTTP_HEADER{Vary: Accept-Encoding}
4
5#SET{LargeurOmbre,(#CONFIG{soyezcreateurs_layout/largeurombre,0})}
6#SET{LargeurContaineurOmbres,(#CONFIG{soyezcreateurs_layout/largeurconteneur,960}|plus{#GET{LargeurOmbre}}|plus{#GET{LargeurOmbre}})}
7#SET{LargeurContaineurOmbre,(#CONFIG{soyezcreateurs_layout/largeurconteneur,960}|plus{#GET{LargeurOmbre}})}
8#SET{LargeurContaineur,(#CONFIG{soyezcreateurs_layout/largeurconteneur,960})}
9#SET{LargeurMenuGaucheOmbre,(#CONFIG{soyezcreateurs_layout/largeurmenugauche,160}|plus{#GET{LargeurOmbre}})}
10#SET{LargeurMenuGauche,(#CONFIG{soyezcreateurs_layout/largeurmenugauche,160})}
11#SET{LargeurMenuDroitOmbre,(#CONFIG{soyezcreateurs_layout/largeurmenudroit,140}|plus{#GET{LargeurOmbre}})}
12#SET{LargeurMenuDroit,(#CONFIG{soyezcreateurs_layout/largeurmenudroit,140})}
13
14/* http://blog.html.it/layoutgala/ */
15[(#ENV{layoutgala}|=={1}|oui)/* 1 */
16div#wrapper{float:left;width:100%}
17div#content{margin: 0 25%}
18div#navigation{float:left;width:25%;margin-left:-100%}
19div#extra{float:left;width:25%;margin-left:-25%}
20div#footer{clear:left;width:100%}
21][(#ENV{layoutgala}|=={2}|oui)/* 2 */
22div#wrapper{float:left;width:100%}
23div#content{margin: 0 25%}
24div#navigation{float:left;width:25%;margin-left:-25%}
25div#extra{float:left;width:25%;margin-left:-100%}
26div#footer{clear:left;width:100%}
27@media (max-width: [(#GET{LargeurContaineur})]px) {
28div#navigation{float:right;width:50%}
29div#extra{float:left;width:50%}
30}][(#ENV{layoutgala}|=={3}|oui)/* 3 */
31div#wrapper{float:left;width:100%}
32div#content{margin-right: 50%}
33div#navigation{float:left;width:25%;margin-left:-50%}
34div#extra{float:left;width:25%;margin-left:-25%}
35div#footer{clear:left;width:100%}
36][(#ENV{layoutgala}|=={4}|oui)/* 4 */
37div#wrapper{float:left;width:100%}
38div#content{margin-right: 50%}
39div#navigation{float:left;width:25%;margin-left:-25%}
40div#extra{float:left;width:25%;margin-left:-50%}
41div#footer{clear:left;width:100%}
42@media (max-width: [(#GET{LargeurContaineur})]px) {
43div#navigation{float:right;width:50%}
44div#extra{float:left;width:50%}
45}][(#ENV{layoutgala}|=={5}|oui)/* 5 */
46div#wrapper{float:left;width:100%}
47div#content{margin-left: 50%}
48div#navigation{float:left;width:25%;margin-left:-100%}
49div#extra{float:left;width:25%;margin-left:-75%}
50div#footer{clear:left;width:100%}
51][(#ENV{layoutgala}|=={6}|oui)/* 6 */
52div#wrapper{float:left;width:100%}
53div#content{margin-left: 50%}
54div#navigation{float:left;width:25%;margin-left:-75%}
55div#extra{float:left;width:25%;margin-left:-100%}
56div#footer{clear:left;width:100%}
57@media (max-width: [(#GET{LargeurContaineur})]px) {
58div#navigation{float:right;width:50%}
59div#extra{float:left;width:50%}
60}][(#ENV{layoutgala}|=={7}|oui)/* 7 */
61div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
62div#wrapper{float:left;width:100%}
63div#content{margin: 0 #GET{LargeurMenuDroitOmbre}px 0 #GET{LargeurMenuGaucheOmbre}px}
64div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurContaineurOmbre}px}
65div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurMenuDroitOmbre}px}
66div#footer{clear:left;width:100%}
67][(#ENV{layoutgala}|=={8}|oui)/* 8 */
68div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
69div#wrapper{float:left;width:100%}
70div#content{margin: 0 #GET{LargeurMenuGauche}px 0 #GET{LargeurMenuDroit}px}
71div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurMenuGauche}px}
72div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurContaineur}px}
73div#footer{clear:left;width:100%}
74@media (max-width: [(#GET{LargeurContaineur})]px) {
75div#navigation{float:right;width:50%}
76div#extra{float:left;width:50%}
77}][(#ENV{layoutgala}|=={9}|oui)/* 9 */
78div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
79div#wrapper{float:left;width:100%}
80div#content{margin-right:[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
81div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
82div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurMenuDroit}px}
83div#footer{clear:left;width:100%}
84][(#ENV{layoutgala}|=={10}|oui)/* 10 */
85div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
86div#wrapper{float:left;width:100%}
87div#content{margin-right:[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
88div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurMenuGauche}px}
89div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
90div#footer{clear:left;width:100%}
91@media (max-width: [(#GET{LargeurContaineur})]px) {
92div#navigation{float:right;width:50%}
93div#extra{float:left;width:50%}
94}][(#ENV{layoutgala}|=={11}|oui)/* 11 */
95div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
96div#wrapper{float:left;width:100%}
97div#content{margin-left: [(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
98div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurContaineur}px}
99div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-[(#GET{LargeurContaineur}|moins{#GET{LargeurMenuGauche}})]px}
100div#footer{clear:left;width:100%}
101][(#ENV{layoutgala}|=={12}|oui)/* 12 */
102div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
103div#wrapper{float:left;width:100%}
104div#content{margin-left: [(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
105div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-[(#GET{LargeurContaineur}|moins{#GET{LargeurMenuDroit}})]px}
106div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurContaineur}px}
107div#footer{clear:left;width:100%}
108@media (max-width: [(#GET{LargeurContaineur})]px) {
109div#navigation{float:right;width:50%}
110div#extra{float:left;width:50%}
111}][(#ENV{layoutgala}|=={13}|oui)/* 13 */
112div#wrapper{float:left;width:100%;}
113div#content{margin: 0 #GET{LargeurMenuDroit}px 0 #GET{LargeurMenuGauche}px}
114div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-100%}
115div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurMenuDroit}px}
116div#footer{clear:left;width:100%}
117][(#ENV{layoutgala}|=={14}|oui)/* 14 */
118div#wrapper{float:left;width:100%}
119div#content{margin: 0 #GET{LargeurMenuGauche}px 0 #GET{LargeurMenuDroit}px}
120div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurMenuGauche}px}
121div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-100%}
122div#footer{clear:left;width:100%}
123@media (max-width: [(#GET{LargeurContaineur})]px) {
124div#navigation{float:right;width:50%}
125div#extra{float:left;width:50%}
126}][(#ENV{layoutgala}|=={15}|oui)/* 15 */
127div#wrapper{float:left;width:100%}
128div#content{margin-right: [(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
129div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
130div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurMenuDroit}px}
131div#footer{clear:left;width:100%}
132][(#ENV{layoutgala}|=={16}|oui)/* 16 */
133div#wrapper{float:left;width:100%}
134div#content{margin-right: [(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
135div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurMenuGauche}px}
136div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
137div#footer{clear:left;width:100%}
138@media (max-width: [(#GET{LargeurContaineur})]px) {
139div#navigation{float:right;width:50%}
140div#extra{float:left;width:50%}
141}][(#ENV{layoutgala}|=={17}|oui)/* 17 */
142div#wrapper{float:right;width: 100%;margin-left: -[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
143div#content{margin-left:[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
144div#navigation{float:right;width:#GET{LargeurMenuGauche}px}
145div#extra{float:right;width:#GET{LargeurMenuDroit}px}
146div#footer{clear:right;width:100%}
147@media (max-width: [(#GET{LargeurContaineur})]px) {
148div#navigation{float:right;width:50%}
149div#extra{float:left;width:50%}
150}][(#ENV{layoutgala}|=={18}|oui)/* 18 */
151div#wrapper{float:right;width: 100%;margin-left: -[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
152div#content{margin-left:[(#GET{LargeurMenuGauche}|plus{#GET{LargeurMenuDroit}})]px}
153div#navigation{float:left;width: #GET{LargeurMenuGauche}px}
154div#extra{float:right;width:#GET{LargeurMenuDroit}px}
155div#footer{clear:both;width:100%}
156][(#ENV{layoutgala}|=={19}|oui)/* 19 */
157div#wrapper{float:left;width:100%}
158div#content{margin: 0 33% 0 #GET{LargeurMenuGauche}px}
159div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-100%}
160div#extra{float:left;width:33%;margin-left:-33%}
161div#footer{clear:left;width:100%}
162][(#ENV{layoutgala}|=={20}|oui)/* 20 */
163div#wrapper{float:left;width:100%}
164div#content{margin: 0 #GET{LargeurMenuDroit}px 0 33%}
165div#navigation{float:left;width:33%;margin-left:-100%}
166div#extra{float:left;width:#GET{LargeurMenuDroit}px;margin-left:-#GET{LargeurMenuDroit}px}
167div#footer{clear:left;width:100%}
168][(#ENV{layoutgala}|=={21}|oui)/* 21 */
169div#wrapper{float:left;width:100%;margin-left:-25%}
170div#content{margin: 0 #GET{LargeurMenuGauche}px 0 25%}
171div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurMenuGauche}px}
172div#extra{float:left;width:25%}
173div#footer{clear:left;width:100%}
174][(#ENV{layoutgala}|=={22}|oui)/* 22 */
175div#wrapper{float:left;width:100%;margin-left:-#GET{LargeurMenuDroit}px}
176div#content{margin: 0 25% 0 #GET{LargeurMenuDroit}px}
177div#navigation{float:left;width:25%;margin-left:-25%}
178div#extra{float:left;width:#GET{LargeurMenuDroit}px}
179div#footer{clear:left;width:100%}
180][(#ENV{layoutgala}|=={23}|oui)/* 23 */
181div#wrapper{float:left;width:100%;margin-left:-#GET{LargeurMenuGauche}px}
182div#content{margin-left:#GET{LargeurMenuGauche}px}
183div#navigation{float:right;width:#GET{LargeurMenuGauche}px}
184div#extra{float:right;clear:right;width:#GET{LargeurMenuGauche}px}
185div#footer{clear:both;width:100%}
186@media (max-width: [(#GET{LargeurContaineur})]px) {
187div#wrapper{margin-left:0}
188div#navigation{float:left;width:50%}
189div#extra{float:left;width:50%;}
190}][(#ENV{layoutgala}|=={24}|oui)/* 24 */
191div#wrapper{float:right;width:100%;margin-left:-#GET{LargeurMenuGauche}px}
192div#content{margin-left:#GET{LargeurMenuGauche}px}
193div#navigation{float:left;width:#GET{LargeurMenuGauche}px}
194div#extra{float:left;clear:left;width:#GET{LargeurMenuGauche}px}
195div#footer{clear:both;width:100%}
196@media (max-width: [(#GET{LargeurContaineur})]px) {
197div#wrapper{margin-left:0}
198div#navigation{float:left;width:50%}
199div#extra{float:left;width:50%;clear:none;}
200}][(#ENV{layoutgala}|=={25}|oui)/* 25 */
201div#wrapper{float:left;width:100%;margin-left:-33%}
202div#content{margin-left:33%}
203div#navigation{float:right;width:32.9%}
204div#extra{float:right;clear:right;width:32.9%}
205div#footer{clear:both;width:100%}
206@media (max-width: [(#GET{LargeurContaineur})]px) {
207div#wrapper{margin-left:0}
208div#navigation{float:left;width:50%}
209div#extra{float:left;width:50%;clear:none;}
210}][(#ENV{layoutgala}|=={26}|oui)/* 26 */
211div#wrapper{float:right;width:80%;}
212div#navigation{float:left;width:20%}
213div#extra{float:left;clear:left;width:20%}
214div#footer{clear:both;width:100%}
215@media (max-width: [(#GET{LargeurContaineur})]px) {
216div#wrapper{margin-left:0}
217div#navigation{float:left;width:50%}
218div#extra{float:left;width:50%;clear:none;}
219}][(#ENV{layoutgala}|=={62}|oui)/* 26 modifie - identifiant 62 */
220div#wrapper{float:right;width:80%;margin-left:-.5%}
221div#navigation{float:left;width:20.5%}
222div#extra{float:left;clear:left;width:20%}
223div#footer{clear:both;width:100%}
224][(#ENV{layoutgala}|=={27}|oui)/* 27 */
225div#navigation{float:left;width:50%}
226div#extra{float:left;width:49.9%}
227div#footer{clear:left;width:100%}
228][(#ENV{layoutgala}|=={28}|oui)/* 28 */
229div#navigation{float:right;width:50%}
230div#extra{float:right;width:49.9%}
231div#footer{clear:right;width:100%}
232@media (max-width: [(#GET{LargeurContaineur})]px) {
233div#navigation{float:right;width:50%}
234div#extra{float:left;width:50%}
235}][(#ENV{layoutgala}|=={29}|oui)/* 29 */
236div#wrapper{float:right;width:70%}
237div#navigation{float:left;width:29.9%}
238div#extra{clear:both;width:100%}
239@media (max-width: [(#GET{LargeurContaineur})]px) {
240div#wrapper{float:none; width:100%;}
241div#navigation{float:left;width:50%}
242div#extra{float:left;width:50%;clear:none;}
243div#footer{clear:left;width:100%}
244}][(#ENV{layoutgala}|=={30}|oui)/* 30 */
245div#wrapper{float:left;width:70%}
246div#navigation{float:right;width:29.9%}
247div#extra{clear:both;width:100%}
248@media (max-width: [(#GET{LargeurContaineur})]px) {
249div#wrapper{float:none; width:100%;}
250div#navigation{float:left;width:50%}
251div#extra{float:left;width:50%;clear:none;}
252div#footer{clear:left;width:100%}
253}][(#ENV{layoutgala}|=={31}|oui)/* 31 */
254div#wrapper{float:left;width:100%;}
255div#content{margin-left:#GET{LargeurMenuGauche}px}
256div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-100%}
257div#extra{clear:left;width:100%}
258@media (max-width: [(#GET{LargeurContaineur})]px) {
259div#wrapper{float:none; width:100%;}
260div#navigation{float:left;width:50%}
261div#extra{float:left;width:50%;clear:none;}
262div#footer{clear:left;width:100%}
263}][(#ENV{layoutgala}|=={32}|oui)/* 32 */
264div#wrapper{float:left;width:100%}
265div#content{margin-right:#GET{LargeurMenuGauche}px}
266div#navigation{float:left;width:#GET{LargeurMenuGauche}px;margin-left:-#GET{LargeurMenuGauche}px}
267div#extra{clear:left;width:100%}
268@media (max-width: [(#GET{LargeurContaineur})]px) {
269div#wrapper{float:none; width:100%;}
270div#navigation{float:left;width:50%}
271div#extra{float:left;width:50%;clear:none;}
272div#footer{clear:left;width:100%}
273}][(#ENV{layoutgala}|=={33}|oui)/* 33 */
274div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
275div#content{float:left;width:[(#GET{LargeurContaineur}|plus{-#GET{LargeurMenuGauche}})]px}
276div#navigation{float:right;width:#GET{LargeurMenuGauche}px}
277div#extra{float:right;clear:right;width:#GET{LargeurMenuGauche}px}
278div#footer{clear:both;width:100%}
279@media (max-width: [(#GET{LargeurContaineur})]px) {
280div#wrapper{margin-left:0}
281div#navigation{float:left;width:50%}
282div#extra{float:left;width:50%;}
283}][(#ENV{layoutgala}|=={34}|oui)/* 34 */
284div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
285div#content{float:right;width:[(#GET{LargeurContaineur}|plus{-#GET{LargeurMenuGauche}})]px}
286div#navigation{float:left;width:#GET{LargeurMenuGauche}px}
287div#extra{float:left;clear:left;width:#GET{LargeurMenuGauche}px}
288div#footer{clear:both;width:100%}
289@media (max-width: [(#GET{LargeurContaineur})]px) {
290div#wrapper{margin-left:0}
291div#content{float:none;}
292div#navigation{float:left;width:50%}
293div#extra{float:left;width:50%;clear:none;}
294}][(#ENV{layoutgala}|=={35}|oui)/* 35 */
295div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
296div#content{float:left;width:[(#GET{LargeurContaineur}|plus{-#GET{LargeurMenuGauche}})]px}
297div#navigation{float:right;width:#GET{LargeurMenuGauche}px}
298div#extra{float:left;width:[(#GET{LargeurContaineur}|plus{-#GET{LargeurMenuGauche}})]px}
299div#footer{clear:both;width:100%}
300@media (max-width: [(#GET{LargeurContaineur})]px) {
301div#navigation{float:left;width:50%}
302div#extra{float:left;width:50%}
303}][(#ENV{layoutgala}|=={36}|oui)/* 36 */
304div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
305div#content{float:right;width:[(#GET{LargeurContaineur}|plus{-#GET{LargeurMenuGauche}})]px}
306div#navigation{float:left;width:#GET{LargeurMenuGauche}px}
307div#extra{float:right;width:[(#GET{LargeurContaineur}|plus{-#GET{LargeurMenuGauche}})]px}
308div#footer{clear:both;width:100%}
309@media (max-width: [(#GET{LargeurContaineur})]px) {
310div#navigation{float:left;width:50%}
311div#extra{float:left;width:50%}
312}][(#ENV{layoutgala}|=={37}|oui)/* 37 */
313div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
314div#content{float:left;width:[(#GET{LargeurContaineur}|moins{#GET{LargeurMenuGauche}})]px}
315div#navigation{float:right;width:#GET{LargeurMenuGauche}px}
316div#extra{clear:both;width:100%}
317@media (max-width: [(#GET{LargeurContaineur})]px) {
318div#wrapper{float:none; width:100%;}
319div#navigation{float:left;width:50%}
320div#extra{float:left;width:50%;clear:none;}
321div#footer{clear:left;width:100%}
322}][(#ENV{layoutgala}|=={38}|oui)/* 38 */
323div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
324div#content{float:right;width:[(#GET{LargeurContaineur}|moins{#GET{LargeurMenuGauche}})]px}
325div#navigation{float:left;width:#GET{LargeurMenuGauche}px}
326div#extra{clear:both;width:100%}
327@media (max-width: [(#GET{LargeurContaineur})]px) {
328div#wrapper{float:none; width:100%;}
329div#navigation{float:left;width:50%}
330div#extra{float:left;width:50%;clear:none;}
331div#footer{clear:left;width:100%}
332}][(#ENV{layoutgala}|=={39}|oui)/* 39 */
333div#wrapper{float:left;width:100%}
334div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
335div#navigation{float:left;width:50%}
336div#extra{float:right;width:50%}
337div#footer{clear:both;width:100%}
338][(#ENV{layoutgala}|=={40}|oui)/* 40 */
339div#container{width:#GET{LargeurContaineurOmbres}px;margin:0 auto}
340div#navigation{float:right;width:50%}
341div#extra{float:left;width:50%}
342div#footer{clear:both;width:100%}
343@media (max-width: [(#GET{LargeurContaineur})]px) {
344div#navigation{float:right;width:50%}
345div#extra{float:left;width:50%}
346}]
347[(#REM) Correction rapide pour les sites n'utilisant pas la surcharge perso des CSS.
348Permet de faire remarcher les bulles d'aide partout. ]
349#tooltip {
350        position: absolute;
351        z-index: 3000;
352}
Note: See TracBrowser for help on using the repository browser.