#683026 by jensimmons, JohnAlbin, Jeff Burnz, Jacine, stephthegeek, bleen18, smerrill, et al: New core theme: Bartik, a flexible, re-colorable theme with many regions that shows off what Drupal can do. Truly a team effort. :)

1 files changed, 37 insertions, 0 deletions

diff --git a/themes/bartik/color/preview.js b/themes/bartik/color/preview.js
new file mode 100644
index 000000000..7365f6f55
--- /dev/null
+++ b/themes/bartik/color/preview.js
@@ -0,0 +1,37 @@
+/* $Id$ */
+
+(function ($) {
+  Drupal.color = {
+    logoChanged: false,
+    callback: function(context, settings, form, farb, height, width) {
+      // Change the logo to be the real one.
+      if (!this.logoChanged) {
+        $('#preview #preview-logo img').attr('src', Drupal.settings.color.logo);
+        this.logoChanged = true;
+      }
+
+      // Solid background.
+      $('#preview', form).css('backgroundColor', $('#palette input[name="palette[bg]"]', form).val());
+
+      // Text preview.
+      $('#preview #preview-main h2, #preview #preview-main p', form).css('color', $('#palette input[name="palette[text]"]', form).val());
+      $('#preview #preview-content a', form).css('color', $('#palette input[name="palette[link]"]', form).val());
+
+      // Sidebar background.
+      $('#preview .sidebar .block', form).css('background-color', $('#palette input[name="palette[sidebar]"]', form).val());
+
+      // Footer background.
+      $('#preview #footer-wrapper', form).css('background-color', $('#palette input[name="palette[footer]"]', form).val());
+
+      $('#preview .sidebar .block', form).css('border-color', $('#palette input[name="palette[sidebarborders]"]', form).val());
+
+      // CSS3 Gradients.
+      var gradient_start = $('#palette input[name="palette[top]"]', form).val();
+      var gradient_end = $('#palette input[name="palette[bottom]"]', form).val();
+
+      $('#preview #preview-header', form).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 + ");");
+
+      $('#preview #preview-name-and-slogan a', form).css('color', $('#palette input[name="palette[titleslogan]"]', form).val());
+    }
+  };
+})(jQuery);