summaryrefslogtreecommitdiff
path: root/toolkit
diff options
context:
space:
mode:
authormonikamaheshwari <monikamaheshwari1996@gmail.com>2019-04-27 09:15:22 -0400
committerAscrod <32915892+Ascrod@users.noreply.github.com>2019-04-27 09:15:22 -0400
commit0612246b04c12c10929f809c3c5a56da0780f0c1 (patch)
treeddfa1a4574f431744852943152482385e7dde7b3 /toolkit
parent742f5aa24d7f65b14a5c32e2685a89d84613e970 (diff)
downloaduxp-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.jsm9
-rw-r--r--toolkit/themes/shared/aboutReader.css38
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 {