diff options
| author | monikamaheshwari <monikamaheshwari1996@gmail.com> | 2019-04-27 09:15:22 -0400 |
|---|---|---|
| committer | Ascrod <32915892+Ascrod@users.noreply.github.com> | 2019-04-27 09:15:22 -0400 |
| commit | 0612246b04c12c10929f809c3c5a56da0780f0c1 (patch) | |
| tree | ddfa1a4574f431744852943152482385e7dde7b3 /toolkit | |
| parent | 742f5aa24d7f65b14a5c32e2685a89d84613e970 (diff) | |
| download | uxp-0612246b04c12c10929f809c3c5a56da0780f0c1.tar.gz | |
Bug 1422680 - simplify aboutReader.css font-size classes using CSS variables r=Gijs
Diffstat (limited to 'toolkit')
| -rw-r--r-- | toolkit/components/reader/AboutReader.jsm | 9 | ||||
| -rw-r--r-- | toolkit/themes/shared/aboutReader.css | 38 |
2 files changed, 5 insertions, 42 deletions
diff --git a/toolkit/components/reader/AboutReader.jsm b/toolkit/components/reader/AboutReader.jsm index 6ec959eba5..4cc9d67509 100644 --- a/toolkit/components/reader/AboutReader.jsm +++ b/toolkit/components/reader/AboutReader.jsm @@ -276,13 +276,10 @@ AboutReader.prototype = { }, _setFontSize(newFontSize) { - let containerClasses = this._containerElement.classList; - - if (this._fontSize > 0) - containerClasses.remove("font-size" + this._fontSize); - this._fontSize = newFontSize; - containerClasses.add("font-size" + this._fontSize); + let size = (10 + 2 * this._fontSize) + "px"; + + this._containerElement.style.setProperty("--font-size", size); return AsyncPrefs.set("reader.font_size", this._fontSize); }, diff --git a/toolkit/themes/shared/aboutReader.css b/toolkit/themes/shared/aboutReader.css index e685cf69fb..ff8f275654 100644 --- a/toolkit/themes/shared/aboutReader.css +++ b/toolkit/themes/shared/aboutReader.css @@ -47,44 +47,10 @@ body.serif .remove-button { } .container { + --font-size: 12; max-width: 30em; margin: 0 auto; -} - -.container.font-size1 { - font-size: 12px; -} - -.container.font-size2 { - font-size: 14px; -} - -.container.font-size3 { - font-size: 16px; -} - -.container.font-size4 { - font-size: 18px; -} - -.container.font-size5 { - font-size: 20px; -} - -.container.font-size6 { - font-size: 22px; -} - -.container.font-size7 { - font-size: 24px; -} - -.container.font-size8 { - font-size: 26px; -} - -.container.font-size9 { - font-size: 28px; + font-size: var(--font-size); } .container.content-width1 { |