Bug couleur de fond tinyMCE + aperçu du site

This commit is contained in:
fredtempez 2021-02-09 11:45:10 +01:00
parent 878b3ecbb1
commit a8438fb722
3 changed files with 32 additions and 14 deletions

View File

@ -1,5 +1,10 @@
# Changelog
## version 10.4.02
- Corrections :
- Thème : aperçu du site amélioré.
- Editeur de texte : couleur de fond parasite quand une image en arrière-plan est sélectionnée.
## version 10.4.01
Corrections :
- Module form, erreur de syntaxe.

View File

@ -1659,15 +1659,18 @@ class core extends common {
} else {
// Pas d'image couleur du body
$css .= 'html{background-color:' . $colors['normal'] . ';}';
// Même couleur dans le fond de l'éditeur
$css .= 'div.mce-edit-area{background-color:' . $colors['normal'] . ' !important}';
}
// Icône BacktoTop
$css .= '#backToTop {background-color:' .$this->getData(['theme', 'body', 'toTopbackgroundColor']). ';color:'.$this->getData(['theme', 'body', 'toTopColor']).';}';
// Site
$colors = helper::colorVariants($this->getData(['theme', 'text', 'linkColor']));
$css .= 'a{color:' . $colors['normal'] . '}';
// Fond TinyMCe
$css .= 'div.mce-edit-area{background-color:' . $colors['normal'] . ' !important}';
$css .= 'div.mce-edit-area{background-color:' . $colors['normal'] . ';font-family:"' . str_replace('+', ' ', $this->getData(['theme', 'text', 'font'])) . '",sans-serif}';
// Couleurs de site dans TinyMCe
$css .= 'div.mce-edit-area{font-family:"' . str_replace('+', ' ', $this->getData(['theme', 'text', 'font'])) . '",sans-serif}';
// Site dans TinyMCE
$css .= '.editorWysiwyg {background-color:' . $this->getData(['theme', 'site', 'backgroundColor']) . ';}';
//$css .= 'a:hover:not(.inputFile, button){color:' . $colors['darken'] . '}';
$css .= 'body,.row > div{font-size:' . $this->getData(['theme', 'text', 'fontSize']) . '}';
$css .= 'body{color:' . $this->getData(['theme', 'text', 'textColor']) . '}';
@ -1681,7 +1684,6 @@ class core extends common {
$css .= $this->getData(['theme', 'site', 'width']) === '100%' ? '#site.light{margin:5% auto !important;}#site{margin:0 auto !important;} body{margin:0 auto !important;} #bar{margin:0 auto !important;} body > header{margin:0 auto !important;} body > nav {margin: 0 auto !important;} body > footer {margin:0 auto !important;}': "#site.light{margin: 5% auto !important;}#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;} ";
$css .= $this->getData(['theme', 'site', 'width']) === '750px' ? '.button, button{font-size:0.8em;}' : '';
$css .= '#site{background-color:' . $this->getData(['theme', 'site', 'backgroundColor']) . ';border-radius:' . $this->getData(['theme', 'site', 'radius']) . ';box-shadow:' . $this->getData(['theme', 'site', 'shadow']) . ' #212223;}';
$css .= '.editorWysiwyg {background-color:' . $this->getData(['theme', 'site', 'backgroundColor']) . ';}';
$colors = helper::colorVariants($this->getData(['theme', 'button', 'backgroundColor']));
$css .= '.speechBubble,.button,.button:hover,button[type=\'submit\'],.pagination a,.pagination a:hover,input[type=\'checkbox\']:checked + label:before,input[type=\'radio\']:checked + label:before,.helpContent{background-color:' . $colors['normal'] . ';color:' . $colors['text'] . '}';
$css .= '.helpButton span{color:' . $colors['normal'] . '}';

View File

@ -13,7 +13,7 @@
/*
* Chargement de l'aperçu
*/
$(document).ready(function() {
$(document).ready(function() {
/**
* Option de marge si la taille n'est pas fluide
@ -34,7 +34,7 @@ $(document).ready(function() {
/**
* Aperçu en direct
*/
$("input, select").on("change",function() {
$("input, select").on("change",function() {
previewDOM();
});
@ -48,8 +48,8 @@ function previewDOM() {
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());
// 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 + ";}";
@ -90,16 +90,27 @@ function previewDOM() {
}
// 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}";
css += "#site{border-radius:" + $("#themeSiteRadius").val() + ";box-shadow:" + $("#themeSiteShadow").val() + " #212223}";
// Couleur ou image de fond
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;}";
console.log(backgroundImage);
var backgroundcolor = <?php echo json_encode($this->getdata(['theme','body','backgroundColor'])); ?>;
if(backgroundImage) {
css += "div.bodybackground{background-image:url(" + backgroundImage + ");background-repeat:" + $("#themeBodyImageRepeat").val() + ";background-position:" + $("#themeBodyImagePosition").val() + ";background-attachment:" + $("#themeBodyImageAttachment").val() + ";background-size:" + $("#themeBodyImageSize").val() + "}";
css += "div.bodybackground{background-color:rgba(0,0,0,0);}";
}
else {
css += "div.bodybackground{background-image:none}";
}
css += '#backToTop {background-color:' + backgroundcolor + ';color:' + $("#themeBodyToTopColor").val() + ';}';
css += "div.bgPreview{padding: 5px;background-color:" + $("#themeSiteBackgroundColor").val() + ";}";
// Les blocs
var colors = core.colorVariants($("#themeBlockBackgroundColor").val());
var colors = core.colorVariants($("#themeBlockBackgroundColor").val());
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;}";
/**