* Switch from SASS variables to CSS variables for most styling
These are the simple cases, and the more complex ones will be covered by future commits. I’ve also replaced $fooZ ± 1 with the appropriate variable to avoid a runtime `calc()`.
* Eliminate the `$style` variable 🔥
I’ve added a `--absolute` variable that’s `white` in dark mode and `black` in regular mode.
* Remove `$inputFocusBorder` 🔥
* Switch the Prism styles to CSS variables
* Convert `$mediumScreen` to a mixin
* 🔥 `$selectionText`
* Eliminate the final uses of SCSS variables
I’ve dropped the 95% opacity on the background of the method source code overlay in RDoc since the difference isn’t noticeable but it makes implementation a lot easier.
* Misc fixes
* Extract the common variables from the two themes to a new file
* Remove illegal usages of CSS variables in SCSS functions
This flattens out the buttons on the settings page which makes the styles simpler (and more modern-looking IMO) and removes the box-shadow on the button, which was completely invisible to me.
* Fix usages of SCSS functions in CSS variables
* Use `html._theme-*` selectors
* Eliminate `application-dark.css`; switch themes by toggling classes
This also means that the Application Cache doesn’t have to get updated when toggling themes, and a new CSS file that’s nearly the same doesn’t need to be downloaded.
- Set `document.scrollingElement` as the scrolling element
for scrolling to anchors when the app is mobile mode
to enhance support in newer browsers.
The CSS View Module spec considers `document.documentElement`/`<html>`
to be the standard scrolling element
and that is what appears to be used in the latest Firefox and Chrome.
However, some older browsers and even the current Safari
use `document.body` as the scrolling element
which is why I suspect the original code used `document.body`.
Since some browsers scroll on different elements,
`document.scrollingElement` exists
so the browser can tell us what to use
for scrolling to anchors work for all modern browsers.
Since `document.scrollingElement` is undefined in older browsers,
`document.body` is available as fallback mobile scrolling element.