From 787d03e48471ba62cd830379428f04d996f0b74b Mon Sep 17 00:00:00 2001 From: polo Date: Thu, 17 Feb 2022 18:13:00 +0100 Subject: model update --- public/accueil.css | 991 +++++++++++++++++++++++++++-------------------------- 1 file changed, 506 insertions(+), 485 deletions(-) (limited to 'public/accueil.css') 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 @@ -/* 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; -} - -/* agir sur ul et li directement affecte le ckeditor */ -#ul_menu -{ - margin: 0px; - padding: 5px; - display: flex; - flex-wrap: wrap; - justify-content: center; -} - -#ul_menu 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; -} - -form -{ - padding-bottom: 14px; - border-bottom: 1px black solid; -} - -#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: 20px; -} - -#modeAdmin -{ - background-color: orange; - position: fixed; - bottom: 0px; - width: 700px; - z-index: 2; - padding-top: 5px; - text-align: center; -} - -#modeAdmin p -{ - text-align: center; - margin: 0px; - padding: 2px; -} -#modeAdmin>div p -{ - /*border: 1px black solid;*/ - margin: 5px; - padding: 0px; -} -#modeAdmin>p a -{ - padding: 2px; -} - -#modeAdmin div -{ - display: flex; - justify-content: space-around; - - margin: 0px; - 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; -} -.avertissement -{ - color: red; - font-size: 90%; - 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: 70px; - } -} - -/* "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: 75px; - } - - #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; - } - #modeAdmin - { - font-size: 90%; - } - .zoneVideAdmin, #modeAdmin - { - height: 70px; - } -} - -@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: 65px; - } - - #modeAdmin - { - max-width: 380px; - } - - #modeAdmin div - { - /*margin: 5px;*/ - } -} - -/* spécialement pour les petits smartphones*/ -@media screen and (max-width: 379px) -{ - .zoneVideAdmin, #modeAdmin - { - height: 80px; - } - - #modeAdmin - { - font-size: 95%; - padding: 0px; - } - #modeAdmin>p - { - font-size: 90%; - margin: 3px; - } - - #modeAdmin div - { - max-width: 320px; - } - #modeAdmin>div p - { - margin: 0px 5px; - } -} +/* 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; +} + +/* agir sur ul et li directement affecte le ckeditor */ +#ul_menu +{ + margin: 0px; + padding: 5px; + display: flex; + flex-wrap: wrap; + justify-content: center; +} + +#ul_menu 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; +} + +.boutonAnnuler:hover +{ + /*text-decoration: none;*/ + border: none; +} + +h3 +{ + margin: 5px; +} +.conteneur_article +{ + margin: 3px; +} + +.articleAvecEditeur +{ + background-color: #a8b3d9; + padding: 2px 0px; +} + +form +{ + padding-bottom: 14px; + border-bottom: 1px black solid; +} + +#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: 20px; +} + +#modeAdmin +{ + background-color: orange; + position: fixed; + bottom: 0px; + width: 700px; + z-index: 2; + padding-top: 5px; + text-align: center; +} + +#modeAdmin p +{ + text-align: center; + margin: 0px; + padding: 2px; +} +#modeAdmin>div p +{ + /*border: 1px black solid;*/ + margin: 5px; + padding: 0px; +} +#modeAdmin>p a +{ + padding: 2px; +} + +#modeAdmin div +{ + display: flex; + justify-content: space-around; + + margin: 0px; + 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; +} +.avertissement +{ + color: red; + font-size: 90%; + 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: 70px; + } +} + +/* "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: 75px; + } + + #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; + } + #modeAdmin + { + font-size: 90%; + } + .zoneVideAdmin, #modeAdmin + { + height: 70px; + } +} + +@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: 65px; + } + + #modeAdmin + { + max-width: 380px; + } + + #modeAdmin div + { + /*margin: 5px;*/ + } +} + +/* spécialement pour les petits smartphones*/ +@media screen and (max-width: 379px) +{ + .zoneVideAdmin, #modeAdmin + { + height: 80px; + } + + #modeAdmin + { + font-size: 95%; + padding: 0px; + } + #modeAdmin>p + { + font-size: 90%; + margin: 3px; + } + + #modeAdmin div + { + max-width: 320px; + } + #modeAdmin>div p + { + margin: 0px 5px; + } +} -- cgit v1.2.3