Drupal
/
drupal
mirror of https://git.drupalcode.org/project/drupal.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Issue #1751436 by pguillard, rteijeiro, eli-f, dimaro, nod_, droplet, sashi.kiran: Selectors clean-up: bartik/color theme

8.1.x
Nathaniel Catchpole 2016-02-26 13:39:07 +09:00
parent ff06c79e2a
commit 321b0db1de
1 changed files with 15 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
core/themes/bartik/color/preview.js
View File

@ -8,7 +8,7 @@
Drupal.color = { Drupal.color = {
logoChanged: false, logoChanged: false,
callback: function (context, settings, form, farb, height, width) { callback: function (context, settings, $form) {
// Change the logo to be the real one. // Change the logo to be the real one.
if (!this.logoChanged) { if (!this.logoChanged) {
$('.color-preview .color-preview-logo img').attr('src', drupalSettings.color.logo); $('.color-preview .color-preview-logo img').attr('src', drupalSettings.color.logo);
@ -19,27 +19,31 @@
$('div').remove('.color-preview-logo'); $('div').remove('.color-preview-logo');
} }
var $colorPreview = $form.find('.color-preview');
var $colorPalette = $form.find('.js-color-palette');
// Solid background. // Solid background.
form.find('.color-preview').css('backgroundColor', $('.js-color-palette input[name="palette[bg]"]').val()); $colorPreview.css('backgroundColor', $colorPalette.find('input[name="palette[bg]"]').val());
// Text preview. // Text preview.
form.find('.color-preview .color-preview-main h2, .color-preview .preview-content').css('color', form.find('.js-color-palette input[name="palette[text]"]').val()); $colorPreview.find('.color-preview-main h2, .color-preview .preview-content').css('color', $colorPalette.find('input[name="palette[text]"]').val());
form.find('.color-preview .color-preview-content a').css('color', form.find('.js-color-palette input[name="palette[link]"]').val()); $colorPreview.find('.color-preview-content a').css('color', $colorPalette.find('input[name="palette[link]"]').val());
// Sidebar block. // Sidebar block.
form.find('.color-preview .color-preview-sidebar .color-preview-block').css('background-color', form.find('.js-color-palette input[name="palette[sidebar]"]').val()); var $colorPreviewBlock = $colorPreview.find('.color-preview-sidebar .color-preview-block');
form.find('.color-preview .color-preview-sidebar .color-preview-block').css('border-color', form.find('.js-color-palette input[name="palette[sidebarborders]"]').val()); $colorPreviewBlock.css('background-color', $colorPalette.find('input[name="palette[sidebar]"]').val());
$colorPreviewBlock.css('border-color', $colorPalette.find('input[name="palette[sidebarborders]"]').val());
// Footer wrapper background. // Footer wrapper background.
form.find('.color-preview .color-preview-footer-wrapper', form).css('background-color', form.find('.js-color-palette input[name="palette[footer]"]').val()); $colorPreview.find('.color-preview-footer-wrapper').css('background-color', $colorPalette.find('input[name="palette[footer]"]').val());
// CSS3 Gradients. // CSS3 Gradients.
var gradient_start = form.find('.js-color-palette input[name="palette[top]"]').val(); var gradient_start = $colorPalette.find('input[name="palette[top]"]').val();
var gradient_end = form.find('.js-color-palette input[name="palette[bottom]"]').val(); var gradient_end = $colorPalette.find('input[name="palette[bottom]"]').val();
form.find('.color-preview .color-preview-header').attr('style', 'background-color: ' + gradient_start + '; background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(' + gradient_start + '), to(' + gradient_end + ')); background-image: -moz-linear-gradient(-90deg, ' + gradient_start + ', ' + gradient_end + ');'); $colorPreview.find('.color-preview-header').attr('style', 'background-color: ' + gradient_start + '; background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(' + gradient_start + '), to(' + gradient_end + ')); background-image: -moz-linear-gradient(-90deg, ' + gradient_start + ', ' + gradient_end + ');');
form.find('.color-preview .color-preview-site-name').css('color', form.find('.js-color-palette input[name="palette[titleslogan]"]').val()); $colorPreview.find('.color-preview-site-name').css('color', $colorPalette.find('input[name="palette[titleslogan]"]').val());
} }
}; };
})(jQuery, Drupal, drupalSettings); })(jQuery, Drupal, drupalSettings);