summaryrefslogtreecommitdiff
path: root/public/accueil.css
diff options
context:
space:
mode:
authorpolo <ordipolo@gmx.fr>2022-02-17 18:13:00 +0100
committerpolo <ordipolo@gmx.fr>2022-02-17 18:13:00 +0100
commit787d03e48471ba62cd830379428f04d996f0b74b (patch)
treee9f98c7b9288c4530b50985688dd82622106ba2d /public/accueil.css
parent29df6f1362745eabf4fbcaedf309eb63795152fa (diff)
downloadmelaine-787d03e48471ba62cd830379428f04d996f0b74b.zip
model update
Diffstat (limited to 'public/accueil.css')
-rw-r--r--public/accueil.css991
1 files changed, 506 insertions, 485 deletions
diff --git a/public/accueil.css b/public/accueil.css
index dc79083..f951334 100644
--- a/public/accueil.css
+++ b/public/accueil.css
@@ -1,485 +1,506 @@
1/* public/accueil.css */ 1/* public/accueil.css */
2 2
3@font-face /* pour .police_titre */ 3@font-face /* pour .police_titre */
4{ 4{
5 font-family: "you_are_loved"; 5 font-family: "you_are_loved";
6 src: url('fonts/you_are_loved.ttf') format('truetype'), 6 src: url('fonts/you_are_loved.ttf') format('truetype'),
7 url('fonts/you_are_loved.eot'), 7 url('fonts/you_are_loved.eot'),
8 url('fonts/you_are_loved.eot?#iefix') format('embedded-opentype'), 8 url('fonts/you_are_loved.eot?#iefix') format('embedded-opentype'),
9 url('fonts/you_are_loved.woff2') format('woff2'), 9 url('fonts/you_are_loved.woff2') format('woff2'),
10 url('fonts/you_are_loved.woff') format('woff'); 10 url('fonts/you_are_loved.woff') format('woff');
11} 11}
12 12
13.no_underline 13.no_underline
14{ 14{
15 text-decoration: none; 15 text-decoration: none;
16} 16}
17 17
18body 18body
19{ 19{
20 margin: 0px; 20 margin: 0px;
21 background-color: #326892; 21 background-color: #326892;
22} 22}
23 23
24#bloc_page 24#bloc_page
25{ 25{
26 max-width: 700px; 26 max-width: 700px;
27 margin: auto; 27 margin: auto;
28 background-color: #FFFFFF; 28 background-color: #FFFFFF;
29 font-family: Sans-serif; 29 font-family: Sans-serif;
30 font-size: 100%; 30 font-size: 100%;
31} 31}
32 32
33nav 33nav
34{ 34{
35 position: fixed; 35 position: fixed;
36 z-index: 2; 36 z-index: 2;
37 background-color: white; 37 background-color: white;
38} 38}
39 39
40/* agir sur ul et li directement affecte le ckeditor */ 40/* agir sur ul et li directement affecte le ckeditor */
41#ul_menu 41#ul_menu
42{ 42{
43 margin: 0px; 43 margin: 0px;
44 padding: 5px; 44 padding: 5px;
45 display: flex; 45 display: flex;
46 flex-wrap: wrap; 46 flex-wrap: wrap;
47 justify-content: center; 47 justify-content: center;
48} 48}
49 49
50#ul_menu li 50#ul_menu li
51{ 51{
52 list-style-type: none; 52 list-style-type: none;
53 white-space: nowrap; 53 white-space: nowrap;
54} 54}
55 55
56li a 56li a
57{ 57{
58 text-decoration: none; 58 text-decoration: none;
59 color: #666; 59 color: #666;
60} 60}
61 61
62a:hover:not(.police_titre) /* :not() = sauf */ 62a:hover:not(.police_titre) /* :not() = sauf */
63{ 63{
64 color: #000000; 64 color: #000000;
65} 65}
66 66
67#actuelle 67#actuelle
68{ 68{
69 color: #463c3c; 69 color: #463c3c;
70 font-weight: bold; 70 font-weight: bold;
71} 71}
72 72
73img 73img
74{ 74{
75 vertical-align: bottom; 75 vertical-align: bottom;
76} 76}
77 77
78.boutonSubmitEditeur 78.boutonSubmitEditeur
79{ 79{
80 margin-top: 5px; 80 margin-top: 5px;
81} 81}
82 82
83form 83.boutonAnnuler:hover
84{ 84{
85 padding-bottom: 14px; 85 /*text-decoration: none;*/
86 border-bottom: 1px black solid; 86 border: none;
87} 87}
88 88
89#courriel 89h3
90{ 90{
91 padding-top: 30px; 91 margin: 5px;
92 font-size: 85%; 92}
93} 93.conteneur_article
94 94{
95#courriel * 95 margin: 3px;
96{ 96}
97 max-width: 220px; 97
98 color: black; 98.articleAvecEditeur
99 text-decoration: none; 99{
100} 100 background-color: #a8b3d9;
101 101 padding: 2px 0px;
102#courriel a:hover 102}
103{ 103
104 /*border: 1px blue solid;*/ 104form
105 padding: 5px; 105{
106} 106 padding-bottom: 14px;
107 107 border-bottom: 1px black solid;
108#courrielJS 108}
109{ 109
110 display: inline; 110#courriel
111 margin: 2px; 111{
112} 112 padding-top: 30px;
113 113 font-size: 85%;
114.zoneVideAdmin 114}
115{ 115
116 padding-top: 20px; 116#courriel *
117} 117{
118 118 max-width: 220px;
119#modeAdmin 119 color: black;
120{ 120 text-decoration: none;
121 background-color: orange; 121}
122 position: fixed; 122
123 bottom: 0px; 123#courriel a:hover
124 width: 700px; 124{
125 z-index: 2; 125 /*border: 1px blue solid;*/
126 padding-top: 5px; 126 padding: 5px;
127 text-align: center; 127}
128} 128
129 129#courrielJS
130#modeAdmin p 130{
131{ 131 display: inline;
132 text-align: center; 132 margin: 2px;
133 margin: 0px; 133}
134 padding: 2px; 134
135} 135.zoneVideAdmin
136#modeAdmin>div p 136{
137{ 137 padding-top: 20px;
138 /*border: 1px black solid;*/ 138}
139 margin: 5px; 139
140 padding: 0px; 140#modeAdmin
141} 141{
142#modeAdmin>p a 142 background-color: orange;
143{ 143 position: fixed;
144 padding: 2px; 144 bottom: 0px;
145} 145 width: 700px;
146 146 z-index: 2;
147#modeAdmin div 147 padding-top: 5px;
148{ 148 text-align: center;
149 display: flex; 149}
150 justify-content: space-around; 150
151 151#modeAdmin p
152 margin: 0px; 152{
153 font-size: 85%; 153 text-align: center;
154} 154 margin: 0px;
155 155 padding: 2px;
156#lienModeAdmin 156}
157{ 157#modeAdmin>div p
158 margin: 0px 20px; 158{
159 padding-bottom: 20px; 159 /*border: 1px black solid;*/
160} 160 margin: 5px;
161 161 padding: 0px;
162#lienModeAdmin p 162}
163{ 163#modeAdmin>p a
164 text-align: right; 164{
165} 165 padding: 2px;
166 166}
167#lienModeAdmin p a 167
168{ 168#modeAdmin div
169 color: #666; 169{
170 font-weight: bold; 170 display: flex;
171 padding: 2px; 171 justify-content: space-around;
172} 172
173 173 margin: 0px;
174#lienModeAdmin p a:hover 174 font-size: 85%;
175{ 175}
176 color: black; 176
177} 177#lienModeAdmin
178 178{
179.connexionTitre 179 margin: 0px 20px;
180{ 180 padding-bottom: 20px;
181 margin-top: 0px; 181}
182 text-align: center; 182
183} 183#lienModeAdmin p
184.avertissement 184{
185{ 185 text-align: right;
186 color: red; 186}
187 font-size: 90%; 187
188 text-align: center; 188#lienModeAdmin p a
189} 189{
190 190 color: #666;
191.connexionFormulaire 191 font-weight: bold;
192{ 192 padding: 2px;
193 margin: 30px; 193}
194} 194
195 195#lienModeAdmin p a:hover
196.connexionFooter 196{
197{ 197 color: black;
198 text-align: right; 198}
199 padding: 5px; 199
200} 200.connexionTitre
201 201{
202.connexionFooter a 202 margin-top: 0px;
203{ 203 text-align: center;
204 color: #666; 204}
205} 205.avertissement
206 206{
207 207 color: red;
208/* PC, y compris vieux écrans 800x600 */ 208 font-size: 90%;
209@media screen and (min-width: 700px) 209 text-align: center;
210{ 210}
211 .police_titre 211
212 { 212.connexionFormulaire
213 213{
214 font-family: you_are_loved, Arial, sans; 214 margin: 30px;
215 font-size: 250%; 215}
216 color: #ddc97a; 216
217 position: relative; 217.connexionFooter
218 top: 30px; 218{
219 left: 40px; 219 text-align: right;
220 } 220 padding: 5px;
221 221}
222 /* compensation des cibles de liens # superposées au "nav" hors flux */ 222
223 :target 223.connexionFooter a
224 { 224{
225 padding-top: 70px; 225 color: #666;
226 margin-top: -70px; 226}
227 } 227
228 228
229 nav 229/* PC, y compris vieux écrans 800x600 */
230 { 230@media screen and (min-width: 700px)
231 border-bottom: 1px black solid; 231{
232 margin: 0px 35px; 232 .police_titre
233 max-width: 630px; 233 {
234 } 234
235 235 font-family: you_are_loved, Arial, sans;
236 li 236 font-size: 250%;
237 { 237 color: #ddc97a;
238 margin: 6px 15px; 238 position: relative;
239 } 239 top: 30px;
240 240 left: 40px;
241 header 241 }
242 { 242
243 margin: 0px 35px; 243 /* compensation des cibles de liens # superposées au "nav" hors flux */
244 padding-top: 92px; 244 :target
245 } 245 {
246 246 padding-top: 70px;
247 #bienvenue 247 margin-top: -70px;
248 { 248 }
249 background-image: url("accueil/bienvenue.png"); 249
250 width: 630px; 250 nav
251 height: 596px; 251 {
252 } 252 border-bottom: 1px black solid;
253 253 margin: 0px 35px;
254 #contenu, footer 254 max-width: 630px;
255 { 255 }
256 width: 630px; 256
257 margin: auto; 257 li
258 } 258 {
259 259 margin: 6px 15px;
260 #courriel 260 }
261 { 261
262 margin: 0px 35px; 262 header
263 } 263 {
264 264 margin: 0px 35px;
265 .zoneVideAdmin, #modeAdmin 265 padding-top: 92px;
266 { 266 }
267 height: 70px; 267
268 } 268 #bienvenue
269} 269 {
270 270 background-image: url("accueil/bienvenue.png");
271/* "tablettes" et vieux écrans 640x480 */ 271 width: 630px;
272@media screen and (max-width: 699px) 272 height: 596px;
273{ 273 }
274 #bloc_page 274
275 { 275 #contenu, footer
276 max-width: 540px; 276 {
277 font-size: 90%; 277 width: 630px;
278 } 278 margin: auto;
279 279 }
280 .police_titre 280
281 { 281 #courriel
282 282 {
283 font-family: you_are_loved, Arial, sans; 283 margin: 0px 35px;
284 font-size: 200%; 284 }
285 color: #ddc97a; 285
286 286 .zoneVideAdmin, #modeAdmin
287 position: relative; 287 {
288 top: 20px; 288 height: 70px;
289 left: 30px; 289 }
290 } 290}
291 291
292 #bienvenue .police_titre 292/* "tablettes" et vieux écrans 640x480 */
293 { 293@media screen and (max-width: 699px)
294 font-size: 250%; 294{
295 top: 0px; 295 #bloc_page
296 left: 65px; 296 {
297 } 297 max-width: 540px;
298 298 font-size: 90%;
299 :target 299 }
300 { 300
301 padding-top: 59px; 301 .police_titre
302 margin-top: -59px; 302 {
303 } 303
304 304 font-family: you_are_loved, Arial, sans;
305 nav 305 font-size: 200%;
306 { 306 color: #ddc97a;
307 margin: 0px 30px; 307
308 max-width: 480px; 308 position: relative;
309 } 309 top: 20px;
310 310 left: 30px;
311 li 311 }
312 { 312
313 margin: 4px 10px; 313 #bienvenue .police_titre
314 } 314 {
315 315 font-size: 250%;
316 header 316 top: 0px;
317 { 317 left: 65px;
318 padding-top: 61px; 318 }
319 } 319
320 320 :target
321 #bienvenue 321 {
322 { 322 padding-top: 59px;
323 background-image: url("accueil/bienvenue_petit.png"); 323 margin-top: -59px;
324 width: 480px; 324 }
325 height: 463px; 325
326 margin: auto; 326 nav
327 } 327 {
328 328 margin: 0px 30px;
329 #contenu, footer 329 max-width: 480px;
330 { 330 }
331 width: 480px; 331
332 margin: auto; 332 li
333 } 333 {
334 334 margin: 4px 10px;
335 #courriel 335 }
336 { 336
337 margin: 0px 30px; 337 header
338 } 338 {
339 339 padding-top: 61px;
340 .zoneVideAdmin, #modeAdmin 340 }
341 { 341
342 height: 75px; 342 #bienvenue
343 } 343 {
344 344 background-image: url("accueil/bienvenue_petit.png");
345 #modeAdmin 345 width: 480px;
346 { 346 height: 463px;
347 max-width: 540px; 347 margin: auto;
348 } 348 }
349} 349
350 350 #contenu, footer
351 /* on grignote les colonnes autour du texte */ 351 {
352@media screen and (max-width: 539px) 352 width: 480px;
353{ 353 margin: auto;
354 #modeAdmin div 354 }
355 { 355
356 max-width: 480px; 356 #courriel
357 margin: 0px; 357 {
358 border: none; 358 margin: 0px 30px;
359 } 359 }
360 #modeAdmin 360
361 { 361 .zoneVideAdmin, #modeAdmin
362 font-size: 90%; 362 {
363 } 363 height: 75px;
364 .zoneVideAdmin, #modeAdmin 364 }
365 { 365
366 height: 70px; 366 #modeAdmin
367 } 367 {
368} 368 max-width: 540px;
369 369 }
370@media screen and (max-width: 479px) 370}
371{ 371
372 #bloc_page 372 /* on grignote les colonnes autour du texte */
373 { 373@media screen and (max-width: 539px)
374 max-width: 380px; 374{
375 font-size: 85%; 375 #modeAdmin div
376 } 376 {
377 377 max-width: 480px;
378 .police_titre 378 margin: 0px;
379 { 379 border: none;
380 380 }
381 font-family: you_are_loved, Arial, sans; 381 #modeAdmin
382 font-size: 150%; 382 {
383 color: #ddc97a; 383 font-size: 90%;
384 384 }
385 position: relative; 385 .zoneVideAdmin, #modeAdmin
386 top: 13px; 386 {
387 left: 18px; 387 height: 70px;
388 } 388 }
389 389}
390 #bienvenue .police_titre 390
391 { 391@media screen and (max-width: 479px)
392 font-size: 200%; 392{
393 top: 0px; 393 #bloc_page
394 left: 25px; 394 {
395 } 395 max-width: 380px;
396 396 font-size: 85%;
397 :target 397 }
398 { 398
399 padding-top: 56px; 399 .police_titre
400 margin-top: -56px; 400 {
401 } 401
402 402 font-family: you_are_loved, Arial, sans;
403 nav 403 font-size: 150%;
404 { 404 color: #ddc97a;
405 margin: 0px 30px; 405
406 max-width: 320px; 406 position: relative;
407 } 407 top: 13px;
408 408 left: 18px;
409 li 409 }
410 { 410
411 margin: 0px 10px; 411 #bienvenue .police_titre
412 } 412 {
413 413 font-size: 200%;
414 header 414 top: 0px;
415 { 415 left: 25px;
416 padding-top: 60px; 416 }
417 } 417
418 418 :target
419 #bienvenue 419 {
420 { 420 padding-top: 56px;
421 background-image: url("accueil/bienvenue_mini.png"); 421 margin-top: -56px;
422 width: 320px; 422 }
423 height: 316px; 423
424 } 424 nav
425 425 {
426 #contenu, footer 426 margin: 0px 30px;
427 { 427 max-width: 320px;
428 width: 320px; 428 }
429 margin: auto; 429
430 } 430 li
431 431 {
432 #courriel 432 margin: 0px 10px;
433 { 433 }
434 margin: 0px 20px; 434
435 } 435 header
436 436 {
437 #courriel * 437 padding-top: 60px;
438 { 438 }
439 max-width: 180px; 439
440 } 440 #bienvenue
441 441 {
442 .zoneVideAdmin, #modeAdmin 442 background-image: url("accueil/bienvenue_mini.png");
443 { 443 width: 320px;
444 height: 65px; 444 height: 316px;
445 } 445 }
446 446
447 #modeAdmin 447 #contenu, footer
448 { 448 {
449 max-width: 380px; 449 width: 320px;
450 } 450 margin: auto;
451 451 }
452 #modeAdmin div 452
453 { 453 #courriel
454 /*margin: 5px;*/ 454 {
455 } 455 margin: 0px 20px;
456} 456 }
457 457
458/* spécialement pour les petits smartphones*/ 458 #courriel *
459@media screen and (max-width: 379px) 459 {
460{ 460 max-width: 180px;
461 .zoneVideAdmin, #modeAdmin 461 }
462 { 462
463 height: 80px; 463 .zoneVideAdmin, #modeAdmin
464 } 464 {
465 465 height: 65px;
466 #modeAdmin 466 }
467 { 467
468 font-size: 95%; 468 #modeAdmin
469 padding: 0px; 469 {
470 } 470 max-width: 380px;
471 #modeAdmin>p 471 }
472 { 472
473 font-size: 90%; 473 #modeAdmin div
474 margin: 3px; 474 {
475 } 475 /*margin: 5px;*/
476 476 }
477 #modeAdmin div 477}
478 { 478
479 max-width: 320px; 479/* spécialement pour les petits smartphones*/
480 } 480@media screen and (max-width: 379px)
481 #modeAdmin>div p 481{
482 { 482 .zoneVideAdmin, #modeAdmin
483 margin: 0px 5px; 483 {
484 } 484 height: 80px;
485} 485 }
486
487 #modeAdmin
488 {
489 font-size: 95%;
490 padding: 0px;
491 }
492 #modeAdmin>p
493 {
494 font-size: 90%;
495 margin: 3px;
496 }
497
498 #modeAdmin div
499 {
500 max-width: 320px;
501 }
502 #modeAdmin>div p
503 {
504 margin: 0px 5px;
505 }
506}