Bug 1149520 - Move the font-size change to the container, so as not to repaint the toolbar. r=jaws, r=margaret

This commit is contained in:
Blake Winton 2015-04-07 13:43:57 -04:00
parent e90e49f6fc
commit 391c0ec25c
4 changed files with 39 additions and 39 deletions

View File

@ -74,7 +74,7 @@ body {
display: none;
text-align: center;
width: 100%;
font-size: 0.9rem;
font-size: 0.9em;
}
.header {
@ -101,7 +101,7 @@ body {
}
.header > h1 {
font-size: 1.33rem;
font-size: 1.33em;
font-weight: 700;
line-height: 1.1em;
width: 100%;
@ -146,16 +146,16 @@ body {
/* This covers caption, domain, and credits
texts in the reader UI */
.content .wp-caption-text,
.content figcaption,
#moz-reader-content .wp-caption-text,
#moz-reader-content figcaption,
.header > .domain,
.header > .credits {
font-size: 0.9rem;
font-size: 0.9em;
}
.content {
#moz-reader-content {
display: none;
font-size: 1rem;
font-size: 1em;
}
.content a {
@ -175,7 +175,7 @@ body {
height: auto !important;
}
.content p {
#moz-reader-content p {
line-height: 1.4em !important;
margin: 0px !important;
margin-bottom: 20px !important;
@ -258,8 +258,8 @@ body {
border-left-color: #777777 !important;
}
.content ul,
.content ol {
#moz-reader-content ul,
#moz-reader-content ol {
margin: 0px !important;
margin-bottom: 20px !important;
padding: 0px !important;

View File

@ -48,7 +48,7 @@ let AboutReader = function(mm, win, articlePromise) {
this._domainElementRef = Cu.getWeakReference(doc.getElementById("reader-domain"));
this._titleElementRef = Cu.getWeakReference(doc.getElementById("reader-title"));
this._creditsElementRef = Cu.getWeakReference(doc.getElementById("reader-credits"));
this._contentElementRef = Cu.getWeakReference(doc.getElementById("reader-content"));
this._contentElementRef = Cu.getWeakReference(doc.getElementById("moz-reader-content"));
this._toolbarElementRef = Cu.getWeakReference(doc.getElementById("reader-toolbar"));
this._messageElementRef = Cu.getWeakReference(doc.getElementById("reader-message"));
@ -354,13 +354,13 @@ AboutReader.prototype = {
},
_setFontSize: function Reader_setFontSize(newFontSize) {
let htmlClasses = this._doc.documentElement.classList;
let containerClasses = this._doc.getElementById("container").classList;
if (this._fontSize > 0)
htmlClasses.remove("font-size" + this._fontSize);
containerClasses.remove("font-size" + this._fontSize);
this._fontSize = newFontSize;
htmlClasses.add("font-size" + this._fontSize);
containerClasses.add("font-size" + this._fontSize);
this._mm.sendAsyncMessage("Reader:SetIntPref", {
name: "reader.font_size",

View File

@ -19,7 +19,7 @@
<div id="reader-credits" class="credits"></div>
</div>
<div id="reader-content" class="content">
<div id="moz-reader-content" class="content">
</div>
<div id="reader-message" class="message">

View File

@ -93,7 +93,7 @@ body.loaded {
display: none;
text-align: center;
width: 100%;
font-size: 0.9rem;
font-size: 0.9em;
}
/* Header */
@ -104,8 +104,8 @@ body.loaded {
}
.domain {
font-size: 0.9rem;
line-height: 1.33rem;
font-size: 0.9em;
line-height: 1.48em;
padding-bottom: 4px;
font-family: "Fira Sans", Helvetica, Arial, sans-serif;
text-decoration: none;
@ -123,16 +123,16 @@ body.loaded {
}
.header > h1 {
font-size: 1.33rem;
line-height: 1.66rem;
font-size: 1.33em;
line-height: 1.25em;
width: 100%;
margin: 30px 0;
padding: 0;
}
.header > .credits {
font-size: 0.9rem;
line-height: 1.33rem;
font-size: 0.9em;
line-height: 1.48em;
margin: 0 0 30px 0;
padding: 0;
font-style: italic;
@ -140,10 +140,10 @@ body.loaded {
/* Content */
.content {
#moz-reader-content {
display: none;
font-size: 1rem;
line-height: 1.6rem;
font-size: 1em;
line-height: 1.6em;
}
.content h1,
@ -152,19 +152,19 @@ body.loaded {
font-weight: bold;
}
.content h1 {
font-size: 1.33rem;
line-height: 1.66rem;
#moz-reader-content h1 {
font-size: 1.33em;
line-height: 1.25em;
}
.content h2 {
font-size: 1.1rem;
line-height: 1.66rem;
#moz-reader-content h2 {
font-size: 1.1em;
line-height: 1.51em;
}
.content h3 {
font-size: 1rem;
line-height: 1.66rem;
#moz-reader-content h3 {
font-size: 1em;
line-height: 1.66em;
}
.content a {
@ -208,11 +208,11 @@ body.loaded {
margin-right: auto;
}
.content .caption,
.content .wp-caption-text,
.content figcaption {
font-size: 0.9rem;
line-height: 1.33rem;
#moz-reader-content .caption,
#moz-reader-content .wp-caption-text,
#moz-reader-content figcaption {
font-size: 0.9em;
line-height: 1.48em;
font-style: italic;
}