crowdstart-checkout/lib/utils/theme.js

One Click Checkout for Crowdstart

// Generated by CoffeeScript 1.10.0
var $style, riot, theme;

riot = require('riot');

$style = $('<style>');

$('head').append($style);

theme = {
  currentTheme: {},
  setTheme: function(newTheme) {
    $.extend(theme.currentTheme, newTheme);
    return $style.html("/* Colors */\n.crowdstart-checkout {\n  background-color: " + theme.currentTheme.background + " !important;\n}\n\n.crowdstart-checkout a {\n  color: " + theme.currentTheme.dark + ";\n}\n\n.crowdstart-checkout a:visited {\n  color: " + theme.currentTheme.dark + ";\n}\n\n.crowdstart-promocode-button {\n  background-color: " + theme.currentTheme.promoCodeBackground + " !important;\n  color: " + theme.currentTheme.promoCodeForeground + " !important;\n}\n\n.crowdstart-button {\n  background-color: " + theme.currentTheme.calloutBackground + " !important;\n  color: " + theme.currentTheme.calloutForeground + " !important;\n}\n\n.crowdstart-checkout {\n  color: " + theme.currentTheme.dark + " !important;\n}\n\n.crowdstart-form-control input,\n.select2-container input {\n  border: 1px solid " + theme.currentTheme.medium + " !important;\n}\n\n.select2, .select2 *, .select2-selection {\n  color: " + theme.currentTheme.dark + " !important;\n  border-color: " + theme.currentTheme.medium + " !important;\n  background-color: transparent !important;\n}\n\n.select2-container--default\n.select2-selection--single\n.select2-selection__arrow b {\n  border-color: " + theme.currentTheme.dark + " transparent transparent transparent !important;\n}\n\n.select2-container--default {\n  background-color: transparent !important;\n  border-color: " + theme.currentTheme.medium + " !important;\n}\n\n.select2-dropdown {\n  background-color: " + theme.currentTheme.background + " !important;\n  border-color: " + theme.currentTheme.medium + " !important;\n}\n\n.crowdstart-sep {\n  border-bottom: 1px solid " + theme.currentTheme.medium + " !important;\n}\n\n.crowdstart-thankyou a {\n  color: " + theme.currentTheme.dark + " !important;\n}\n\n.crowdstart-thankyou a:visited {\n  color: " + theme.currentTheme.dark + " !important;\n}\n\ninput.crowdstart-error {\n  border-color: " + theme.currentTheme.error + " !important;\n}\n\n.crowdstart-message::before {\n  background-color: " + theme.currentTheme.error + " !important;\n}\n\n.crowdstart-message {\n  color: " + theme.currentTheme.light + " !important;\n  background-color: " + theme.currentTheme.error + " !important;\n}\n\n.crowdstart-show-promocode {\n  color: " + theme.currentTheme.showPromoCode + " !important;\n}\n\n.crowdstart-loader {\n  border-top: 1.1em solid " + theme.currentTheme.spinnerTrail + " !important;\n  border-right: 1.1em solid " + theme.currentTheme.spinnerTrail + " !important;\n  border-bottom: 1.1em solid " + theme.currentTheme.spinnerTrail + " !important;\n  border-left: 1.1em solid " + theme.currentTheme.spinner + " !important;\n}\n\n.crowdstart-progress li {\n  color: " + theme.currentTheme.dark + " !important;\n}\n\n.crowdstart-progress li:before {\n  color: " + theme.currentTheme.light + " !important;\n  background-color: " + theme.currentTheme.dark + " !important;\n}\n\n.crowdstart-progress li:after {\n  background: " + theme.currentTheme.dark + " !important;\n}\n\n.crowdstart-progress li.active {\n  color: " + theme.currentTheme.progress + " !important;\n}\n\n.crowdstart-progress li.active:before,  .crowdstart-progress li.active:after{\n  background: " + theme.currentTheme.progress + " !important;\n  color: " + theme.currentTheme.light + " !important;\n}\n\n.crowdstart-checkbox-control input[type=\"checkbox\"] + label .crowdstart-checkbox {\n  border: 1px solid " + theme.currentTheme.medium + " !important;\n}\n\n.crowdstart-checkbox-short-part {\n  background-color: " + theme.currentTheme.dark + " !important;\n}\n\n.crowdstart-checkbox-long-part {\n  background-color: " + theme.currentTheme.dark + " !important;\n}\n\n.select2-results__option--highlighted {\n  color: " + theme.currentTheme.light + " !important !important;\n}\n/* End Colors */\n\n/* Border Radius */\n.crowdstart-checkout {\n  border-radius: " + theme.currentTheme.borderRadius + "px !important;\n}\n\n.crowdstart-form-control input,\n.select2-container input {\n  border-radius: " + theme.currentTheme.borderRadius + "px !important;\n}\n\n.select2-dropdown {\n  border-radius: " + theme.currentTheme.borderRadius + "px !important;\n}\n\n.select2-selection {\n  border-radius: " + theme.currentTheme.borderRadius + "px !important;\n}\n\n.crowdstart-promocode-button {\n  border-radius: " + theme.currentTheme.borderRadius + "px !important;\n}\n\n.crowdstart-checkout-button, .crowdstart-error-button {\n  border-radius: " + theme.currentTheme.borderRadius + "px !important;\n}\n\n.crowdstart-progress li:before {\n  border-radius: " + (theme.currentTheme.borderRadius > 0 ? 3 : 0) + "px !important;\n}\n/* End Border Radius */\n\n/* Font Family */\n.crowdstart-checkout {\n  font-family: " + theme.currentTheme.fontFamily + ";\n}\n\n.select2 *, .select2-results *, .select2-container * {\n  font-family: " + theme.currentTheme.fontFamily + ";\n}\n\n.social__icon, [class^=\"social__icon\"] {\n  border-radius: " + (theme.currentTheme.borderRadius > 0 ? '100%' : '0px') + " !important;\n}\n\n/* End Font Family */\n\n/* Lock Icon */\n\n.icon-lock .lock-top-1, .icon-lock .lock-body {\n  background-color: " + theme.currentTheme.dark + " !important;\n}\n\n.icon-lock .lock-top-2, .icon-lock .lock-hole {\n  background-color: " + theme.currentTheme.background + " !important;\n}\n\n/* End Lock Icon */\n\n/* Tabs */\n\ntabs:before,\ntabs:after {\n  border-bottom: 1px solid " + theme.currentTheme.medium + " !important;\n}\n\ntabs > * {\n  border-bottom: 1px solid " + theme.currentTheme.medium + " !important;\n}\n\n.crowdstart-tab.crowdstart-tab-selected {\n  border: 1px solid " + theme.currentTheme.medium + " !important;\n  border-bottom: 0 !important;\n}\n\n/* End Tabs */");
  }
};

theme.setTheme({
  background: 'white',
  light: 'white',
  dark: 'lightslategray',
  medium: '#DDDDDD',
  error: 'red',
  promoCodeForeground: 'white',
  promoCodeBackground: 'lightslategray',
  calloutForeground: 'white',
  calloutBackground: '#27AE60',
  showPromoCode: 'steelblue',
  progress: '#27AE60',
  spinner: 'rgb(255,255,255)',
  spinnerTrail: 'rgba(255,255,255,0.2)',
  fontFamily: "'Helvetica Neue', Helvetica, Arial, sans-serif",
  borderRadius: 5
});

module.exports = theme;

//# sourceMappingURL=theme.js.map