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