Merge pull request #213 from readium/fix-defaultLineLength

JayPanoz · web-flow · commit 2e8c3e419902 · 2026-02-19T15:16:13.000+01:00
Update DefaultLineLength value
diff --git a/css/dist/ReadiumCSS-after.css b/css/dist/ReadiumCSS-after.css
@@ -27,7 +27,7 @@
 
   --RS__pageGutter:0;
 
-  --RS__defaultLineLength:40rem;
+  --RS__defaultLineLength:100%;
 
   --RS__colGap:0;
 
diff --git a/css/dist/cjk-horizontal/ReadiumCSS-after.css b/css/dist/cjk-horizontal/ReadiumCSS-after.css
@@ -27,7 +27,7 @@
 
   --RS__pageGutter:0;
 
-  --RS__defaultLineLength:40rem;
+  --RS__defaultLineLength:100%;
 
   --RS__colGap:0;
 
diff --git a/css/dist/cjk-vertical/ReadiumCSS-after.css b/css/dist/cjk-vertical/ReadiumCSS-after.css
@@ -27,7 +27,7 @@
 
    --RS__pageGutter:0;
 
-   --RS__defaultLineLength:40rem;
+   --RS__defaultLineLength:100%;
 
    --RS__colGap:0;
 
diff --git a/css/dist/rtl/ReadiumCSS-after.css b/css/dist/rtl/ReadiumCSS-after.css
@@ -27,7 +27,7 @@
 
   --RS__pageGutter:0;
 
-  --RS__defaultLineLength:40rem;
+  --RS__defaultLineLength:100%;
 
   --RS__colGap:0;
 
diff --git a/css/vars/pagination.json b/css/vars/pagination.json
@@ -2,7 +2,7 @@
   "RS__colWidth": "100vw",
   "RS__colCount": 1,
   "RS__colGap": 0,
-  "RS__defaultLineLength": "40rem",
+  "RS__defaultLineLength": "100%",
   "RS__pageGutter": 0,
   "RS__viewportWidth": "100%"
 }
diff --git a/docs/CSS03-injection_and_pagination.md b/docs/CSS03-injection_and_pagination.md
@@ -123,7 +123,7 @@ The inline (horizontal by default, vertical in vertical-writing) page margins.
 --RS__defaultLineLength
 ```
 
-The default line-length when none is set by the user. It should be set in `rem` in order to take `:root`’s `font-size` as a reference, whichever the `body`’s `font-size` might be.
+The default line-length when none is set by the user. It represents the `max-width` of the `body` element and is `100%` by default so that it does not conflict with the the zoom factor.
 
 * * *
 
diff --git a/docs/CSS19-api.md b/docs/CSS19-api.md
@@ -273,7 +273,7 @@ The inline (horizontal by default, vertical in vertical-writing) page margins.
 --RS__defaultLineLength
 ```
 
-The default line-length when none is set by the user. It must be set in `rem` in order to take `:root`’s `font-size` as a reference, whichever the `body`’s `font-size` might be.
+The default line-length when none is set by the user. It represents the `max-width` of the `body` element and is `100%` by default so that it does not conflict with the the zoom factor.
 
 ### Scroll
 
diff --git a/docs/CSS28-migration_guide.md b/docs/CSS28-migration_guide.md
@@ -274,4 +274,10 @@ As of version `2.0.0` (stable), the `--RS__pageGutter` property no longer applie
 
 **This is a breaking change.**
 
-If you need to apply padding to the scroll view, you can use the `--RS__scrollPadding` properties instead. This can be useful to get around safe area insets, or to add whitespace so that contents are not hidden behind UI elements.
+If you need to apply padding to the scroll view, you can use the `--RS__scrollPadding` properties instead. This can be useful to get around safe area insets, or to add whitespace so that contents are not hidden behind UI elements.
+
+## Default line-length value has changed
+
+As of version `2.0.0` (stable), the default line-length when none is set by the user is `100%` instead of `40rem`. This is to prevent conflicts with the zoom factor.
+
+The custom property has been kept so that consumers of ReadiumCSS can still customize the value if they wish, especially as they can opt out of the new font-size implementation.
diff --git a/docs/ReadiumCSS_docs.epub b/docs/ReadiumCSS_docs.epub
diff --git a/docs/ReadiumCSS_docs/OEBPS/Text/Section-003.xhtml b/docs/ReadiumCSS_docs/OEBPS/Text/Section-003.xhtml
@@ -160,7 +160,7 @@
 
           <pre><code>--RS__defaultLineLength</code></pre>
 
-          <p>The default line-length when none is set by the user. It must be set in <code>rem</code> in order to take <code>:root</code>’s <code>font-size</code> as a reference, whichever the <code>body</code>’s <code>font-size</code> might be.</p>
+          <p>The default line-length when none is set by the user. It represents the <code>max-width</code> of the <code>body</code> element and is <code>100%</code> by default so that it does not conflict with the the zoom factor.</p>
 
       <hr/>
 
diff --git a/docs/ReadiumCSS_docs/OEBPS/Text/Section-019.xhtml b/docs/ReadiumCSS_docs/OEBPS/Text/Section-019.xhtml
@@ -247,7 +247,7 @@
 
         <pre><code>--RS__defaultLineLength</code></pre>
 
-        <p>The default line-length when none is set by the user. It must be set in <code>rem</code> in order to take <code>:root</code>’s <code>font-size</code> as a reference, whichever the <code>body</code>’s <code>font-size</code> might be.</p>
+        <p>The default line-length when none is set by the user. It represents the <code>max-width</code> of the <code>body</code> element and is <code>100%</code> by default so that it does not conflict with the the zoom factor.</p>
       </section>
 
       <section id="scroll" class="level3">
diff --git a/docs/ReadiumCSS_docs/OEBPS/Text/Section-028.xhtml b/docs/ReadiumCSS_docs/OEBPS/Text/Section-028.xhtml
@@ -330,6 +330,14 @@ const backgroundColor = defaultColors.RS__backgroundColor;</code></pre>
 
       <p>If you need to apply padding to the scroll view, you can use the <code>--RS__scrollPadding</code> properties instead. This can be useful to get around safe area insets, or to add whitespace so that contents are not hidden behind UI elements.</p>
     </section>
+    
+    <section id="default-line-length-value-changed" class="level2">
+      <h2 id="sigil_toc_id_225">Default line-length value has changed</h2>
+
+      <p>As of version <code>2.0.0</code> (stable), the default line-length when none is set by the user is <code>100%</code> instead of <code>40rem</code>. This is to prevent conflicts with the zoom factor.</p>
+
+      <p>The custom property has been kept so that consumers of ReadiumCSS can still customize the value if they wish, especially as they can opt out of the new font-size implementation.</p>
+    </section>
   </section>
 </body>
 </html>
diff --git a/docs/ReadiumCSS_docs/OEBPS/Text/nav.xhtml b/docs/ReadiumCSS_docs/OEBPS/Text/nav.xhtml
@@ -779,6 +779,9 @@
         <li>
           <a href="../Text/Section-028.xhtml#sigil_toc_id_224">PageGutter no longer applies in scroll view</a>
         </li>
+        <li>
+          <a href="../Text/Section-028.xhtml#sigil_toc_id_225">Default line-length value has changed</a>
+        </li>
       </ol>
       </li>
     </ol>
diff --git a/docs/ReadiumCSS_docs/OEBPS/toc.ncx b/docs/ReadiumCSS_docs/OEBPS/toc.ncx
@@ -1425,6 +1425,12 @@
       </navLabel>
       <content src="Text/Section-028.xhtml#sigil_toc_id_224" />
     </navPoint>
+    <navPoint id="navPoint237">
+      <navLabel>
+        <text>Default line-length value has changed</text>
+      </navLabel>
+      <content src="Text/Section-028.xhtml#sigil_toc_id_225" />
+    </navPoint>
   </navPoint>
 </navMap>
 </ncx>

Original file line number	Diff line number	Diff line change
`@@ -2,7 +2,7 @@`
`2`	`2`	`"RS__colWidth": "100vw",`
`3`	`3`	`"RS__colCount": 1,`
`4`	`4`	`"RS__colGap": 0,`
`5`		`- "RS__defaultLineLength": "40rem",`
	`5`	`+ "RS__defaultLineLength": "100%",`
`6`	`6`	`"RS__pageGutter": 0,`
`7`	`7`	`"RS__viewportWidth": "100%"`
`8`	`8`	`}`