#CACHE{24*3600,cache-client} #HTTP_HEADER{Content-Type: text/css; charset=iso-8859-15} #HTTP_HEADER{Vary: Accept-Encoding} #SET{LargeurContaineur,(#CONFIG{soyezcreateurs_layout/largeurconteneur,960})} #SET{LargeurMenuGauche,(#CONFIG{soyezcreateurs_layout/largeurmenugauche,180})} #SET{LargeurMenuDroit,(#CONFIG{soyezcreateurs_layout/largeurmenudroit,180})} #SET{layoutmoderne,(#CONFIG{soyezcreateurs_layout/layoutmoderne,fixe})} [(#CONFIG{soyezcreateurs/mode_affichage,communiquant}|=={portailcognac}|oui)#SET{layoutmoderne,moderne}] [(#SET{titreounavigation,[(#CONFIG{soyezcreateurs_layout/positioncartouchetitre,contenu}|=={haut}|?{titre,navigation})]})] [(#SET{titreouextra,[(#CONFIG{soyezcreateurs_layout/positioncartouchetitre,contenu}|=={haut}|?{titre,extra})]})] /* http://blog.html.it/layoutgala/index.html */ /* Mode mobile ici sans media queries */ #navigation, #extra { display: flex; flex-direction: column; flex-wrap: nowrap; } /* Mode Tablette définition des grilles CSS */ @media screen and (min-width: 768px) { #shadow { display: grid; grid-template-areas: "header" "maincontent" "footer"; } #mainheader { grid-area: header; } #maincontent { grid-area: maincontent; display: grid; } #miettesdepain{ grid-area: ariane; } #heading{ grid-area: titre; display: grid; } #contenu{ grid-area: content; display: grid; } #navigation { grid-area: navigation; } #extra { grid-area: extra; } #footer { grid-area: footer; } /* un switch avec 2 types de cas pour ipad */ [(#ENV{layoutgala}|in_any{#LISTE{1,3,5,7,9,11,13,15,18,19,20,21,22,23,24,25,26,27,29,30,31,32,33,34,35,36,37,38,39}}|oui) #maincontent { grid-template-areas: "ariane ariane" "titre titre" "content content" "navigation extra"; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|in_any{#LISTE{2,4,6,8,10,12,14,16,17,28,40}}|oui) #maincontent { grid-template-areas: "ariane ariane" "titre titre" "content content" "extra navigation"; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto auto 1fr; } ] } @media screen and (min-width: [(#GET{LargeurContaineur})]px) { [(#GET{layoutmoderne}|=={moderne}|oui) [(#CONFIG{soyezcreateurs_layout/logorubriquenavigation,content}|=={header}|oui) [(#ENV{template}|!={'sommaire'}|ou{[(#ENV{template}|=={'sommaire'}|et{[(#CONFIG{soyezcreateurs_layout/aff_logoaccueil,on}|=={on})]})]})[ #maincontent { margin-top: calc(min(100vw, 1920px) / 1920 * -(#CONFIG{soyezcreateurs_layout/decalageverticalcontenu,0})); position: relative; } ]]]] /* ce switch pour desktop */ [(#ENV{layoutgala}|in_any{#LISTE{7,8,9,10,11,12,33,34,35,36,37,38,39,40}}|oui) #shadow { grid-template-areas: "[(#GET{layoutmoderne}|=={moderne}|?{'header','.'})] header [(#GET{layoutmoderne}|=={moderne}|?{'header','.'})]" ". maincontent ." "[(#GET{layoutmoderne}|=={moderne}|?{'footer','.'})] footer [(#GET{layoutmoderne}|=={moderne}|?{'footer','.'})]"; grid-template-columns: minmax(0, 1fr) [(#GET{LargeurContaineur})]px minmax(0, 1fr); } ] [(#ENV{layoutgala}|in_any{#LISTE{23,24,25,26,33,34}}|oui) #maincontent { grid-template-rows: max-content max-content max-content 1fr; } ] [(#ENV{layoutgala}|=={1}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "[(#GET{titreounavigation})] titre [(#GET{titreouextra})]" "navigation content extra"; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr); grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={2}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "[(#GET{titreouextra})] titre [(#GET{titreounavigation})]" "extra content navigation"; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr); grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={3}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "titre [(#GET{titreounavigation})] [(#GET{titreouextra})]" "content navigation extra"; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={4}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "titre [(#GET{titreouextra})] [(#GET{titreounavigation})]" "content extra navigation"; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={5}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "[(#GET{titreounavigation})] [(#GET{titreouextra})] titre" "navigation extra content"; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr); grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={6}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "[(#GET{titreouextra})] [(#GET{titreounavigation})] titre" "extra navigation content"; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr); grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={7}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "[(#GET{titreounavigation})] titre [(#GET{titreouextra})]" "navigation content extra"; grid-template-columns: #GET{LargeurMenuGauche}px minmax(0, 1fr) #GET{LargeurMenuDroit}px; grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={8}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "[(#GET{titreouextra})] titre [(#GET{titreounavigation})]" "extra content navigation"; grid-template-columns: #GET{LargeurMenuDroit}px minmax(0, 1fr) #GET{LargeurMenuGauche}px; grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={9}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "titre [(#GET{titreounavigation})] [(#GET{titreouextra})]" "content navigation extra"; grid-template-columns: minmax(0, 1fr) #GET{LargeurMenuGauche}px #GET{LargeurMenuDroit}px; grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={10}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "titre [(#GET{titreouextra})] [(#GET{titreounavigation})]" "content extra navigation"; grid-template-columns: minmax(0, 1fr) #GET{LargeurMenuDroit}px #GET{LargeurMenuGauche}px; grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={11}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "[(#GET{titreounavigation})] [(#GET{titreouextra})] titre" "navigation extra content"; grid-template-columns: #GET{LargeurMenuGauche}px #GET{LargeurMenuDroit}px minmax(0, 1fr); grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={12}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "[(#GET{titreouextra})] [(#GET{titreounavigation})] titre" "extra navigation content"; grid-template-columns: #GET{LargeurMenuDroit}px #GET{LargeurMenuGauche}px minmax(0, 1fr); grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={13}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "[(#GET{titreounavigation})] titre [(#GET{titreouextra})]" "navigation content extra"; grid-template-columns: #GET{LargeurMenuGauche}px minmax(0, 1fr) #GET{LargeurMenuDroit}px; grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={14}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "[(#GET{titreouextra})] titre [(#GET{titreounavigation})]" "extra content navigation"; grid-template-columns: #GET{LargeurMenuDroit}px minmax(0, 1fr) #GET{LargeurMenuGauche}px; grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={15}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "titre [(#GET{titreounavigation})] [(#GET{titreouextra})]" "content navigation extra"; grid-template-columns: minmax(0, 1fr) #GET{LargeurMenuGauche}px #GET{LargeurMenuDroit}px; grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={16}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "titre [(#GET{titreouextra})] [(#GET{titreounavigation})]" "content extra navigation"; grid-template-columns: minmax(0, 1fr) #GET{LargeurMenuDroit}px #GET{LargeurMenuGauche}px; grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={17}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "[(#GET{titreouextra})] [(#GET{titreounavigation})] titre" "extra navigation content"; grid-template-columns: #GET{LargeurMenuDroit}px #GET{LargeurMenuGauche}px minmax(0, 1fr); grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={18}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "[(#GET{titreounavigation})] [(#GET{titreouextra})] titre" "navigation extra content"; grid-template-columns: #GET{LargeurMenuGauche}px #GET{LargeurMenuDroit}px minmax(0, 1fr); grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={19}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "[(#GET{titreounavigation})] titre [(#GET{titreouextra})]" "navigation content extra"; grid-template-columns: #GET{LargeurMenuGauche}px minmax(0, 2fr) minmax(0, 1fr); grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={20}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "[(#GET{titreounavigation})] titre [(#GET{titreouextra})]" "navigation content extra"; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) #GET{LargeurMenuDroit}px; grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={21}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "titre [(#GET{titreounavigation})] [(#GET{titreouextra})]" "content navigation extra"; grid-template-columns: minmax(0, 2fr) #GET{LargeurMenuGauche}px minmax(0, 1fr); grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={22}|oui) #maincontent { grid-template-areas: "ariane ariane ariane" "titre [(#GET{titreounavigation})] [(#GET{titreouextra})]" "content navigation extra"; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) #GET{LargeurMenuDroit}px; grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={23}|oui) #maincontent { grid-template-areas: "ariane ariane" "titre [(#GET{titreounavigation})]" "content navigation" "content extra"; grid-template-columns: minmax(0, 1fr) #GET{LargeurMenuGauche}px; grid-template-rows: auto auto auto 1fr; } ] [(#ENV{layoutgala}|=={24}|oui) #maincontent { grid-template-areas: "ariane ariane" "[(#GET{titreounavigation})] titre" "navigation content" "extra content"; grid-template-columns: #GET{LargeurMenuGauche}px minmax(0, 1fr); grid-template-rows: auto auto auto 1fr; } ] [(#ENV{layoutgala}|=={25}|oui) #maincontent { grid-template-areas: "ariane ariane" "titre [(#GET{titreounavigation})]" "content navigation" "content extra"; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); grid-template-rows: auto auto auto 1fr; } ] [(#ENV{layoutgala}|=={26}|oui) #maincontent { grid-template-areas: "ariane ariane" "[(#GET{titreounavigation})] titre" "navigation content" "extra content"; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); grid-template-rows: auto auto auto 1fr; } ] [(#ENV{layoutgala}|=={29}|oui) #maincontent { grid-template-areas: "ariane ariane" "[(#GET{titreounavigation})] titre" "navigation content" "extra extra"; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={30}|oui) #maincontent { grid-template-areas: "ariane ariane" "titre [(#GET{titreounavigation})]" "content navigation" "extra extra"; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={31}|oui) #maincontent { grid-template-areas: "ariane ariane" "[(#GET{titreounavigation})] titre" "navigation content" "extra extra"; grid-template-columns: #GET{LargeurMenuGauche}px minmax(0, 1fr); grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={32}|oui) #maincontent { grid-template-areas: "ariane ariane" "titre [(#GET{titreounavigation})]" "content navigation" "extra extra"; grid-template-columns: minmax(0, 1fr) #GET{LargeurMenuGauche}px; grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={33}|oui) #maincontent { grid-template-areas: "ariane ariane" "titre [(#GET{titreounavigation})]" "content navigation" "content extra"; grid-template-columns: minmax(0, 1fr) #GET{LargeurMenuGauche}px; grid-template-rows: auto auto auto 1fr; } ] [(#ENV{layoutgala}|=={34}|oui) #maincontent { grid-template-areas: "ariane ariane" "[(#GET{titreounavigation})] titre" "navigation content" "extra content"; grid-template-columns: #GET{LargeurMenuGauche}px minmax(0, 1fr); grid-template-rows: auto auto auto 1fr; } ] [(#ENV{layoutgala}|=={35}|oui) #maincontent { grid-template-areas: "ariane ariane" "titre [(#GET{titreounavigation})]" "content navigation" "extra navigation"; grid-template-columns: minmax(0, 1fr) #GET{LargeurMenuGauche}px; grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={36}|oui) #maincontent { grid-template-areas: "ariane ariane" "[(#GET{titreounavigation})] titre" "navigation content" "navigation extra"; grid-template-columns: #GET{LargeurMenuGauche}px minmax(0, 1fr); grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={37}|oui) #maincontent { grid-template-areas: "ariane ariane" "titre [(#GET{titreounavigation})]" "content navigation" "extra extra"; grid-template-columns: minmax(0, 1fr) #GET{LargeurMenuGauche}px; grid-template-rows: auto auto 1fr; } ] [(#ENV{layoutgala}|=={38}|oui) #maincontent { grid-template-areas: "ariane ariane" "[(#GET{titreounavigation})] titre" "navigation content" "extra extra"; grid-template-columns: #GET{LargeurMenuGauche}px minmax(0, 1fr); grid-template-rows: auto auto 1fr; } ] }