forked from ZwiiCMS-Team/ZwiiCMS
Couleur des ombres + valeurs par défaut plus faibles
This commit is contained in:
parent
6b62351cd7
commit
b9e5c6fb3a
@ -84,10 +84,10 @@ class gallery extends common {
|
|||||||
public static $galleryThemeBorder = [
|
public static $galleryThemeBorder = [
|
||||||
'0em' => 'Aucune',
|
'0em' => 'Aucune',
|
||||||
'.1em' => 'Très fine',
|
'.1em' => 'Très fine',
|
||||||
'.2em' => 'Fine',
|
'.3em' => 'Fine',
|
||||||
'.4em' => 'Moyenne',
|
'.5em' => 'Moyenne',
|
||||||
'.8em' => 'Epaisse',
|
'.7em' => 'Epaisse',
|
||||||
'1em' => 'Epaisse'
|
'.9em' => 'Epaisse'
|
||||||
];
|
];
|
||||||
|
|
||||||
public static $galleryThemeOpacity = [
|
public static $galleryThemeOpacity = [
|
||||||
@ -102,10 +102,10 @@ class gallery extends common {
|
|||||||
public static $galleryThemeMargin = [
|
public static $galleryThemeMargin = [
|
||||||
'0em' => 'Aucune',
|
'0em' => 'Aucune',
|
||||||
'.1em' => 'Très petite',
|
'.1em' => 'Très petite',
|
||||||
'.4em' => 'Petite',
|
'.3em' => 'Petite',
|
||||||
'.6em' => 'Moyenne',
|
'.5em' => 'Moyenne',
|
||||||
'1em' => 'Grande',
|
'.7em' => 'Grande',
|
||||||
'2.5em' => 'Très grande'
|
'.9em' => 'Très grande'
|
||||||
];
|
];
|
||||||
|
|
||||||
public static $galleryThemeRadius = [
|
public static $galleryThemeRadius = [
|
||||||
@ -595,19 +595,20 @@ class gallery extends common {
|
|||||||
|
|
||||||
if($this->isPost()) {
|
if($this->isPost()) {
|
||||||
$this->setData(['theme', $this->getUrl(0), [
|
$this->setData(['theme', $this->getUrl(0), [
|
||||||
'thumbAlign' => $this->getinput('galleryThemeThumbAlign'),
|
'thumbAlign' => $this->getinput('galleryThemeThumbAlign'),
|
||||||
'thumbWidth' => $this->getinput('galleryThemeThumbWidth'),
|
'thumbWidth' => $this->getinput('galleryThemeThumbWidth'),
|
||||||
'thumbHeight' => $this->getinput('galleryThemeThumbHeight'),
|
'thumbHeight' => $this->getinput('galleryThemeThumbHeight'),
|
||||||
'thumbMargin' => $this->getinput('galleryThemeThumbMargin'),
|
'thumbMargin' => $this->getinput('galleryThemeThumbMargin'),
|
||||||
'thumbBorder' => $this->getinput('galleryThemeThumbBorder'),
|
'thumbBorder' => $this->getinput('galleryThemeThumbBorder'),
|
||||||
'thumbBorderColor'=> $this->getinput('galleryThemeThumbBorderColor'),
|
'thumbBorderColor' => $this->getinput('galleryThemeThumbBorderColor'),
|
||||||
'thumbOpacity' => $this->getinput('galleryThemeThumbOpacity'),
|
'thumbOpacity' => $this->getinput('galleryThemeThumbOpacity'),
|
||||||
'thumbShadows' => $this->getinput('galleryThemeThumbShadows'),
|
'thumbShadows' => $this->getinput('galleryThemeThumbShadows'),
|
||||||
'thumbRadius' => $this->getinput('galleryThemeThumbRadius'),
|
'thumbShadowsColor' => $this->getinput('galleryThemeThumbShadowsColor'),
|
||||||
'legendHeight' => $this->getinput('galleryThemeLegendHeight'),
|
'thumbRadius' => $this->getinput('galleryThemeThumbRadius'),
|
||||||
'legendAlign' => $this->getinput('galleryThemeLegendAlign'),
|
'legendHeight' => $this->getinput('galleryThemeLegendHeight'),
|
||||||
'legendTextColor' => $this->getinput('galleryThemeLegendTextColor'),
|
'legendAlign' => $this->getinput('galleryThemeLegendAlign'),
|
||||||
'legendBgColor' => $this->getinput('galleryThemeLegendBgColor')
|
'legendTextColor' => $this->getinput('galleryThemeLegendTextColor'),
|
||||||
|
'legendBgColor' => $this->getinput('galleryThemeLegendBgColor')
|
||||||
]
|
]
|
||||||
]);
|
]);
|
||||||
// Création des fichiers CSS
|
// Création des fichiers CSS
|
||||||
@ -622,6 +623,7 @@ class gallery extends common {
|
|||||||
$content = str_replace('#thumbBorderColor#',$this->getinput('galleryThemeThumbBorderColor'),$content );
|
$content = str_replace('#thumbBorderColor#',$this->getinput('galleryThemeThumbBorderColor'),$content );
|
||||||
$content = str_replace('#thumbOpacity#',$this->getinput('galleryThemeThumbOpacity'),$content );
|
$content = str_replace('#thumbOpacity#',$this->getinput('galleryThemeThumbOpacity'),$content );
|
||||||
$content = str_replace('#thumbShadows#',$this->getinput('galleryThemeThumbShadows'),$content );
|
$content = str_replace('#thumbShadows#',$this->getinput('galleryThemeThumbShadows'),$content );
|
||||||
|
$content = str_replace('#thumbShadowsColor#',$this->getinput('galleryThemeThumbShadowsColor'),$content );
|
||||||
$content = str_replace('#thumbRadius#',$this->getinput('galleryThemeThumbRadius'),$content );
|
$content = str_replace('#thumbRadius#',$this->getinput('galleryThemeThumbRadius'),$content );
|
||||||
$content = str_replace('#legendAlign#',$this->getinput('galleryThemeLegendAlign'),$content );
|
$content = str_replace('#legendAlign#',$this->getinput('galleryThemeLegendAlign'),$content );
|
||||||
$content = str_replace('#legendHeight#',$this->getinput('galleryThemeLegendHeight'),$content );
|
$content = str_replace('#legendHeight#',$this->getinput('galleryThemeLegendHeight'),$content );
|
||||||
@ -632,13 +634,13 @@ class gallery extends common {
|
|||||||
// Valeurs en sortie
|
// Valeurs en sortie
|
||||||
$this->addOutput([
|
$this->addOutput([
|
||||||
'redirect' => helper::baseUrl() . $this->getUrl() . '/theme',
|
'redirect' => helper::baseUrl() . $this->getUrl() . '/theme',
|
||||||
'notification' => $succes ? 'Modifications enregistrées' : 'Modifications non enregistées !',
|
'notification' => $success ? 'Modifications enregistrées' : 'Modifications non enregistées !',
|
||||||
'state' => $success
|
'state' => $success
|
||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
// Valeurs en sortie
|
// Valeurs en sortie
|
||||||
$this->addOutput([
|
$this->addOutput([
|
||||||
'title' => "Thème du module",
|
'title' => "Thème",
|
||||||
'view' => 'theme',
|
'view' => 'theme',
|
||||||
'vendor' => [
|
'vendor' => [
|
||||||
'tinycolorpicker'
|
'tinycolorpicker'
|
||||||
|
@ -4,12 +4,13 @@ class theme extends gallery {
|
|||||||
'thumbAlign' => 'center',
|
'thumbAlign' => 'center',
|
||||||
'thumbWidth' => '18em',
|
'thumbWidth' => '18em',
|
||||||
'thumbHeight' => '15em',
|
'thumbHeight' => '15em',
|
||||||
'thumbMargin' => '.6em',
|
'thumbMargin' => '.5em',
|
||||||
'thumbBorder' => '.1em',
|
'thumbBorder' => '.1em',
|
||||||
'thumbOpacity' => '.7',
|
'thumbOpacity' => '.7',
|
||||||
'thumbBorderColor' => 'rgba(221, 221, 221, 1)',
|
'thumbBorderColor' => 'rgba(221, 221, 221, 1)',
|
||||||
'thumbRadius' => '.3em',
|
'thumbRadius' => '.3em',
|
||||||
'thumbShadows' => '1px 1px 10px',
|
'thumbShadows' => '1px 1px 10px',
|
||||||
|
'thumbShadowsColor'=> 'rgba(125, 125, 125, 1)',
|
||||||
'legendHeight' => '.375em',
|
'legendHeight' => '.375em',
|
||||||
'legendAlign' => 'center',
|
'legendAlign' => 'center',
|
||||||
'legendTextColor' => 'rgba(255, 255, 255, 1)',
|
'legendTextColor' => 'rgba(255, 255, 255, 1)',
|
||||||
|
@ -10,7 +10,9 @@
|
|||||||
-webkit-transition: opacity .3s ease-out;
|
-webkit-transition: opacity .3s ease-out;
|
||||||
transition: opacity .3s ease-out;
|
transition: opacity .3s ease-out;
|
||||||
border-radius: var(--thumbRadius);
|
border-radius: var(--thumbRadius);
|
||||||
box-shadow: var(--thumbShadows) ;
|
box-shadow: var(--thumbShadows) var(--thumbShadowsColor);
|
||||||
|
-webkit-box-shadow: var(--thumbShadows) var(--thumbShadowsColor);
|
||||||
|
-moz-box-shadow: var(--thumbShadows) var(--thumbShadowsColor);
|
||||||
}
|
}
|
||||||
.galleryPicture:hover,
|
.galleryPicture:hover,
|
||||||
.galleryGalleryPicture:hover {
|
.galleryGalleryPicture:hover {
|
||||||
|
@ -12,6 +12,7 @@
|
|||||||
--thumbBorderColor: #thumbBorderColor#;
|
--thumbBorderColor: #thumbBorderColor#;
|
||||||
--thumbRadius: #thumbRadius#;
|
--thumbRadius: #thumbRadius#;
|
||||||
--thumbShadows: #thumbShadows#;
|
--thumbShadows: #thumbShadows#;
|
||||||
|
--thumbShadowsColor: #thumbShadowsColor#;
|
||||||
}
|
}
|
||||||
.galleryName,
|
.galleryName,
|
||||||
.galleryGalleryName {
|
.galleryGalleryName {
|
||||||
|
19
module/gallery/view/gallery/gallery.css
Normal file → Executable file
19
module/gallery/view/gallery/gallery.css
Normal file → Executable file
@ -1,17 +1,18 @@
|
|||||||
.galleryRow {
|
.galleryRow {
|
||||||
--thumbAlign: center;
|
--thumbAlign: space-around;
|
||||||
}
|
}
|
||||||
.colPicture {
|
.colPicture {
|
||||||
--thumbWidth: 18em;
|
--thumbWidth: 21em;
|
||||||
--thumbMargin: .6em;
|
--thumbMargin: .9em;
|
||||||
}
|
}
|
||||||
.galleryPicture,
|
.galleryPicture,
|
||||||
.galleryGalleryPicture {
|
.galleryGalleryPicture {
|
||||||
--thumbHeight: 15em;
|
--thumbHeight: 12em;
|
||||||
--thumbBorder: .1em;
|
--thumbBorder: .1em;
|
||||||
--thumbBorderColor: rgba(221, 221, 221, 1);
|
--thumbBorderColor: rgba(251, 1, 1, 0.48);
|
||||||
--thumbRadius: .6em;
|
--thumbRadius: 0em;
|
||||||
--thumbShadows: 1px 1px 5px;
|
--thumbShadows: 1px 1px 25px;
|
||||||
|
--thumbShadowsColor: rgba(253, 16, 16, 0.37);
|
||||||
}
|
}
|
||||||
.galleryName,
|
.galleryName,
|
||||||
.galleryGalleryName {
|
.galleryGalleryName {
|
||||||
@ -36,7 +37,9 @@
|
|||||||
-webkit-transition: opacity .3s ease-out;
|
-webkit-transition: opacity .3s ease-out;
|
||||||
transition: opacity .3s ease-out;
|
transition: opacity .3s ease-out;
|
||||||
border-radius: var(--thumbRadius);
|
border-radius: var(--thumbRadius);
|
||||||
box-shadow: var(--thumbShadows) ;
|
box-shadow: var(--thumbShadows) var(--thumbShadowsColor);
|
||||||
|
-webkit-box-shadow: var(--thumbShadows) var(--thumbShadowsColor);
|
||||||
|
-moz-box-shadow: var(--thumbShadows) var(--thumbShadowsColor);
|
||||||
}
|
}
|
||||||
.galleryPicture:hover,
|
.galleryPicture:hover,
|
||||||
.galleryGalleryPicture:hover {
|
.galleryGalleryPicture:hover {
|
||||||
|
19
module/gallery/view/index/index.css
Normal file → Executable file
19
module/gallery/view/index/index.css
Normal file → Executable file
@ -1,17 +1,18 @@
|
|||||||
.galleryRow {
|
.galleryRow {
|
||||||
--thumbAlign: center;
|
--thumbAlign: space-around;
|
||||||
}
|
}
|
||||||
.colPicture {
|
.colPicture {
|
||||||
--thumbWidth: 18em;
|
--thumbWidth: 21em;
|
||||||
--thumbMargin: .6em;
|
--thumbMargin: .9em;
|
||||||
}
|
}
|
||||||
.galleryPicture,
|
.galleryPicture,
|
||||||
.galleryGalleryPicture {
|
.galleryGalleryPicture {
|
||||||
--thumbHeight: 15em;
|
--thumbHeight: 12em;
|
||||||
--thumbBorder: .1em;
|
--thumbBorder: .1em;
|
||||||
--thumbBorderColor: rgba(221, 221, 221, 1);
|
--thumbBorderColor: rgba(251, 1, 1, 0.48);
|
||||||
--thumbRadius: .6em;
|
--thumbRadius: 0em;
|
||||||
--thumbShadows: 1px 1px 5px;
|
--thumbShadows: 1px 1px 25px;
|
||||||
|
--thumbShadowsColor: rgba(253, 16, 16, 0.37);
|
||||||
}
|
}
|
||||||
.galleryName,
|
.galleryName,
|
||||||
.galleryGalleryName {
|
.galleryGalleryName {
|
||||||
@ -36,7 +37,9 @@
|
|||||||
-webkit-transition: opacity .3s ease-out;
|
-webkit-transition: opacity .3s ease-out;
|
||||||
transition: opacity .3s ease-out;
|
transition: opacity .3s ease-out;
|
||||||
border-radius: var(--thumbRadius);
|
border-radius: var(--thumbRadius);
|
||||||
box-shadow: var(--thumbShadows) ;
|
box-shadow: var(--thumbShadows) var(--thumbShadowsColor);
|
||||||
|
-webkit-box-shadow: var(--thumbShadows) var(--thumbShadowsColor);
|
||||||
|
-moz-box-shadow: var(--thumbShadows) var(--thumbShadowsColor);
|
||||||
}
|
}
|
||||||
.galleryPicture:hover,
|
.galleryPicture:hover,
|
||||||
.galleryGalleryPicture:hover {
|
.galleryGalleryPicture:hover {
|
||||||
|
@ -37,7 +37,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="col2">
|
<div class="col2">
|
||||||
<?php echo template::select('galleryThemeThumbMargin', $module::$galleryThemeMargin, [
|
<?php echo template::select('galleryThemeThumbMargin', $module::$galleryThemeMargin, [
|
||||||
'label' => 'Marges',
|
'label' => 'Marge',
|
||||||
'selected' => $this->getData(['theme', $this->getUrl(0),'thumbMargin'])
|
'selected' => $this->getData(['theme', $this->getUrl(0),'thumbMargin'])
|
||||||
]); ?>
|
]); ?>
|
||||||
</div>
|
</div>
|
||||||
@ -45,7 +45,7 @@
|
|||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col4">
|
<div class="col4">
|
||||||
<?php echo template::select('galleryThemeThumbBorder', $module::$galleryThemeBorder, [
|
<?php echo template::select('galleryThemeThumbBorder', $module::$galleryThemeBorder, [
|
||||||
'label' => 'Bordures',
|
'label' => 'Bordure',
|
||||||
'selected' => $this->getData(['theme', $this->getUrl(0),'thumbBorder'])
|
'selected' => $this->getData(['theme', $this->getUrl(0),'thumbBorder'])
|
||||||
]); ?>
|
]); ?>
|
||||||
</div>
|
</div>
|
||||||
@ -59,24 +59,32 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="col4">
|
<div class="col4">
|
||||||
<?php echo template::select('galleryThemeThumbRadius', $module::$galleryThemeRadius, [
|
<?php echo template::select('galleryThemeThumbRadius', $module::$galleryThemeRadius, [
|
||||||
'label' => 'Bords arrondis',
|
'label' => 'Arrondi des angles',
|
||||||
'selected' => $this->getData(['theme', $this->getUrl(0),'thumbRadius'])
|
'selected' => $this->getData(['theme', $this->getUrl(0),'thumbRadius'])
|
||||||
]); ?>
|
]); ?>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col5 offset1">
|
<div class="col4">
|
||||||
|
<?php echo template::select('galleryThemeThumbShadows', $module::$galleryThemeShadows, [
|
||||||
|
'label' => 'Ombre',
|
||||||
|
'selected' => $this->getData(['theme', $this->getUrl(0),'thumbShadows'])
|
||||||
|
]); ?>
|
||||||
|
</div>
|
||||||
|
<div class="col4">
|
||||||
|
<?php echo template::text('galleryThemeThumbShadowsColor', [
|
||||||
|
'class' => 'colorPicker',
|
||||||
|
'help' => 'Le curseur horizontal règle le niveau de transparence.',
|
||||||
|
'label' => 'Couleur de l\'ombre',
|
||||||
|
'value' => $this->getData(['theme', $this->getUrl(0),'thumbShadowsColor'])
|
||||||
|
]); ?>
|
||||||
|
</div>
|
||||||
|
<div class="col4">
|
||||||
<?php echo template::select('galleryThemeThumbOpacity', $module::$galleryThemeOpacity, [
|
<?php echo template::select('galleryThemeThumbOpacity', $module::$galleryThemeOpacity, [
|
||||||
'label' => 'Opacité au survol',
|
'label' => 'Opacité au survol',
|
||||||
'selected' => $this->getData(['theme', $this->getUrl(0),'thumbOpacity'])
|
'selected' => $this->getData(['theme', $this->getUrl(0),'thumbOpacity'])
|
||||||
]); ?>
|
]); ?>
|
||||||
</div>
|
</div>
|
||||||
<div class="col5">
|
|
||||||
<?php echo template::select('galleryThemeThumbShadows', $module::$galleryThemeShadows, [
|
|
||||||
'label' => 'Ombres',
|
|
||||||
'selected' => $this->getData(['theme', $this->getUrl(0),'thumbShadows'])
|
|
||||||
]); ?>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -110,7 +118,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="col3">
|
<div class="col3">
|
||||||
<?php echo template::select('galleryThemeLegendAlign', $module::$galleryThemeAlign, [
|
<?php echo template::select('galleryThemeLegendAlign', $module::$galleryThemeAlign, [
|
||||||
'label' => 'Alignement:',
|
'label' => 'Alignement',
|
||||||
'selected' => $this->getData(['theme', $this->getUrl(0),'legendAlign'])
|
'selected' => $this->getData(['theme', $this->getUrl(0),'legendAlign'])
|
||||||
]); ?>
|
]); ?>
|
||||||
</div>
|
</div>
|
||||||
|
Loading…
Reference in New Issue
Block a user