logo

mastofe

My custom branche(s) on git.pleroma.social/pleroma/mastofe
commit: b535966ab57405b3f3514046056ca0022fa14397
parent: 02412429ab1432a1c61358dec1a162d0589573be
Author: Koala Yeung <koalay@gmail.com>
Date:   Sat, 13 May 2017 01:22:50 +0800

Allow SCSS variables to be overridden (#2987)

* Allow SCSS variables to be overridden with
  `app/javascript/pack/variables*.scss`

* Allow these SCSS variables to be overriden:
  * `$base-shadow-color`
  * `$base-overlay-background`
  * `$base-border-color`
  * `$simple-background-color`
  * `$primary-text-color`
  * `$valid-value-color
  * `$error-value-color`

Diffstat:

Mapp/javascript/mastodon/main.js6++++++
Mapp/javascript/styles/variables.scss14+++++++-------
2 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/app/javascript/mastodon/main.js b/app/javascript/mastodon/main.js @@ -1,3 +1,7 @@ +// allow override variables here +require.context('../../assets/stylesheets/', false, /variables.*\.scss$/); + +// import default stylesheet with variables require('font-awesome/css/font-awesome.css'); require('../styles/application.scss'); @@ -19,6 +23,8 @@ function main() { Rails.start(); require.context('../images/', true); + + // import customization styles require.context('../../assets/stylesheets/', false, /custom.*\.scss$/); onDomContentLoaded(() => { diff --git a/app/javascript/styles/variables.scss b/app/javascript/styles/variables.scss @@ -13,13 +13,13 @@ $classic-secondary-color: #d9e1e8; // Pattens Blue $classic-highlight-color: #2b90d9; // Summer Sky // Variables for defaults in UI -$base-shadow-color: $black; -$base-overlay-background: $black; -$base-border-color: $white; -$simple-background-color: $white; -$primary-text-color: $white; -$valid-value-color: $success-green; -$error-value-color: $error-red; +$base-shadow-color: $black !default; +$base-overlay-background: $black !default; +$base-border-color: $white !default; +$simple-background-color: $white !default; +$primary-text-color: $white !default; +$valid-value-color: $success-green !default; +$error-value-color: $error-red !default; // Tell UI to use selected colors $ui-base-color: $classic-base-color !default; // Darkest