[9.1.08] Nettoyage du css

This commit is contained in:
fredtempez 2019-05-29 22:35:02 +02:00
parent 95e1903f42
commit bc268b9573
3 changed files with 85 additions and 52 deletions

View File

@ -5,6 +5,8 @@
- Thème 100% fluide sans marge - Thème 100% fluide sans marge
- Ecran de smartphone (ex: iPhone 6), adaptation de la barre d'administration : le username est masqué et la taille des icônes est augmentée - Ecran de smartphone (ex: iPhone 6), adaptation de la barre d'administration : le username est masqué et la taille des icônes est augmentée
- Chemins vers les données dans des constantes - Chemins vers les données dans des constantes
- Modèles de bannières de plusieurs dimensions
- Nettoyage de common.css
## Version 9.1.07 ## Version 9.1.07
- Correction : - Correction :

View File

@ -15,6 +15,8 @@
*/ */
@import url(https://use.fontawesome.com/releases/v5.7.2/css/all.css); @import url(https://use.fontawesome.com/releases/v5.7.2/css/all.css);
/** /**
* Éléments génériques * Éléments génériques
*/ */
@ -26,48 +28,53 @@ body {
} }
@media (min-width: 769px) {
body {
margin:0px 10px;
}
}
/** /**
* Petits écrans inférieurs à 768px de largeur, on supprime les marges * Petits écrans inférieurs à 768px de largeur, on supprime les marges
*/ */
@media (max-width: 768px) { @media (max-width: 768px) {
body { body {
margin:2px 2px !important; margin:2px 2px;
} }
#site { #site {
margin:0px auto !important; margin:0px auto;
} }
header { body > header {
margin:0px 0px !important; margin:0px 0px;
} }
.tippy-tooltip { .tippy-tooltip {
font-size:.8rem !important; font-size:.8rem !important;
} }
section { section {
padding: 5px !important; padding: 5px;
} }
} }
@media (max-width: 992px) { @media (max-width: 768px) {
.siteContainer { .siteContainer {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
.siteContainer > #contentLeft { .siteContainer > #contentLeft {
order: 2; order: 1;
} }
.siteContainer > #contentRight { .siteContainer > #contentRight {
order: 3; order: 3;
} }
.siteContainer > #contentSite { .siteContainer > #contentSite {
order: 1; order: 2;
} }
} }
body {
margin:0px 10px;
}
/** /**
@ -175,7 +182,7 @@ Signature dans les articles blog et news
} }
.table th { .table th {
font-weight: normal; font-weight: normal;
padding: 15px 10px !important; padding: 15px 10px;
} }
/* Supprime le padding des cols dans les cellules des tableaux */ /* Supprime le padding des cols dans les cellules des tableaux */
td > .col1, td > .col1,
@ -305,16 +312,11 @@ td > .col12 {
height: 45px; height: 45px;
line-height: 45px; line-height: 45px;
} }
#bar #barLeft {
float: left;
}
#bar #barRight {
float: right;
font-size: .8em;
}
#bar li { #bar li {
display: inline; display: inline;
} }
#bar a { #bar a {
display: inline-block; display: inline-block;
padding: 0 12px; padding: 0 12px;
@ -333,6 +335,17 @@ td > .col12 {
width: 250px; width: 250px;
border: 0; border: 0;
} }
@media (min-width: 769px) {
#bar #barLeft {
float: left;
}
#bar #barRight {
float: right;
font-size: .8em;
}
}
@media (max-width: 768px) { @media (max-width: 768px) {
#bar { #bar {
text-align: center; text-align: center;
@ -340,15 +353,15 @@ td > .col12 {
margin: 0; margin: 0;
} }
#bar ul { #bar ul {
float: none !important;
height: auto; height: auto;
} }
#bar #barSelectPage { #bar #barSelectPage {
width: 50% !important; width: 50% ;
font-size: 0.6em !important; font-size: 0.6em;
} }
#bar #barLeft { #bar #barLeft {
font-size: 1.6em; font-size: 1.6em;
float : none;
} }
#bar #barRight { #bar #barRight {
font-size: 1.6em; font-size: 1.6em;
@ -361,17 +374,28 @@ td > .col12 {
/* Site */ /* Site */
#site { #site {
margin: 20px auto;
overflow: hidden; overflow: hidden;
} }
@media (min-width:769px) {
#site {
margin: 20px auto;
}
}
/* Bannière */ /* Bannière */
@media (min-width:769px) {
body > header { body > header {
margin: 0 -10px; margin: 0 -10px;
} }
header { header {
position: relative;
margin:0; margin:0;
}
}
header {
position: relative;
padding:0; padding:0;
} }
header span { header span {
@ -403,9 +427,6 @@ nav #toggle {
nav #toggle span { nav #toggle span {
display: block; display: block;
} }
nav #menu {
display: block;
}
nav ul { nav ul {
padding: 0; padding: 0;
@ -437,21 +458,30 @@ nav li:hover ul {
z-index: 8; z-index: 8;
opacity: 1; opacity: 1;
} }
nav a { nav a {
display: inherit; display: inherit;
-webkit-transition: background .3s ease-out; -webkit-transition: background .3s ease-out;
transition: background .3s ease-out; transition: background .3s ease-out;
} }
nav a:hover { nav a:hover {
text-decoration: none; text-decoration: none;
} }
@media (min-width: 769px) {
nav #menu {
display: block;
}
}
@media (max-width: 768px) { @media (max-width: 768px) {
nav #toggle { nav #toggle {
display: block; display: block;
} }
nav #menu { nav #menu {
display: none; display: none;
text-align: left !important; text-align: left;
} }
nav li { nav li {
display: block; display: block;
@ -463,11 +493,9 @@ nav a:hover {
min-width: inherit; min-width: inherit;
width: auto; width: auto;
} }
nav a { /* Taille du menu hamburger */
padding: 10px !important; nav .zwiico-menu {
} font-size:1.5em;
nav li ul a {
padding-left: 40px !important;
} }
} }
@ -487,10 +515,7 @@ nav a:hover {
position: sticky; position: sticky;
} }
/* Taille du menu hamburger */
nav .zwiico-menu {
font-size:1.5em !important;
}
/* Menu vertical */ /* Menu vertical */
@ -507,8 +532,13 @@ ul #menuSideChild, li #menuSideChild {
/* Corps */ /* Corps */
@media (min-width:769px) {
section { section {
padding: 20px; padding: 20px;
}
}
section {
min-height: 450px; min-height: 450px;
} }
section #sectionTitle { section #sectionTitle {
@ -536,7 +566,6 @@ body > footer {
margin: 0 -10px; margin: 0 -10px;
} }
footer { footer {
text-align: center;
padding: 1px 20px; padding: 1px 20px;
vertical-align: middle; vertical-align: middle;
} }
@ -550,13 +579,15 @@ footer {
} }
/* Conserve le pied de page sur une ligne */ /* Conserve le pied de page sur une ligne */
@media (max-width: 992px) { @media (max-width: 768px) {
footer .col4 { footer .col4 {
width:100%; width:100%;
} }
#footerCopyright, #footerText, #footerSocials { #footerCopyright, #footerText, #footerSocials {
text-align: center !important; display: flex;
justify-content: center;
} }
} }
@ -1002,7 +1033,7 @@ input[type='checkbox']:disabled + label:before{
min-height: 1px; min-height: 1px;
display: inline-block; display: inline-block;
} }
@media (min-width: 992px) { @media (min-width: 768px) {
.col1 { .col1 {
width: 8.33333333%; width: 8.33333333%;
} }

View File

@ -34,7 +34,7 @@
} }
?> ?>
> >
<div id="toggle"><?php echo template::ico('menu'); ?></div> <div id="toggle"><?php echo template::ico('menu',null,null,'2em'); ?></div>
<div id="menu" class=" <div id="menu" class="
<?php if($this->getData(['theme', 'menu', 'position']) === 'top'){echo 'container-large';}else{echo'container';} <?php if($this->getData(['theme', 'menu', 'position']) === 'top'){echo 'container-large';}else{echo'container';}
?>"> ?>">
@ -67,7 +67,7 @@
<?php if($this->getData(['theme', 'menu', 'position']) === 'body-second'): ?> <?php if($this->getData(['theme', 'menu', 'position']) === 'body-second'): ?>
<!-- Menu dans le fond du site après la bannière --> <!-- Menu dans le fond du site après la bannière -->
<nav> <nav>
<div id="toggle"><?php echo template::ico('menu'); ?></div> <div id="toggle"><?php echo template::ico('menu',null,null,'2em'); ?></div>
<div id="menu" class="container"> <div id="menu" class="container">
<?php $layout->showMenu(); ?> <?php $layout->showMenu(); ?>
</div> </div>
@ -78,7 +78,7 @@
<?php if($this->getData(['theme', 'menu', 'position']) === 'site-first'): ?> <?php if($this->getData(['theme', 'menu', 'position']) === 'site-first'): ?>
<!-- Menu dans le site avant la bannière --> <!-- Menu dans le site avant la bannière -->
<nav> <nav>
<div id="toggle"><?php echo template::ico('menu'); ?></div> <div id="toggle"><?php echo template::ico('menu',null,null,'2em'); ?></div>
<div id="menu" class="container"> <div id="menu" class="container">
<?php $layout->showMenu(); ?> <?php $layout->showMenu(); ?>
</div> </div>
@ -121,7 +121,7 @@
): ?> ): ?>
<!-- Menu dans le site après la bannière --> <!-- Menu dans le site après la bannière -->
<nav <?php if($this->getData(['theme', 'menu', 'position']) === 'hide'): ?>class="displayNone"<?php endif; ?>> <nav <?php if($this->getData(['theme', 'menu', 'position']) === 'hide'): ?>class="displayNone"<?php endif; ?>>
<div id="toggle"><?php echo template::ico('menu'); ?></div> <div id="toggle"><?php echo template::ico('menu',null,null,'2em'); ?></div>
<div id="menu" class="container"> <div id="menu" class="container">
<?php $layout->showMenu(); ?> <?php $layout->showMenu(); ?>
</div> </div>