diff --git a/core/layout/common.css b/core/layout/common.css index ced1cd47..fd799fed 100755 --- a/core/layout/common.css +++ b/core/layout/common.css @@ -29,7 +29,7 @@ body { } -@media (min-width: 769px) { +@media screen and (min-width: 769px) { body { /*margin:0px 10px;*/ margin: 0; @@ -41,7 +41,7 @@ body { /** * Petits écrans inférieurs à 768px de largeur, on supprime les marges */ -@media (max-width: 768px) { +@media screen and (max-width: 768px) { body { margin: 0px; } @@ -65,7 +65,7 @@ body { -@media (max-width: 768px) { +@media screen and (max-width: 768px) { .siteContainer { display: flex; flex-direction: column; @@ -237,12 +237,12 @@ td>.col12 { } /* Tableau sur les écrans de petites tailles */ -@media (max-width: 768px) { +@media screen and (max-width: 768px) { .table thead { font-size: 0.8em; } } -@media (max-width: 668px) { +@media screen and (max-width: 668px) { .table thead { display:none; } @@ -408,7 +408,7 @@ td>.col12 { background-color: rgba(255, 255, 255, 1); } -@media (min-width: 769px) { +@media screen and (min-width: 769px) { #bar #barLeft { float: left; } @@ -419,7 +419,7 @@ td>.col12 { } } -@media (max-width: 768px) { +@media screen and (max-width: 768px) { #bar { text-align: center; padding: 0 1; @@ -455,7 +455,7 @@ td>.col12 { overflow: hidden; } /* Dans theme.css -@media (min-width:768px) { +@media screen and (min-width:768px) { #site { margin: 20px auto; } @@ -464,7 +464,7 @@ td>.col12 { /* Bannière */ -@media (min-width:768px) { +@media screen and (min-width:768px) { body>header { margin: 0; /*-10px;*/ @@ -598,13 +598,13 @@ nav::before { display: flex; } -@media (min-width: 769px) { +@media screen and (min-width: 769px) { nav #menu { display: block; } } -@media (max-width: 768px) { +@media screen and (max-width: 768px) { body>nav { margin: 0; } @@ -691,41 +691,66 @@ li .menuSideChild { /* Container des drapeaux */ -#i18nContainer { - z-index: 100; + +#i18nContainerNav, #i18nContainerSite { position: relative ; float: right; - width: auto; - height: auto; - margin-top: -25px; } -#i18nContainer ul { +#i18nContainerNav ul, #i18nContainerSite ul { list-style: none; } -#i18nContainer li { +#i18nContainerNav li, #i18nContainerSite li { display: inline-block; position: relative; } -#i18nContainer img { - width: 80%; +#i18nFlag { + width: 70%; +} + +#i18nFlagSelected { + width: 100%; } +/* +* Position du bloc dans le site sur les petits écrans +*/ - -#i18nContainer img { - margin: 2px; +#i18nContainerNav { + display: block; +} +#i18nContainerSite { + display: none; } +@media screen and (max-width:1024px){ + #i18nContainerNav { + display: none; + } + #i18nContainerSite { + display: block; + margin-top: -10px; + } + #i18nFlag { + width: 100%; + padding: 5px; + } + + #i18nFlagSelected { + width: 130%; + padding: 5px; + } + + } /* Corps */ -@media (min-width:768px) { +@media screen and (min-width:768px) { section { padding: 20px; } @@ -822,7 +847,7 @@ footer #footerbody>div { } /* Conserve le pied de page sur une ligne */ -@media (max-width: 768px) { +@media screen and (max-width: 768px) { body>footer { margin: 0; } @@ -1031,6 +1056,7 @@ footer #footerSocials .zwiico-github:hover { user-select: none; } + /* Lightbox */ .lightbox { background: #FFF; @@ -1209,7 +1235,7 @@ label { } /* Empêche le débordement et les sauts de ligne */ -.inputFileManagerWrapper, .inputDateManagerWrapper { +.inputFileManagerWrapper, .inputDateManagerWrapper { display: inline; } @@ -1367,7 +1393,7 @@ input[type='checkbox']:disabled+label:before { display: inline-block; } -@media (min-width: 769px) { +@media screen and (min-width: 769px) { .col1 { width: 8.33333333%; } @@ -1556,7 +1582,7 @@ th.col12 { } /* Tableau sur les écrans de très petites tailles */ -@media (max-width: 480px){ +@media screen and (max-width: 480px){ .table tr{ display: block; margin-bottom: 10px; @@ -1710,3 +1736,7 @@ th.col12 { border-radius: 5px; z-index: 30; } + +.helpDisplayButton { + cursor: pointer; +}