From 87798e5554eb0330cd2de255e5034f0472d410a4 Mon Sep 17 00:00:00 2001 From: polo Date: Tue, 20 Apr 2021 21:46:33 +0200 Subject: mot de passe --- public/accueil.css | 454 +++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 454 insertions(+) create mode 100644 public/accueil.css (limited to 'public/accueil.css') diff --git a/public/accueil.css b/public/accueil.css new file mode 100644 index 0000000..aba7196 --- /dev/null +++ b/public/accueil.css @@ -0,0 +1,454 @@ +/* public/accueil.css */ + +@font-face /* pour .police_titre */ +{ + font-family: "you_are_loved"; + src: url('fonts/you_are_loved.ttf') format('truetype'), + url('fonts/you_are_loved.eot'), + url('fonts/you_are_loved.eot?#iefix') format('embedded-opentype'), + url('fonts/you_are_loved.woff2') format('woff2'), + url('fonts/you_are_loved.woff') format('woff'); +} + +.no_underline +{ + text-decoration: none; +} + +body +{ + margin: 0px; + background-color: #326892; +} + +#bloc_page +{ + max-width: 700px; + margin: auto; + background-color: #FFFFFF; + font-family: Sans-serif; + font-size: 100%; +} + +nav +{ + position: fixed; + z-index: 2; + background-color: white; +} + +ul +{ + margin: 0px; + padding: 5px; + display: flex; + flex-wrap: wrap; + justify-content: center; +} + +li +{ + list-style-type: none; + white-space: nowrap; +} + +li a +{ + text-decoration: none; + color: #666; +} + +a:hover:not(.police_titre) /* :not() = sauf */ +{ + color: #000000; +} + +#actuelle +{ + color: #463c3c; + font-weight: bold; +} + +img +{ + vertical-align: bottom; +} + +.boutonSubmitEditeur +{ + margin-top: 5px; +} + +#courriel +{ + padding-top: 30px; + font-size: 85%; +} + +#courriel * +{ + max-width: 220px; + color: black; + text-decoration: none; +} + +#courriel a:hover +{ + /*border: 1px blue solid;*/ + padding: 5px; +} + +#courrielJS +{ + display: inline; + margin: 2px; +} + +.zoneVideAdmin +{ + padding-top: 30px; +} + +#modeAdmin +{ + background-color: orange; + position: fixed; + bottom: 0px; + width: 700px; + z-index: 2; + padding-top: 10px; + text-align: center; +} + +#modeAdmin p +{ + text-align: center; + margin-top: 0px; + padding: 2px; +} + +#modeAdmin>p a +{ + padding: 2px; +} + +#modeAdmin div +{ + display: flex; + justify-content: space-around; + border: 1px black solid; + margin: 10px; + font-size: 85%; +} + +#lienModeAdmin +{ + margin: 0px 20px; + padding-bottom: 20px; +} + +#lienModeAdmin p +{ + text-align: right; +} + +#lienModeAdmin p a +{ + color: #666; + font-weight: bold; + padding: 2px; +} + +#lienModeAdmin p a:hover +{ + color: black; +} + +.connexionTitre +{ + margin-top: 0px; + text-align: center; +} + +.connexionFormulaire +{ + margin: 30px; +} + +.connexionFooter +{ + text-align: right; + padding: 5px; +} + +.connexionFooter a +{ + color: #666; +} + + +/* PC, y compris vieux écrans 800x600 */ +@media screen and (min-width: 700px) +{ + .police_titre + { + + font-family: you_are_loved, Arial, sans; + font-size: 250%; + color: #ddc97a; + position: relative; + top: 30px; + left: 40px; + } + + /* compensation des cibles de liens # superposées au "nav" hors flux */ + :target + { + padding-top: 70px; + margin-top: -70px; + } + + nav + { + border-bottom: 1px black solid; + margin: 0px 35px; + max-width: 630px; + } + + li + { + margin: 6px 15px; + } + + header + { + margin: 0px 35px; + padding-top: 92px; + } + + #bienvenue + { + background-image: url("accueil/bienvenue.png"); + width: 630px; + height: 596px; + } + + #contenu, footer + { + width: 630px; + margin: auto; + } + + #courriel + { + margin: 0px 35px; + } + + .zoneVideAdmin, #modeAdmin + { + height: 100px; + } +} + +/* "tablettes" et vieux écrans 640x480 */ +@media screen and (max-width: 699px) +{ + #bloc_page + { + max-width: 540px; + font-size: 90%; + } + + .police_titre + { + + font-family: you_are_loved, Arial, sans; + font-size: 200%; + color: #ddc97a; + + position: relative; + top: 20px; + left: 30px; + } + + #bienvenue .police_titre + { + font-size: 250%; + top: 0px; + left: 65px; + } + + :target + { + padding-top: 59px; + margin-top: -59px; + } + + nav + { + margin: 0px 30px; + max-width: 480px; + } + + li + { + margin: 4px 10px; + } + + header + { + padding-top: 61px; + } + + #bienvenue + { + background-image: url("accueil/bienvenue_petit.png"); + width: 480px; + height: 463px; + margin: auto; + } + + #contenu, footer + { + width: 480px; + margin: auto; + } + + #courriel + { + margin: 0px 30px; + } + + .zoneVideAdmin, #modeAdmin + { + height: 90px; + } + + #modeAdmin + { + max-width: 540px; + } +} + + /* on grignote les colonnes autour du texte */ +@media screen and (max-width: 539px) +{ + #modeAdmin div + { + max-width: 480px; + margin: 0px; + border: none; + } +} + +@media screen and (max-width: 479px) +{ + #bloc_page + { + max-width: 380px; + font-size: 85%; + } + + .police_titre + { + + font-family: you_are_loved, Arial, sans; + font-size: 150%; + color: #ddc97a; + + position: relative; + top: 13px; + left: 18px; + } + + #bienvenue .police_titre + { + font-size: 200%; + top: 0px; + left: 25px; + } + + :target + { + padding-top: 56px; + margin-top: -56px; + } + + nav + { + margin: 0px 30px; + max-width: 320px; + } + + li + { + margin: 0px 10px; + } + + header + { + padding-top: 60px; + } + + #bienvenue + { + background-image: url("accueil/bienvenue_mini.png"); + width: 320px; + height: 316px; + } + + #contenu, footer + { + width: 320px; + margin: auto; + } + + #courriel + { + margin: 0px 20px; + } + + #courriel * + { + max-width: 180px; + } + + .zoneVideAdmin, #modeAdmin + { + height: 80px; + } + + #modeAdmin + { + max-width: 380px; + } + + #modeAdmin div + { + margin: 5px; + } +} + +/* spécialement pour les petits smartphones*/ +@media screen and (max-width: 379px) +{ + .zoneVideAdmin, #modeAdmin + { + height: 100px; + } + + #modeAdmin + { + font-size: 95%; + } + + #modeAdmin>p a + { + display: block; + } + + #modeAdmin div + { + max-width: 320px; + } +} -- cgit v1.2.3