10.1 Thème

This commit is contained in:
Fred Tempez 2020-05-18 10:50:43 +02:00
parent 1a1071992e
commit 3960e68365
10 changed files with 171 additions and 125 deletions

View File

@ -1,13 +1,15 @@
# Changelog # Changelog
## version 10.1.000 ## version 10.1.000
- Nouveauté : - Nouveautés :
- Thème des écrans d'administration modifiable (configuration, utilisateurs : etc.) - Thème des écrans d'administration modifiable (configuration, utilisateurs : etc.)
- Thème du site : couleur de l'encadrement et la bordure des blocs.
- Thème du menu : couleur du texte de la page active
- Corrections : - Corrections :
- Configuration SMTP : sur-cryptage du mot de passe. - Configuration SMTP : sur-cryptage du mot de passe.
- Quelques corrections liées à l'hébergeur Free. - Quelques corrections liées à l'hébergeur Free.
- Modification : - Modification :
- Optimisation des opérations de disque, mis en cache en lecture des données de pages. Aucun cache en écriture. - Optimisation des opérations de disque, mise en cache en lecture des données de pages. Aucun cache en écriture.
- Mise à jour : - Mise à jour :
- TinyMCE 4.9.10 - TinyMCE 4.9.10

View File

@ -173,8 +173,8 @@ class common {
$this->user = $this->getData(['user', $this->getInput('ZWII_USER_ID')]); $this->user = $this->getData(['user', $this->getInput('ZWII_USER_ID')]);
} }
// Mise ne cache des pages // Mise en cache des pages
$this->page = $this->readPageCache(); $this->page = $this->getPageCache();
// Construit la liste des pages parents/enfants // Construit la liste des pages parents/enfants
if($this->hierarchy['all'] === []) { if($this->hierarchy['all'] === []) {
@ -435,7 +435,7 @@ class common {
* Lecture des fichiers de données de page et mise ne cache * Lecture des fichiers de données de page et mise ne cache
* @param @return string données des pages * @param @return string données des pages
*/ */
public function readPageCache() { public function getPageCache() {
// Trois tentatives // Trois tentatives
for($i = 0; $i < 3; $i++) { for($i = 0; $i < 3; $i++) {
$data =json_decode(file_get_contents(self::DATA_DIR.'fr/page.json'), true); $data =json_decode(file_get_contents(self::DATA_DIR.'fr/page.json'), true);
@ -443,7 +443,7 @@ class common {
return($data); return($data);
} }
elseif($i === 2) { elseif($i === 2) {
exit('Unable to read data file.'); exit('Erreur fatale : impossible d\'accéder aux pages');
} }
// Pause de 10 millisecondes // Pause de 10 millisecondes
usleep(10000); usleep(10000);
@ -1409,7 +1409,7 @@ class core extends common {
// Icône BacktoTop // Icône BacktoTop
$css .= '#backToTop {background-color:' .$this->getData(['theme', 'body', 'toTopbackgroundColor']). ';color:'.$this->getData(['theme', 'body', 'toTopColor']).';}'; $css .= '#backToTop {background-color:' .$this->getData(['theme', 'body', 'toTopbackgroundColor']). ';color:'.$this->getData(['theme', 'body', 'toTopColor']).';}';
// Site // Site
$colors = helper::colorVariants($this->getData(['theme', 'text', 'linkTextColor'])); $colors = helper::colorVariants($this->getData(['theme', 'text', 'linkColor']));
$css .= 'a{color:' . $colors['normal'] . '}'; $css .= 'a{color:' . $colors['normal'] . '}';
$css .= 'a:hover{color:' . $colors['darken'] . '}'; $css .= 'a:hover{color:' . $colors['darken'] . '}';
$css .= 'body,.row > div{font-size:' . $this->getData(['theme', 'text', 'fontSize']) . '}'; $css .= 'body,.row > div{font-size:' . $this->getData(['theme', 'text', 'fontSize']) . '}';
@ -1433,6 +1433,9 @@ class core extends common {
$css .= '.button:active,button[type=\'submit\']:active,.pagination a:active{background-color:' . $colors['veryDarken'] . '}'; $css .= '.button:active,button[type=\'submit\']:active,.pagination a:active{background-color:' . $colors['veryDarken'] . '}';
$colors = helper::colorVariants($this->getData(['theme', 'title', 'textColor'])); $colors = helper::colorVariants($this->getData(['theme', 'title', 'textColor']));
$css .= 'h1,h2,h3,h4,h5,h6{color:' . $colors['normal'] . ';font-family:"' . str_replace('+', ' ', $this->getData(['theme', 'title', 'font'])) . '",sans-serif;font-weight:' . $this->getData(['theme', 'title', 'fontWeight']) . ';text-transform:' . $this->getData(['theme', 'title', 'textTransform']) . '}'; $css .= 'h1,h2,h3,h4,h5,h6{color:' . $colors['normal'] . ';font-family:"' . str_replace('+', ' ', $this->getData(['theme', 'title', 'font'])) . '",sans-serif;font-weight:' . $this->getData(['theme', 'title', 'fontWeight']) . ';text-transform:' . $this->getData(['theme', 'title', 'textTransform']) . '}';
// Les blocs
$colors = helper::colorVariants($this->getData(['theme', 'block', 'backgroundColor']));
$css .= '.block {border: 1px solid ' . $this->getdata(['theme','block','borderColor']) . ';}.block h4 {background:'. $colors['normal'] . ';color:' . $colors['text'] .';}';
// Bannière // Bannière
$colors = helper::colorVariants($this->getData(['theme', 'header', 'backgroundColor'])); $colors = helper::colorVariants($this->getData(['theme', 'header', 'backgroundColor']));
if($this->getData(['theme', 'header', 'margin'])) { if($this->getData(['theme', 'header', 'margin'])) {

View File

@ -829,7 +829,7 @@ footer #footerSocials .zwiico-github:hover {
/* Bloc */ /* Bloc */
.block { .block {
border: 1px solid #D8DFE3; /* border: 1px solid #D8DFE3;*/
padding: 20px 20px 10px; padding: 20px 20px 10px;
margin: 20px 0; margin: 20px 0;
word-wrap: break-word; word-wrap: break-word;
@ -844,7 +844,7 @@ footer #footerSocials .zwiico-github:hover {
.block h4 { .block h4 {
margin: -20px -20px 10px -20px; margin: -20px -20px 10px -20px;
padding: 10px; padding: 10px;
background: #ECEFF1; /* background: #ECEFF1;*/
} }
/* Aides */ /* Aides */

View File

@ -144,11 +144,15 @@ class init extends common {
'shadow' => '0', 'shadow' => '0',
'width' => '960px' 'width' => '960px'
], ],
'block' => [
'backgroundBlockColor' => 'rgba(236, 239, 241, 1)',
'borderColor' => 'rgba(236, 239, 241, 1)'
],
'text' => [ 'text' => [
'font' => 'Open+Sans', 'font' => 'Open+Sans',
'fontSize' => '13px', 'fontSize' => '13px',
'textColor' => 'rgba(33, 34, 35, 1)', 'textColor' => 'rgba(33, 34, 35, 1)',
'linkTextColor' => 'rgba(74, 105, 189, 1)' 'linkColor' => 'rgba(74, 105, 189, 1)'
], ],
'title' => [ 'title' => [
'font' => 'Oswald', 'font' => 'Oswald',
@ -174,7 +178,7 @@ class init extends common {
'backgroundColorButtonRed' => 'rgba(231, 76, 60, 1)', 'backgroundColorButtonRed' => 'rgba(231, 76, 60, 1)',
'backgroundColorButtonGreen' => 'rgba(57, 112, 12, 1)', 'backgroundColorButtonGreen' => 'rgba(57, 112, 12, 1)',
'backgroundBlockColor' => 'rgba(236, 239, 241, 1)', 'backgroundBlockColor' => 'rgba(236, 239, 241, 1)',
'borderBlockColor' => 'rgba(236, 239, 241, 1)', 'borderBlockColor' => 'rgba(236, 239, 241, 1)'
], ],
]; ];

View File

@ -568,18 +568,22 @@ class theme extends common {
'font' => $this->getInput('themeTextFont'), 'font' => $this->getInput('themeTextFont'),
'fontSize' => $this->getInput('themeTextFontSize'), 'fontSize' => $this->getInput('themeTextFontSize'),
'textColor' => $this->getInput('themeTextTextColor'), 'textColor' => $this->getInput('themeTextTextColor'),
'linkTextColor'=> $this->getInput('themeTextLinkTextColor') 'linkColor'=> $this->getInput('themeTextLinkColor')
]]); ]]);
$this->setData(['theme', 'site', [ $this->setData(['theme', 'site', [
'backgroundColor' => $this->getInput('themeSiteBackgroundColor'), 'backgroundColor' => $this->getInput('themeSiteBackgroundColor'),
'radius' => $this->getInput('themeSiteRadius'), 'radius' => $this->getInput('themeSiteRadius'),
'shadow' => $this->getInput('themeSiteShadow'), 'shadow' => $this->getInput('themeSiteShadow'),
'width' => $this->getInput('themeSiteWidth'), 'width' => $this->getInput('themeSiteWidth'),
'margin' => $this->getInput('themeSiteMargin',helper::FILTER_BOOLEAN), 'margin' => $this->getInput('themeSiteMargin',helper::FILTER_BOOLEAN)
]]); ]]);
$this->setData(['theme', 'button', [ $this->setData(['theme', 'button', [
'backgroundColor' => $this->getInput('themeButtonBackgroundColor'), 'backgroundColor' => $this->getInput('themeButtonBackgroundColor')
]]); ]]);
$this->setData(['theme', 'block', [
'backgroundColor' => $this->getInput('themeBlockBackgroundColor'),
'borderColor' => $this->getInput('themeBlockBorderColor')
]]);
// Valeurs en sortie // Valeurs en sortie
$this->addOutput([ $this->addOutput([
'notification' => 'Modifications enregistrées', 'notification' => 'Modifications enregistrées',

View File

@ -8,13 +8,7 @@
'value' => 'Retour' 'value' => 'Retour'
]); ?> ]); ?>
</div> </div>
<div class="col2"> <div class="col2 offset6">
<?php echo template::button('configHome', [
'href' => helper::baseUrl() ,
'value' => 'Accueil'
]); ?>
</div>
<div class="col2 offset4">
<?php echo template::button('configAdminReset', [ <?php echo template::button('configAdminReset', [
'class' => 'buttonRed', 'class' => 'buttonRed',
'href' => helper::baseUrl() . 'theme/resetAdmin', 'href' => helper::baseUrl() . 'theme/resetAdmin',

View File

@ -51,7 +51,6 @@ $("input, select").on("change", function() {
} else { } else {
css += "nav a:hover{background-color:" + $("#themeMenuActiveColor").val() + ";color:" + $('#themeMenuActiveTextColor').val() + ";}"; css += "nav a:hover{background-color:" + $("#themeMenuActiveColor").val() + ";color:" + $('#themeMenuActiveTextColor').val() + ";}";
} }
console.log(css);
// Taille, hauteur, épaisseur et capitalisation de caractères du menu // Taille, hauteur, épaisseur et capitalisation de caractères du menu
css += "#toggle span,#menu a{padding:" + $("#themeMenuHeight").val() + ";font-family:'" + menuFont.replace(/\+/g, " ") + "',sans-serif;font-weight:" + $("#themeMenuFontWeight").val() + ";font-size:" + $("#themeMenuFontSize").val() + ";text-transform:" + $("#themeMenuTextTransform").val() + "}"; css += "#toggle span,#menu a{padding:" + $("#themeMenuHeight").val() + ";font-family:'" + menuFont.replace(/\+/g, " ") + "',sans-serif;font-weight:" + $("#themeMenuFontWeight").val() + ";font-size:" + $("#themeMenuFontSize").val() + ";text-transform:" + $("#themeMenuTextTransform").val() + "}";
// Alignement du menu // Alignement du menu

View File

@ -15,9 +15,9 @@
<div class="row"> <div class="row">
<div class="col12"> <div class="col12">
<div class="block"> <div class="block">
<h4>Couleurs</h4> <h4>Couleur</h4>
<div class="row"> <div class="row">
<div class="col3"> <div class="col6">
<?php echo template::text('themeMenuTextColor', [ <?php echo template::text('themeMenuTextColor', [
'class' => 'colorPicker', 'class' => 'colorPicker',
'help' => 'Le curseur horizontal règle le niveau de transparence.', 'help' => 'Le curseur horizontal règle le niveau de transparence.',
@ -25,36 +25,43 @@
'value' => $this->getData(['theme', 'menu', 'textColor']) 'value' => $this->getData(['theme', 'menu', 'textColor'])
]); ?> ]); ?>
</div> </div>
<div class="col3"> <div class="col6">
<?php echo template::text('themeMenuBackgroundColor', [ <?php echo template::text('themeMenuBackgroundColor', [
'class' => 'colorPicker', 'class' => 'colorPicker',
'help' => 'Le curseur horizontal règle le niveau de transparence.', 'help' => 'Le curseur horizontal règle le niveau de transparence.',
'label' => 'Fond', 'label' => 'Fond',
'value' => $this->getData(['theme', 'menu', 'backgroundColor']) 'value' => $this->getData(['theme', 'menu', 'backgroundColor'])
]); ?> ]); ?>
</div> </div>
<div class="col3">
<?php echo template::text('themeMenuActiveTextColor', [
'class' => 'colorPicker',
'help' => 'Le curseur horizontal règle le niveau de transparence.',
'label' => 'Texte page active',
'value' => $this->getData(['theme', 'menu', 'activeTextColor'])
]); ?>
</div>
<div class="col3 verticalAlignBottom">
<?php
echo template::checkbox('themeMenuActiveColorAuto', true, 'Fond automatique.', [
'checked' => $this->getData(['theme', 'menu', 'activeColorAuto']),
'help' => 'La couleur de fond de la page active peut être définie automatique ou selon une couleur définie, comme par exemple celle de fond des pages.'
]); ?>
</div>
</div> </div>
<div class="row"> </div>
<div class="col3 offset9"> </div>
</div>
<div class="row">
<div class="col12">
<div class="block">
<h4>Page active</h4>
<div class="row">
<div class="col4">
<?php echo template::text('themeMenuActiveTextColor', [
'class' => 'colorPicker',
'help' => 'Le curseur horizontal règle le niveau de transparence.',
'label' => 'Texte',
'value' => $this->getData(['theme', 'menu', 'activeTextColor'])
]); ?>
</div>
<div class="col4 verticalAlignBottom">
<?php
echo template::checkbox('themeMenuActiveColorAuto', true, 'Couleur du fond automatique', [
'checked' => $this->getData(['theme', 'menu', 'activeColorAuto']),
'help' => 'La couleur de fond de la page active peut être définie automatique ou selon une couleur définie, comme par exemple celle de fond des pages.'
]); ?>
</div>
<div class="col4">
<?php echo template::text('themeMenuActiveColor', [ <?php echo template::text('themeMenuActiveColor', [
'class' => 'colorPicker', 'class' => 'colorPicker',
'help' => 'Couleur de fond de la page sélectionnée dans le menu.<br>Le curseur horizontal règle le niveau de transparence.', 'help' => 'Couleur de fond de la page sélectionnée dans le menu.<br>Le curseur horizontal règle le niveau de transparence.',
'label' => 'Fond active', 'label' => 'Fond',
'value' => $this->getData(['theme', 'menu', 'activeColor']) 'value' => $this->getData(['theme', 'menu', 'activeColor'])
]); ?> ]); ?>
</div> </div>

View File

@ -14,13 +14,6 @@
* Chargement de l'aperçu * Chargement de l'aperçu
*/ */
$( document).ready(function() { $( document).ready(function() {
updateDOM();
});
/**
* Aperçu en direct
*/
$("input, select").on("change",function() {
/** /**
* Option de marge si la taille n'est pas fluide * Option de marge si la taille n'est pas fluide
*/ */
@ -30,77 +23,94 @@ $("input, select").on("change",function() {
} else { } else {
$("#themeSiteMargin").addClass("enabled"); $("#themeSiteMargin").addClass("enabled");
} }
updateDOM(); var backgroundImage = <?php echo json_encode(helper::baseUrl(false) . self::FILE_DIR . 'source/' . $this->getData(['theme','body','image'])); ?>;
var backgroundcolor = <?php echo json_encode($this->getdata(['theme','body','backgroundColor'])); ?>;
css = "div.bodybackground{background-color:" + backgroundcolor + "; background-image: url(" + backgroundImage + ");background-size:cover;}";
css += "div.bgPreview{padding: 5px;background-color:" + $("#themeSiteBackgroundColor").val() + ";}";
$("#themePreview").remove();
$("<style>")
.attr("type", "text/css")
.attr("id", "themePreview")
.text(css)
.appendTo("head");
}); });
/**
* Aperçu en direct
*/
$("input, select").on("change",function() {
function updateDOM() { /**
* Aperçu dans la boîte
*/
/** // Import des polices de caractères
* Aperçu dans la boîte var titleFont = $("#themeTitleFont").val();
*/ var textFont = $("#themeTextFont").val();
var css = "@import url('https://fonts.googleapis.com/css?family=" + titleFont + "|" + textFont + "');";
// Couleurs des boutons
var colors = core.colorVariants($("#themeButtonBackgroundColor").val());
css += ".button.buttonSubmitPreview{background-color:" + colors.normal + ";}";
css += ".button.buttonSubmitPreview:hover{background-color:" + colors.darken + "}";
css += ".button.buttonSubmitPreview{color:" + colors.text + ";}";
// Import des polices de caractères // Couleurs des liens
var titleFont = $("#themeTitleFont").val(); var colors = core.colorVariants($("#themeTextLinkColor").val());
var textFont = $("#themeTextFont").val(); css += "a.urlPreview{color:" + colors.normal + "}";
var css = "@import url('https://fonts.googleapis.com/css?family=" + titleFont + "|" + textFont + "');"; css += "a.urlPreview:hover{color:" + colors.darken + "}";
// Couleurs des boutons // Couleur, polices, épaisseur et capitalisation de caractères des titres
var colors = core.colorVariants($("#themeButtonBackgroundColor").val()); css += ".headerPreview,.headerPreview{color:" + $("#themeTitleTextColor").val() + ";font-family:'" + titleFont.replace(/\+/g, " ") + "',sans-serif;font-weight:" + $("#themeTitleFontWeight").val() + ";text-transform:" + $("#themeTitleTextTransform").val() + "}";
css += ".button.buttonSubmitPreview{background-color:" + colors.normal + ";}"; // Police de caractères
css += ".button.buttonSubmitPreview:hover{background-color:" + colors.darken + "}"; // Police + couleur
css += ".button.buttonSubmitPreview{color:" + colors.text + ";}"; css += ".textPreview,.urlPreview{color:" + $("#themeTextTextColor").val() + ";font-family:'" + textFont.replace(/\+/g, " ") + "',sans-serif; font-size:" + $("#themeTextFontSize").val() + ";}";
// Couleur des liens
//css += "a.preview,.buttonSubmitPreview{font-family:'" + textFont.replace(/\+/g, " ") + "',sans-serif}";
// Couleurs des liens // Taille du texte
colors = core.colorVariants($("#themeLinkTextColor").val()); // Couleur du texte
css += "a.urlPreview{color:" + colors.normal + "}"; css += "p.preview{color:" + $("#themeTextTextColor").val() + "}";
css += "a.urlPreview:hover{color:" + colors.darken + "}";
// Couleur, polices, épaisseur et capitalisation de caractères des titres
css += ".headerPreview,.headerPreview{color:" + $("#themeTitleTextColor").val() + ";font-family:'" + titleFont.replace(/\+/g, " ") + "',sans-serif;font-weight:" + $("#themeTitleFontWeight").val() + ";text-transform:" + $("#themeTitleTextTransform").val() + "}";
// Police de caractères
// Police + couleur
css += ".textPreview,.urlPreview{color:" + $("#themeTextTextColor").val() + ";font-family:'" + textFont.replace(/\+/g, " ") + "',sans-serif; font-size:" + $("#themeTextFontSize").val() + ";}";
// Couleur des liens
//css += "a.preview,.buttonSubmitPreview{font-family:'" + textFont.replace(/\+/g, " ") + "',sans-serif}";
// Taille du texte /**
// Couleur du texte * Aperçu réel
css += "p.preview{color:" + $("#themeTextTextColor").val() + "}"; */
/** // Taille du site
* Aperçu réel if ($("#themeSiteWidth").val() === "750px") {
*/ css += ".button, button{font-size:0.8em;}";
} else {
css += ".button, button{font-size:1em;}";
}
// Largeur du site
var margin = $("#themeSiteMargin").is(":checked") ? 0 : '20px' ;
css += ".container{max-width:" + $("#themeSiteWidth").val() + "}";
if ($("#themeSiteWidth").val() === "100%") {
css += "#site{margin: 0px auto;} body{margin:0 auto;} #bar{margin:0 auto;} body > header{margin:0 auto;} body > nav {margin: 0 auto;} body > footer {margin:0 auto;}";
} else {
css += "#site{margin: " + margin + " auto !important;} body{margin:0px 10px;} #bar{margin: 0 -10px;} body > header{margin: 0 -10px;} body > nav {margin: 0 -10px;} body > footer {margin: 0 -10px;} ";
}
// Couleur du site, arrondi sur les coins du site et ombre sur les bords du site
//css += "#site{background-color:" + $("#themeSiteBackgroundColor").val() + ";border-radius:" + $("#themeSiteRadius").val() + ";box-shadow:" + $("#themeSiteShadow").val() + " #212223}";
css += "#site{border-radius:" + $("#themeSiteRadius").val() + ";box-shadow:" + $("#themeSiteShadow").val() + " #212223}";
var backgroundImage = <?php echo json_encode(helper::baseUrl(false) . self::FILE_DIR . 'source/' . $this->getData(['theme','body','image'])); ?>;
var backgroundcolor = <?php echo json_encode($this->getdata(['theme','body','backgroundColor'])); ?>;
css += "div.bodybackground{background-color:" + backgroundcolor + "; background-image: url(" + backgroundImage + ");background-size:cover;}";
css += "div.bgPreview{padding: 5px;background-color:" + $("#themeSiteBackgroundColor").val() + ";}";
// Les blocs
// Taille du site var colors = core.colorVariants($("#themeBlockBackgroundColor").val());
if ($("#themeSiteWidth").val() === "750px") { css += ".block.preview {padding: 20px 20px 10px;margin: 20px 0; word-wrap: break-word;border-radius: 2px;border: 1px solid " + $("#themeBlockBorderColor").val() + ";}.block.preview h4.preview {background: " + colors.normal + ";color:" + colors.text + ";margin: -20px -20px 10px -20px; padding: 10px;}";
css += ".button, button{font-size:0.8em;}";
} else {
css += ".button, button{font-size:1em;}";
}
// Largeur du site
var margin = $("#themeSiteMargin").is(":checked") ? 0 : '20px' ;
css += ".container{max-width:" + $("#themeSiteWidth").val() + "}";
if ($("#themeSiteWidth").val() === "100%") {
css += "#site{margin: 0px auto;} body{margin:0 auto;} #bar{margin:0 auto;} body > header{margin:0 auto;} body > nav {margin: 0 auto;} body > footer {margin:0 auto;}";
} else {
css += "#site{margin: " + margin + " auto !important;} body{margin:0px 10px;} #bar{margin: 0 -10px;} body > header{margin: 0 -10px;} body > nav {margin: 0 -10px;} body > footer {margin: 0 -10px;} ";
}
// Couleur du site, arrondi sur les coins du site et ombre sur les bords du site
//css += "#site{background-color:" + $("#themeSiteBackgroundColor").val() + ";border-radius:" + $("#themeSiteRadius").val() + ";box-shadow:" + $("#themeSiteShadow").val() + " #212223}";
css += "#site{border-radius:" + $("#themeSiteRadius").val() + ";box-shadow:" + $("#themeSiteShadow").val() + " #212223}";
var backgroundImage = <?php echo json_encode(helper::baseUrl(false) . self::FILE_DIR . 'source/' . $this->getData(['theme','body','image'])); ?>;
var backgroundcolor = <?php echo json_encode($this->getdata(['theme','body','backgroundColor'])); ?>;
css += "div.bodybackground{background-color:" + backgroundcolor + "; background-image: url(" + backgroundImage + ");background-size:cover;}";
css += "div.bgPreview{background-color:" + $("#themeSiteBackgroundColor").val() + ";}";
/** /**
* Injection dans le DOM * Injection dans le DOM
*/ */
// Ajout du css au DOM // Ajout du css au DOM
$("#themePreview").remove(); $("#themePreview").remove();
$("<style>") $("<style>")
.attr("type", "text/css") .attr("type", "text/css")
.attr("id", "themePreview") .attr("id", "themePreview")
.text(css) .text(css)
.appendTo("head"); .appendTo("head");
} });

View File

@ -46,14 +46,32 @@
]); ?> ]); ?>
</div> </div>
<div class="col6"> <div class="col6">
<?php echo template::text('themeTextLinkTextColor', [ <?php echo template::text('themeTextLinkColor', [
'class' => 'colorPicker', 'class' => 'colorPicker',
'help' => 'Le curseur horizontal règle le niveau de transparence.', 'help' => 'Le curseur horizontal règle le niveau de transparence.',
'label' => 'Liens', 'label' => 'Liens',
'value' => $this->getData(['theme', 'text', 'linkTextColor']) 'value' => $this->getData(['theme', 'text', 'linkColor'])
]); ?> ]); ?>
</div> </div>
</div> </div>
<div class="row">
<div class="col6">
<?php echo template::text('themeBlockBackgroundColor', [
'class' => 'colorPicker',
'help' => 'Couleur visible en l\'absence d\'une image.<br />Le curseur horizontal règle le niveau de transparence.',
'label' => 'Arrière-plan des blocs',
'value' => $this->getData(['theme', 'block', 'backgroundColor'])
]); ?>
</div>
<div class="col6">
<?php echo template::text('themeBlockBorderColor', [
'class' => 'colorPicker',
'help' => 'Couleur visible en l\'absence d\'une image.<br />Le curseur horizontal règle le niveau de transparence.',
'label' => 'Bordure des blocs',
'value' => $this->getData(['theme', 'block', 'borderColor'])
]); ?>
</div>
</div>
<div class="row"> <div class="row">
<div class="col6 offset3"> <div class="col6 offset3">
<?php echo template::text('themeButtonBackgroundColor', [ <?php echo template::text('themeButtonBackgroundColor', [
@ -66,23 +84,28 @@
</div> </div>
</div> </div>
<div class="col4 bodybackground"> <div class="col4 bodybackground">
<div class="bgPreview"> <div class="bgPreview">
<div class="row"> <div class="row">
<div class="col12"> <div class="col8">
<h1 class="headerPreview">Titre </h1> <h1 class="headerPreview">Aperçu </h1>
<h3 class="headerPreview">Sous-Titre </h3> <h3 class="headerPreview">Sous-Titre </h3>
<p class="textPreview">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<p><a href="#" class="urlPreview">Lorem ipsum dolor sit amet.</a></p>
</div> </div>
</div> <div class="col4">
<div class="row">
<div class="col4 offset8">
<?php echo template::button('themeSiteSubmitButtonPreview', [ <?php echo template::button('themeSiteSubmitButtonPreview', [
'class' => 'buttonSubmitPreview', 'class' => 'buttonSubmitPreview',
'value' => 'Bouton' 'value' => 'Bouton'
]); ?> ]); ?>
</div> </div>
</div> </div>
<div class="row">
<div class="col12">
<div class="block preview">
<h4 class="preview">Block</h4>
<p class="textPreview">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<p><a href="#" class="urlPreview">Lorem ipsum dolor sit amet.</a></p>
</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>