Bug 427706

Description Mark Macdonald 2014-02-07 14:55:54 EST

There are currently 4 places where style rules are defined that affect the container styling in Orion. Details below. They are listed from least important to most important. (In other words, styles from (1) get overridden by styles from (2), which get overridden by (3), etc)

1) theme.css
============
* Static style rules.
* You might expect this to fully determine the page styling, but large portions get overridden by stuff below.

  ↑
  ↑  overrides
  ↑

2) ThemeData.js
===============
* Themes are defined here.
* Each theme contains mappings: Themeable Element -> color
* ThemeData has some static mappings as well (see lines 27-42). But AFAIK these are always overridden by the mappings inside each theme, so they are just a red herring that should be deleted.

  ↑
  ↑  overrides
  ↑

3) User's cached theme data in in localStorage
==============================================
* This is basically a copy of the theme data defined in (2), but sometimes gets out of sync.
* Once bug 427696 is fixed, (3) will cease to be a factor: it will always be identical to (2).

  ↑
  ↑  overrides
  ↑

4) ThemeSheetWriter.js 
======================
* The real boss of styling.
* Injects dynamic style rules into page based on user's chosen theme.
* Dynamic rules are constructed using Themeable Element -> color mappings provided by chosen theme.
* But other styles are mixed into the dynamic rules (eg. for stuff like font-size, padding, borders), using certain hard-coded values set in this file.
* Also certain ThemeableElement -> color mappings provided by theme get overridden with hard-coded values too. (for example, the banner  background color is always set to `this.navbar` which is currently "white".)
* The hard-coded values in in this file tend to get out-of-sync with the default values set by (1), as well as (2).


This needs to be cleaned up. It is very hard to understand, which hampers branding of custom Orion environments. Also, the various places can get out of sync with each other, which leads to hard-to-reproduce style bugs.