diff --git a/css/dist/ReadMe.md b/css/dist/ReadMe.md index 518fe62..a5588f5 100644 --- a/css/dist/ReadMe.md +++ b/css/dist/ReadMe.md @@ -27,10 +27,6 @@ Disabled user settings: - `hyphens`; - `letter-spacing`. -Added user settings: - -- `font-variant-ligatures` (mapped to `--USER__ligatures` CSS variable). - ## CJK Chinese, Japanese, Korean, and Mongolian can be either written `horizontal-tb` or `vertical-*`. Consequently, there are stylesheets for horizontal and vertical writing modes. @@ -52,6 +48,7 @@ Disabled user settings: - `text-align`; - `hyphens`; +- `ligatures`; - paragraphs’ indent; - `word-spacing`. @@ -88,6 +85,7 @@ Disabled user settings: - `column-count` (number of columns); - `text-align`; - `hyphens`; +- `ligatures`; - paragraphs’ indent; - `word-spacing`. diff --git a/css/dist/ReadiumCSS-after.css b/css/dist/ReadiumCSS-after.css index 1bca2bc..57d7c3c 100644 --- a/css/dist/ReadiumCSS-after.css +++ b/css/dist/ReadiumCSS-after.css @@ -1,5 +1,5 @@ /*! - * Readium CSS v.2.0.0-beta.21 + * Readium CSS v.2.0.0-beta.22 * Copyright (c) 2017–2025. Readium Foundation. All rights reserved. * Use of this source code is governed by a BSD-style license which is detailed in the * LICENSE file present in the project repository where this source code is maintained. @@ -297,10 +297,36 @@ body{ zoom:var(--USER__fontSize) !important; } -:root[style*="readium-iOSPatch-on"][style*="--USER__fontSize"] body{ +:root:not([style*="readium-deprecatedFontSize-on"])[style*="readium-iOSPatch-on"][style*="--USER__fontSize"] body{ -webkit-text-size-adjust:var(--USER__fontSize) !important; } +@supports selector(figure:has(> img)){ + + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> img), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> video), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> svg), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> canvas), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> iframe), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> audio), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> img), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> video), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> svg), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> canvas), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> iframe), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> audio), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] table{ + zoom:calc(100% / var(--USER__fontSize)) !important; + } + + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figcaption, + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] caption, + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] td, + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] th{ + zoom:var(--USER__fontSize) !important; + } +} + @supports not (zoom: 1){ :root[style*="--USER__fontSize"]{ @@ -366,6 +392,14 @@ body{ font-variant:none; } +:root[style*="--USER__ligatures"]{ + font-variant-ligatures:var(--USER__ligatures) !important; +} + +:root[style*="--USER__ligatures"] *{ + font-variant-ligatures:inherit !important; +} + :root[style*="--USER__fontWeight"] body{ font-weight:var(--USER__fontWeight) !important; } diff --git a/css/dist/ReadiumCSS-before.css b/css/dist/ReadiumCSS-before.css index 8345892..9e205d9 100644 --- a/css/dist/ReadiumCSS-before.css +++ b/css/dist/ReadiumCSS-before.css @@ -1,5 +1,5 @@ /*! - * Readium CSS v.2.0.0-beta.21 + * Readium CSS v.2.0.0-beta.22 * Copyright (c) 2017–2025. Readium Foundation. All rights reserved. * Use of this source code is governed by a BSD-style license which is detailed in the * LICENSE file present in the project repository where this source code is maintained. diff --git a/css/dist/ReadiumCSS-default.css b/css/dist/ReadiumCSS-default.css index f75faa1..58a8139 100644 --- a/css/dist/ReadiumCSS-default.css +++ b/css/dist/ReadiumCSS-default.css @@ -1,5 +1,5 @@ /*! - * Readium CSS v.2.0.0-beta.21 + * Readium CSS v.2.0.0-beta.22 * Copyright (c) 2017–2025. Readium Foundation. All rights reserved. * Use of this source code is governed by a BSD-style license which is detailed in the * LICENSE file present in the project repository where this source code is maintained. diff --git a/css/dist/cjk-horizontal/ReadiumCSS-after.css b/css/dist/cjk-horizontal/ReadiumCSS-after.css index 38b8282..724f104 100644 --- a/css/dist/cjk-horizontal/ReadiumCSS-after.css +++ b/css/dist/cjk-horizontal/ReadiumCSS-after.css @@ -1,5 +1,5 @@ /*! - * Readium CSS v.2.0.0-beta.21 + * Readium CSS v.2.0.0-beta.22 * Copyright (c) 2017–2025. Readium Foundation. All rights reserved. * Use of this source code is governed by a BSD-style license which is detailed in the * LICENSE file present in the project repository where this source code is maintained. @@ -221,10 +221,36 @@ body{ zoom:var(--USER__fontSize) !important; } -:root[style*="readium-iOSPatch-on"][style*="--USER__fontSize"] body{ +:root:not([style*="readium-deprecatedFontSize-on"])[style*="readium-iOSPatch-on"][style*="--USER__fontSize"] body{ -webkit-text-size-adjust:var(--USER__fontSize) !important; } +@supports selector(figure:has(> img)){ + + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> img), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> video), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> svg), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> canvas), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> iframe), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> audio), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> img), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> video), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> svg), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> canvas), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> iframe), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> audio), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] table{ + zoom:calc(100% / var(--USER__fontSize)) !important; + } + + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figcaption, + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] caption, + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] td, + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] th{ + zoom:var(--USER__fontSize) !important; + } +} + @supports not (zoom: 1){ :root[style*="--USER__fontSize"]{ diff --git a/css/dist/cjk-horizontal/ReadiumCSS-before.css b/css/dist/cjk-horizontal/ReadiumCSS-before.css index b14fea6..9d90c47 100644 --- a/css/dist/cjk-horizontal/ReadiumCSS-before.css +++ b/css/dist/cjk-horizontal/ReadiumCSS-before.css @@ -1,5 +1,5 @@ /*! - * Readium CSS v.2.0.0-beta.21 + * Readium CSS v.2.0.0-beta.22 * Copyright (c) 2017–2025. Readium Foundation. All rights reserved. * Use of this source code is governed by a BSD-style license which is detailed in the * LICENSE file present in the project repository where this source code is maintained. diff --git a/css/dist/cjk-horizontal/ReadiumCSS-default.css b/css/dist/cjk-horizontal/ReadiumCSS-default.css index f172f80..9394faa 100644 --- a/css/dist/cjk-horizontal/ReadiumCSS-default.css +++ b/css/dist/cjk-horizontal/ReadiumCSS-default.css @@ -1,5 +1,5 @@ /*! - * Readium CSS v.2.0.0-beta.21 + * Readium CSS v.2.0.0-beta.22 * Copyright (c) 2017–2025. Readium Foundation. All rights reserved. * Use of this source code is governed by a BSD-style license which is detailed in the * LICENSE file present in the project repository where this source code is maintained. diff --git a/css/dist/cjk-vertical/ReadiumCSS-after.css b/css/dist/cjk-vertical/ReadiumCSS-after.css index be6fa55..4ee1db8 100644 --- a/css/dist/cjk-vertical/ReadiumCSS-after.css +++ b/css/dist/cjk-vertical/ReadiumCSS-after.css @@ -1,5 +1,5 @@ /*! - * Readium CSS v.2.0.0-beta.21 + * Readium CSS v.2.0.0-beta.22 * Copyright (c) 2017–2025. Readium Foundation. All rights reserved. * Use of this source code is governed by a BSD-style license which is detailed in the * LICENSE file present in the project repository where this source code is maintained. @@ -206,10 +206,36 @@ body{ zoom:var(--USER__fontSize) !important; } -:root[style*="readium-iOSPatch-on"][style*="--USER__fontSize"] body{ +:root:not([style*="readium-deprecatedFontSize-on"])[style*="readium-iOSPatch-on"][style*="--USER__fontSize"] body{ -webkit-text-size-adjust:var(--USER__fontSize) !important; } +@supports selector(figure:has(> img)){ + + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> img), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> video), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> svg), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> canvas), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> iframe), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> audio), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> img), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> video), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> svg), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> canvas), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> iframe), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> audio), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] table{ + zoom:calc(100% / var(--USER__fontSize)) !important; + } + + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figcaption, + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] caption, + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] td, + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] th{ + zoom:var(--USER__fontSize) !important; + } +} + @supports not (zoom: 1){ :root[style*="--USER__fontSize"]{ diff --git a/css/dist/cjk-vertical/ReadiumCSS-before.css b/css/dist/cjk-vertical/ReadiumCSS-before.css index 93c2b79..e9b183f 100644 --- a/css/dist/cjk-vertical/ReadiumCSS-before.css +++ b/css/dist/cjk-vertical/ReadiumCSS-before.css @@ -1,5 +1,5 @@ /*! - * Readium CSS v.2.0.0-beta.21 + * Readium CSS v.2.0.0-beta.22 * Copyright (c) 2017–2025. Readium Foundation. All rights reserved. * Use of this source code is governed by a BSD-style license which is detailed in the * LICENSE file present in the project repository where this source code is maintained. diff --git a/css/dist/cjk-vertical/ReadiumCSS-default.css b/css/dist/cjk-vertical/ReadiumCSS-default.css index c007f26..e2c9c96 100644 --- a/css/dist/cjk-vertical/ReadiumCSS-default.css +++ b/css/dist/cjk-vertical/ReadiumCSS-default.css @@ -1,5 +1,5 @@ /*! - * Readium CSS v.2.0.0-beta.21 + * Readium CSS v.2.0.0-beta.22 * Copyright (c) 2017–2025. Readium Foundation. All rights reserved. * Use of this source code is governed by a BSD-style license which is detailed in the * LICENSE file present in the project repository where this source code is maintained. diff --git a/css/dist/rtl/ReadiumCSS-after.css b/css/dist/rtl/ReadiumCSS-after.css index 6920377..ed19ada 100644 --- a/css/dist/rtl/ReadiumCSS-after.css +++ b/css/dist/rtl/ReadiumCSS-after.css @@ -1,5 +1,5 @@ /*! - * Readium CSS v.2.0.0-beta.21 + * Readium CSS v.2.0.0-beta.22 * Copyright (c) 2017–2025. Readium Foundation. All rights reserved. * Use of this source code is governed by a BSD-style license which is detailed in the * LICENSE file present in the project repository where this source code is maintained. @@ -235,10 +235,36 @@ body{ zoom:var(--USER__fontSize) !important; } -:root[style*="readium-iOSPatch-on"][style*="--USER__fontSize"] body{ +:root:not([style*="readium-deprecatedFontSize-on"])[style*="readium-iOSPatch-on"][style*="--USER__fontSize"] body{ -webkit-text-size-adjust:var(--USER__fontSize) !important; } +@supports selector(figure:has(> img)){ + + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> img), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> video), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> svg), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> canvas), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> iframe), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> audio), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> img), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> video), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> svg), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> canvas), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> iframe), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> audio), + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] table{ + zoom:calc(100% / var(--USER__fontSize)) !important; + } + + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figcaption, + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] caption, + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] td, + :root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] th{ + zoom:var(--USER__fontSize) !important; + } +} + @supports not (zoom: 1){ :root[style*="--USER__fontSize"]{ diff --git a/css/dist/rtl/ReadiumCSS-before.css b/css/dist/rtl/ReadiumCSS-before.css index b14fea6..9d90c47 100644 --- a/css/dist/rtl/ReadiumCSS-before.css +++ b/css/dist/rtl/ReadiumCSS-before.css @@ -1,5 +1,5 @@ /*! - * Readium CSS v.2.0.0-beta.21 + * Readium CSS v.2.0.0-beta.22 * Copyright (c) 2017–2025. Readium Foundation. All rights reserved. * Use of this source code is governed by a BSD-style license which is detailed in the * LICENSE file present in the project repository where this source code is maintained. diff --git a/css/dist/rtl/ReadiumCSS-default.css b/css/dist/rtl/ReadiumCSS-default.css index d29dfa7..65e4a53 100644 --- a/css/dist/rtl/ReadiumCSS-default.css +++ b/css/dist/rtl/ReadiumCSS-default.css @@ -1,5 +1,5 @@ /*! - * Readium CSS v.2.0.0-beta.21 + * Readium CSS v.2.0.0-beta.22 * Copyright (c) 2017–2025. Readium Foundation. All rights reserved. * Use of this source code is governed by a BSD-style license which is detailed in the * LICENSE file present in the project repository where this source code is maintained. diff --git a/css/dist/webPub/ReadiumCSS-webPub.css b/css/dist/webPub/ReadiumCSS-webPub.css new file mode 100644 index 0000000..4d59b84 --- /dev/null +++ b/css/dist/webPub/ReadiumCSS-webPub.css @@ -0,0 +1,274 @@ +/*! + * Readium CSS v.2.0.0-beta.22 + * Copyright (c) 2017–2025. Readium Foundation. All rights reserved. + * Use of this source code is governed by a BSD-style license which is detailed in the + * LICENSE file present in the project repository where this source code is maintained. + * Core maintainer: Jiminy Panoz + * Contributors: + * Daniel Weck + * Hadrien Gardeur + * Innovimax + * L. Le Meur + * Mickaël Menu + * k_taka + */ + +:root[style*="--USER__textAlign"]{ + text-align:var(--USER__textAlign); +} + +:root[style*="--USER__textAlign"] body, +:root[style*="--USER__textAlign"] p:not([class*="title"]):not(blockquote p):not(figcaption p):not(header p):not(hgroup p):not(div:has(+ *) > h1 + p):not(div:has(+ *) > p:has(+ h1)), +:root[style*="--USER__textAlign"] li, +:root[style*="--USER__textAlign"] dd{ + text-align:var(--USER__textAlign) !important; + -moz-text-align-last:auto !important; + -epub-text-align-last:auto !important; + text-align-last:auto !important; +} + +:root[style*="--USER__bodyHyphens"]{ + -webkit-hyphens:var(--USER__bodyHyphens) !important; + -moz-hyphens:var(--USER__bodyHyphens) !important; + -ms-hyphens:var(--USER__bodyHyphens) !important; + -epub-hyphens:var(--USER__bodyHyphens) !important; + hyphens:var(--USER__bodyHyphens) !important; +} + +:root[style*="--USER__bodyHyphens"] body, +:root[style*="--USER__bodyHyphens"] p, +:root[style*="--USER__bodyHyphens"] li, +:root[style*="--USER__bodyHyphens"] div, +:root[style*="--USER__bodyHyphens"] dd{ + -webkit-hyphens:inherit; + -moz-hyphens:inherit; + -ms-hyphens:inherit; + -epub-hyphens:inherit; + hyphens:inherit; +} + +:root[style*="--USER__fontFamily"]{ + font-family:var(--USER__fontFamily) !important; +} + +:root[style*="--USER__fontFamily"] *{ + font-family:revert !important; +} + +:root[style*="AccessibleDfA"]{ + font-family:AccessibleDfA, Verdana, Tahoma, "Trebuchet MS", sans-serif !important; +} + +:root[style*="IA Writer Duospace"]{ + font-family:"IA Writer Duospace", Menlo, "DejaVu Sans Mono", "Bitstream Vera Sans Mono", Courier, monospace !important; +} + +:root[style*="AccessibleDfA"],:root[style*="IA Writer Duospace"], +:root[style*="readium-a11y-on"]{ + font-style:normal !important; + font-weight:normal !important; +} + +:root[style*="AccessibleDfA"] body *:not(code):not(var):not(kbd):not(samp),:root[style*="IA Writer Duospace"] body *:not(code):not(var):not(kbd):not(samp), +:root[style*="readium-a11y-on"] body *:not(code):not(var):not(kbd):not(samp){ + font-family:inherit !important; + font-style:inherit !important; + font-weight:inherit !important; +} + +:root[style*="AccessibleDfA"] body *:not(a),:root[style*="IA Writer Duospace"] body *:not(a), +:root[style*="readium-a11y-on"] body *:not(a){ + text-decoration:none !important; +} + +:root[style*="AccessibleDfA"] body *,:root[style*="IA Writer Duospace"] body *, +:root[style*="readium-a11y-on"] body *{ + font-variant-caps:normal !important; + font-variant-numeric:normal !important; + font-variant-position:normal !important; +} + +:root[style*="AccessibleDfA"] sup,:root[style*="IA Writer Duospace"] sup, +:root[style*="readium-a11y-on"] sup, +:root[style*="AccessibleDfA"] sub, +:root[style*="IA Writer Duospace"] sub, +:root[style*="readium-a11y-on"] sub{ + font-size:1rem !important; + vertical-align:baseline !important; +} + +:root:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] body{ + zoom:var(--USER__zoom) !important; +} + +:root[style*="readium-iOSPatch-on"][style*="--USER__zoom"] body{ + -webkit-text-size-adjust:var(--USER__zoom) !important; +} + +@supports selector(figure:has(> img)){ + + :root:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] figure:has(> img), + :root:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] figure:has(> video), + :root:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] figure:has(> svg), + :root:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] figure:has(> canvas), + :root:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] figure:has(> iframe), + :root:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] figure:has(> audio), + :root:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] div:has(> img), + :root:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] div:has(> video), + :root:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] div:has(> svg), + :root:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] div:has(> canvas), + :root:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] div:has(> iframe), + :root:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] div:has(> audio), + :root:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] table{ + zoom:calc(100% / var(--USER__zoom)) !important; + } + + :root:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] figcaption, + :root:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] caption, + :root:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] td, + :root:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] th{ + zoom:var(--USER__zoom) !important; + } +} + +:root[style*="--USER__lineHeight"]{ + line-height:var(--USER__lineHeight) !important; +} + +:root[style*="--USER__lineHeight"] body, +:root[style*="--USER__lineHeight"] p, +:root[style*="--USER__lineHeight"] li, +:root[style*="--USER__lineHeight"] div{ + line-height:inherit; +} + +:root[style*="--USER__paraSpacing"] p{ + margin-top:var(--USER__paraSpacing) !important; + margin-bottom:var(--USER__paraSpacing) !important; +} + +:root[style*="--USER__paraIndent"] p:not([class*="title"]):not(blockquote p):not(figcaption p):not(header p):not(hgroup p):not(div:has(+ *) > h1 + p):not(div:has(+ *) > p:has(+ h1)){ + text-indent:var(--USER__paraIndent) !important; +} + +:root[style*="--USER__paraIndent"] p *, +:root[style*="--USER__paraIndent"] p:first-letter{ + text-indent:0 !important; +} + +:root[style*="--USER__wordSpacing"] h1, +:root[style*="--USER__wordSpacing"] h2, +:root[style*="--USER__wordSpacing"] h3, +:root[style*="--USER__wordSpacing"] h4, +:root[style*="--USER__wordSpacing"] h5, +:root[style*="--USER__wordSpacing"] h6, +:root[style*="--USER__wordSpacing"] p, +:root[style*="--USER__wordSpacing"] li, +:root[style*="--USER__wordSpacing"] div, +:root[style*="--USER__wordSpacing"] dt, +:root[style*="--USER__wordSpacing"] dd{ + word-spacing:var(--USER__wordSpacing); +} + +:root[style*="--USER__letterSpacing"] h1, +:root[style*="--USER__letterSpacing"] h2, +:root[style*="--USER__letterSpacing"] h3, +:root[style*="--USER__letterSpacing"] h4, +:root[style*="--USER__letterSpacing"] h5, +:root[style*="--USER__letterSpacing"] h6, +:root[style*="--USER__letterSpacing"] p, +:root[style*="--USER__letterSpacing"] li, +:root[style*="--USER__letterSpacing"] div, +:root[style*="--USER__letterSpacing"] dt, +:root[style*="--USER__letterSpacing"] dd{ + letter-spacing:var(--USER__letterSpacing); + font-variant:none; +} + +:root[style*="--USER__fontWeight"] body{ + font-weight:var(--USER__fontWeight) !important; +} + +:root[style*="--USER__fontWeight"] b, +:root[style*="--USER__fontWeight"] strong{ + font-weight:bolder; +} + +:root[style*="--USER__fontWidth"] body{ + font-stretch:var(--USER__fontWidth) !important; +} + +:root[style*="--USER__fontOpticalSizing"] body{ + font-optical-sizing:var(--USER__fontOpticalSizing) !important; +} + +:root[style*="readium-noRuby-on"] body rt, +:root[style*="readium-noRuby-on"] body rp{ + display:none; +} + +:root[style*="--USER__ligatures"]{ + font-variant-ligatures:var(--USER__ligatures) !important; +} + +:root[style*="--USER__ligatures"] *{ + font-variant-ligatures:inherit !important; +} + +:root[style*="readium-iPadOSPatch-on"] body{ + -webkit-text-size-adjust:none; +} + +:root[style*="readium-iPadOSPatch-on"] p, +:root[style*="readium-iPadOSPatch-on"] h1, +:root[style*="readium-iPadOSPatch-on"] h2, +:root[style*="readium-iPadOSPatch-on"] h3, +:root[style*="readium-iPadOSPatch-on"] h4, +:root[style*="readium-iPadOSPatch-on"] h5, +:root[style*="readium-iPadOSPatch-on"] h6, +:root[style*="readium-iPadOSPatch-on"] li, +:root[style*="readium-iPadOSPatch-on"] th, +:root[style*="readium-iPadOSPatch-on"] td, +:root[style*="readium-iPadOSPatch-on"] dt, +:root[style*="readium-iPadOSPatch-on"] dd, +:root[style*="readium-iPadOSPatch-on"] pre, +:root[style*="readium-iPadOSPatch-on"] address, +:root[style*="readium-iPadOSPatch-on"] details, +:root[style*="readium-iPadOSPatch-on"] summary, +:root[style*="readium-iPadOSPatch-on"] figcaption, +:root[style*="readium-iPadOSPatch-on"] div:not(:has(p, h1, h2, h3, h4, h5, h6, li, th, td, dt, dd, pre, address, aside, details, figcaption, summary)), +:root[style*="readium-iPadOSPatch-on"] aside:not(:has(p, h1, h2, h3, h4, h5, h6, li, th, td, dt, dd, pre, address, aside, details, figcaption, summary)){ + -webkit-text-zoom:reset; +} + +:root[style*="readium-iPadOSPatch-on"] abbr, +:root[style*="readium-iPadOSPatch-on"] b, +:root[style*="readium-iPadOSPatch-on"] bdi, +:root[style*="readium-iPadOSPatch-on"] bdo, +:root[style*="readium-iPadOSPatch-on"] cite, +:root[style*="readium-iPadOSPatch-on"] code, +:root[style*="readium-iPadOSPatch-on"] dfn, +:root[style*="readium-iPadOSPatch-on"] em, +:root[style*="readium-iPadOSPatch-on"] i, +:root[style*="readium-iPadOSPatch-on"] kbd, +:root[style*="readium-iPadOSPatch-on"] mark, +:root[style*="readium-iPadOSPatch-on"] q, +:root[style*="readium-iPadOSPatch-on"] rp, +:root[style*="readium-iPadOSPatch-on"] rt, +:root[style*="readium-iPadOSPatch-on"] ruby, +:root[style*="readium-iPadOSPatch-on"] s, +:root[style*="readium-iPadOSPatch-on"] samp, +:root[style*="readium-iPadOSPatch-on"] small, +:root[style*="readium-iPadOSPatch-on"] span, +:root[style*="readium-iPadOSPatch-on"] strong, +:root[style*="readium-iPadOSPatch-on"] sub, +:root[style*="readium-iPadOSPatch-on"] sup, +:root[style*="readium-iPadOSPatch-on"] time, +:root[style*="readium-iPadOSPatch-on"] u, +:root[style*="readium-iPadOSPatch-on"] var{ + -webkit-text-zoom:normal; +} + +:root[style*="readium-iPadOSPatch-on"] p:not(:has(b, cite, em, i, q, s, small, span, strong)):first-line{ + -webkit-text-zoom:normal; +} \ No newline at end of file diff --git a/css/src/ReadiumCSS-after-rtl.css b/css/src/ReadiumCSS-after-rtl.css index 6965ae4..fdc889f 100644 --- a/css/src/ReadiumCSS-after-rtl.css +++ b/css/src/ReadiumCSS-after-rtl.css @@ -13,7 +13,7 @@ @import "modules/user-settings-submodules/ReadiumCSS-paraSpacing_pref.css"; @import "modules/user-settings-submodules/ReadiumCSS-paraIndent_pref.css"; @import "modules/user-settings-submodules/ReadiumCSS-wordSpacing_pref.css"; -@import "modules/user-settings-submodules/ReadiumCSS-arabicLigatures_pref.css"; +@import "modules/user-settings-submodules/ReadiumCSS-ligatures_pref.css"; @import "modules/user-settings-submodules/ReadiumCSS-variableFont_pref.css"; @import "modules/user-settings-submodules/ReadiumCSS-imageFilters_pref.css"; @import "modules/ReadiumCSS-fs_normalize.css"; diff --git a/css/src/ReadiumCSS-after.css b/css/src/ReadiumCSS-after.css index 752e6fc..97b5518 100644 --- a/css/src/ReadiumCSS-after.css +++ b/css/src/ReadiumCSS-after.css @@ -16,6 +16,7 @@ @import "modules/user-settings-submodules/ReadiumCSS-paraIndent_pref.css"; @import "modules/user-settings-submodules/ReadiumCSS-wordSpacing_pref.css"; @import "modules/user-settings-submodules/ReadiumCSS-letterSpacing_pref.css"; +@import "modules/user-settings-submodules/ReadiumCSS-ligatures_pref.css"; @import "modules/user-settings-submodules/ReadiumCSS-variableFont_pref.css"; @import "modules/user-settings-submodules/ReadiumCSS-imageFilters_pref.css"; @import "modules/ReadiumCSS-fs_normalize.css"; diff --git a/css/src/ReadiumCSS-webPub.css b/css/src/ReadiumCSS-webPub.css new file mode 100644 index 0000000..0432229 --- /dev/null +++ b/css/src/ReadiumCSS-webPub.css @@ -0,0 +1,15 @@ +@import "../ReadiumCSS-config.css"; +@import "modules/user-settings-submodules/ReadiumCSS-textAlign_pref.css"; +@import "modules/user-settings-submodules/ReadiumCSS-bodyHyphens_pref.css"; +@import "modules/user-settings-submodules/ReadiumCSS-fontFamily_pref.css"; +@import "modules/user-settings-submodules/ReadiumCSS-a11yFont_pref.css"; +@import "modules/user-settings-submodules/ReadiumCSS-webPubZoom_pref.css"; +@import "modules/user-settings-submodules/ReadiumCSS-lineHeight_pref.css"; +@import "modules/user-settings-submodules/ReadiumCSS-paraSpacing_pref.css"; +@import "modules/user-settings-submodules/ReadiumCSS-paraIndent_pref.css"; +@import "modules/user-settings-submodules/ReadiumCSS-wordSpacing_pref.css"; +@import "modules/user-settings-submodules/ReadiumCSS-letterSpacing_pref.css"; +@import "modules/user-settings-submodules/ReadiumCSS-variableFont_pref.css"; +@import "modules/user-settings-submodules/ReadiumCSS-ruby_pref.css"; +@import "modules/user-settings-submodules/ReadiumCSS-ligatures_pref.css"; +@import "modules/ReadiumCSS-iPadOS_patch.css"; \ No newline at end of file diff --git a/css/src/modules/user-settings-submodules/ReadiumCSS-fontSize_pref.css b/css/src/modules/user-settings-submodules/ReadiumCSS-fontSize_pref.css index 5969e35..03ec2f7 100644 --- a/css/src/modules/user-settings-submodules/ReadiumCSS-fontSize_pref.css +++ b/css/src/modules/user-settings-submodules/ReadiumCSS-fontSize_pref.css @@ -10,10 +10,35 @@ zoom: var(--USER__fontSize) !important; } -:root:--iOS-patch[style*="--USER__fontSize"] body { +:root:not(:--deprecated-font-size):--iOS-patch[style*="--USER__fontSize"] body { -webkit-text-size-adjust: var(--USER__fontSize) !important; } +@supports selector(figure:has(> img)) { + :root:not(:--deprecated-font-size):not(:--iOS-patch)[style*="--USER__fontSize"] figure:has(> img), + :root:not(:--deprecated-font-size):not(:--iOS-patch)[style*="--USER__fontSize"] figure:has(> video), + :root:not(:--deprecated-font-size):not(:--iOS-patch)[style*="--USER__fontSize"] figure:has(> svg), + :root:not(:--deprecated-font-size):not(:--iOS-patch)[style*="--USER__fontSize"] figure:has(> canvas), + :root:not(:--deprecated-font-size):not(:--iOS-patch)[style*="--USER__fontSize"] figure:has(> iframe), + :root:not(:--deprecated-font-size):not(:--iOS-patch)[style*="--USER__fontSize"] figure:has(> audio), + :root:not(:--deprecated-font-size):not(:--iOS-patch)[style*="--USER__fontSize"] div:has(> img), + :root:not(:--deprecated-font-size):not(:--iOS-patch)[style*="--USER__fontSize"] div:has(> video), + :root:not(:--deprecated-font-size):not(:--iOS-patch)[style*="--USER__fontSize"] div:has(> svg), + :root:not(:--deprecated-font-size):not(:--iOS-patch)[style*="--USER__fontSize"] div:has(> canvas), + :root:not(:--deprecated-font-size):not(:--iOS-patch)[style*="--USER__fontSize"] div:has(> iframe), + :root:not(:--deprecated-font-size):not(:--iOS-patch)[style*="--USER__fontSize"] div:has(> audio), + :root:not(:--deprecated-font-size):not(:--iOS-patch)[style*="--USER__fontSize"] table { + zoom: calc(100% / var(--USER__fontSize)) !important; + } + + :root:not(:--deprecated-font-size):not(:--iOS-patch)[style*="--USER__fontSize"] figcaption, + :root:not(:--deprecated-font-size):not(:--iOS-patch)[style*="--USER__fontSize"] caption, + :root:not(:--deprecated-font-size):not(:--iOS-patch)[style*="--USER__fontSize"] td, + :root:not(:--deprecated-font-size):not(:--iOS-patch)[style*="--USER__fontSize"] th { + zoom: var(--USER__fontSize) !important; + } +} + /* Older deprecated implementation for when zoom is not supported or it is explicitly enabled because you don’t want the new one */ diff --git a/css/src/modules/user-settings-submodules/ReadiumCSS-arabicLigatures_pref.css b/css/src/modules/user-settings-submodules/ReadiumCSS-ligatures_pref.css similarity index 79% rename from css/src/modules/user-settings-submodules/ReadiumCSS-arabicLigatures_pref.css rename to css/src/modules/user-settings-submodules/ReadiumCSS-ligatures_pref.css index 9ffaa1a..04c659a 100644 --- a/css/src/modules/user-settings-submodules/ReadiumCSS-arabicLigatures_pref.css +++ b/css/src/modules/user-settings-submodules/ReadiumCSS-ligatures_pref.css @@ -1,7 +1,7 @@ /* Readium CSS Ligatures pref - A submodule managing ligatures for user settings in the Arabic Script (can help with a11y) + A submodule managing ligatures for user settings Part of “User Overrides Advanced” class – “advanced settings” flag required. Repo: https://github.com/readium/css */ diff --git a/css/src/modules/user-settings-submodules/ReadiumCSS-webPubZoom_pref.css b/css/src/modules/user-settings-submodules/ReadiumCSS-webPubZoom_pref.css new file mode 100644 index 0000000..9489c1e --- /dev/null +++ b/css/src/modules/user-settings-submodules/ReadiumCSS-webPubZoom_pref.css @@ -0,0 +1,42 @@ +/* Readium CSS + WebPubZoom pref + + A submodule managing zoom for user settings in Web Publications + Part of “User Overrides” class – no flag required. + + Repo: https://github.com/readium/css */ + +:root:not(:--iOS-patch)[style*="--USER__zoom"] body { + zoom: var(--USER__zoom) !important; +} + +:root:--iOS-patch[style*="--USER__zoom"] body { + -webkit-text-size-adjust: var(--USER__zoom) !important; +} + +@supports selector(figure:has(> img)) { + :root:not(:--iOS-patch)[style*="--USER__zoom"] figure:has(> img), + :root:not(:--iOS-patch)[style*="--USER__zoom"] figure:has(> video), + :root:not(:--iOS-patch)[style*="--USER__zoom"] figure:has(> svg), + :root:not(:--iOS-patch)[style*="--USER__zoom"] figure:has(> canvas), + :root:not(:--iOS-patch)[style*="--USER__zoom"] figure:has(> iframe), + :root:not(:--iOS-patch)[style*="--USER__zoom"] figure:has(> audio), + :root:not(:--iOS-patch)[style*="--USER__zoom"] div:has(> img), + :root:not(:--iOS-patch)[style*="--USER__zoom"] div:has(> video), + :root:not(:--iOS-patch)[style*="--USER__zoom"] div:has(> svg), + :root:not(:--iOS-patch)[style*="--USER__zoom"] div:has(> canvas), + :root:not(:--iOS-patch)[style*="--USER__zoom"] div:has(> iframe), + :root:not(:--iOS-patch)[style*="--USER__zoom"] div:has(> audio), + :root:not(:--iOS-patch)[style*="--USER__zoom"] table { + zoom: calc(100% / var(--USER__zoom)) !important; + } + + :root:not(:--iOS-patch)[style*="--USER__zoom"] figcaption, + :root:not(:--iOS-patch)[style*="--USER__zoom"] caption, + :root:not(:--iOS-patch)[style*="--USER__zoom"] td, + :root:not(:--iOS-patch)[style*="--USER__zoom"] th { + zoom: var(--USER__zoom) !important; + } +} + +/* We do not have a fallback implementation yet… */ \ No newline at end of file diff --git a/docs/CSS02-quickstart.md b/docs/CSS02-quickstart.md index 9832a58..7d593de 100644 --- a/docs/CSS02-quickstart.md +++ b/docs/CSS02-quickstart.md @@ -118,7 +118,8 @@ Other scripts are available: - `build:ltr` for default stylesheets (Left to Right); - `build:rtl` for Right to Left stylesheets; - `build:cjk` for CJK scripts; -- `build:vertical` for CJK and the Mongolian scripts in vertical writing. +- `build:vertical` for CJK and the Mongolian scripts in vertical writing; +- `build:web` for Web Publications stylesheets. ### Additional info diff --git a/docs/CSS06-stylesheets_order.md b/docs/CSS06-stylesheets_order.md index 28383d5..1d85c94 100644 --- a/docs/CSS06-stylesheets_order.md +++ b/docs/CSS06-stylesheets_order.md @@ -59,7 +59,7 @@ The following modules must be appended after the author’s stylesheets (`Readiu 11. `ReadiumCSS-paraIndent_pref.css` (does not apply to CJK scripts) 12. `ReadiumCSS-wordSpacing_pref.css` (does not apply to CJK scripts) 13. `ReadiumCSS-letterSpacing_pref.css` (does not apply to RTL scripts, except in vertical writing mode) - 14. `ReadiumCSS-arabicLigatures_pref.css` (RTL only) + 14. `ReadiumCSS-ligatures_pref.css` (RTL only) 15. `ReadiumCSS-variableFont_pref.css` (this contains optical sizing, weight and width prefs) 16. `ReadiumCSS-ruby_pref.css` (CJK only) 17. `ReadiumCSS-imageFilters_pref.css` diff --git a/docs/CSS08-defaults.md b/docs/CSS08-defaults.md index 37624eb..63c508e 100644 --- a/docs/CSS08-defaults.md +++ b/docs/CSS08-defaults.md @@ -261,7 +261,7 @@ The typeface for code snippets. The value can be another variable e.g. `var(-RS_ The scale to be used for computing all elements’ `font-size`. Since those font sizes are computed dynamically, you can set a smaller type scale when the user sets one of the largest font sizes. -Possible values: `1` | `1.067` | `1.125` | `1.2` (suggested default) | `1.25` | `1.333` | `1.414` | `1.5` | `1.618` +Possible values: `1` / `1.067` / `1.125` / `1.2` (suggested default) / `1.25` / `1.333` / `1.414` / `1.5` / `1.618` * * * diff --git a/docs/CSS11-overrides_classification.md b/docs/CSS11-overrides_classification.md index bcf170f..6a5d530 100644 --- a/docs/CSS11-overrides_classification.md +++ b/docs/CSS11-overrides_classification.md @@ -43,7 +43,7 @@ The following settings are optional but should be applied by any means necessary - paragraph indent; - letter-spacing; - word-spacing; -- arabic ligatures; +- ligatures; - hiding ruby (CJK); - accessibility normalization; - font optical sizing (requires a variable font); diff --git a/docs/CSS12-user_prefs.md b/docs/CSS12-user_prefs.md index 9f7a966..5146503 100644 --- a/docs/CSS12-user_prefs.md +++ b/docs/CSS12-user_prefs.md @@ -69,7 +69,7 @@ Allows to switch between paged and scroll view. --USER__view ``` -Supported values: `readium-paged-on` | `readium-scroll-on` +Supported values: `readium-paged-on` / `readium-scroll-on` Override class: Chrome (should be applied by any means necessary) @@ -249,7 +249,7 @@ The user can set `text-align` and `hyphens` for body copy contents. --USER__textAlign ``` -Possible values: `left` (LTR) or `right` (RTL) | `start` (logical property resolving to `left` in LTR, `right` in RTL) | `justify` +Possible values: `left` (LTR) or `right` (RTL) / `start` (logical property resolving to `left` in LTR, `right` in RTL) / `justify` Override class: User settings advanced (optional but should be applied by any means necessary if provided to users) @@ -261,7 +261,7 @@ Note: the value `start` can be used to let all rendering engines, excepted Tride --USER__bodyHyphens ``` -Possible Values: `auto` | `none` +Possible Values: `auto` / `none` Override class: User settings advanced (optional but should be applied by any means necessary if provided to users) @@ -279,9 +279,9 @@ The user can set `font-family`, `font-size` and `line-height` for body copy cont --USER__fontFamily ``` -Possible values: `var(--RS__oldStyleTf)` | `var(--RS__modernTf)` | `var(--RS__sansTf)` | `var(--RS__humanistTf)` | `` +Possible values: `var(--RS__oldStyleTf)` / `var(--RS__modernTf)` / `var(--RS__sansTf)` / `var(--RS__humanistTf)` / `` -For Japanese, possible values become: `var(--RS__serif-ja)` (horizontal writing) | `var(--RS__sans-serif-ja)` (horizontal writing) | `var(--RS__serif-ja-v)` (vertical writing) | `var(--RS__sans-serif-ja-v)` (vertical writing) | `` +For Japanese, possible values become: `var(--RS__serif-ja)` (horizontal writing) / `var(--RS__sans-serif-ja)` (horizontal writing) / `var(--RS__serif-ja-v)` (vertical writing) / `var(--RS__sans-serif-ja-v)` (vertical writing) / `` Required flag: none @@ -365,13 +365,13 @@ Recommended values: a range from `0` to `0.5rem`. Increments are left to impleme Override class: User settings advanced (optional but should be applied by any means necessary if provided to users) -#### Arabic Ligatures +#### Ligatures ``` --USER__ligatures ``` -Possible values: `none` | `common-ligatures` +Possible values: `none` / `common-ligatures` Override class: User settings advanced (optional but should be applied by any means necessary if provided to users) @@ -391,7 +391,7 @@ Rendering engines and browsers enable optical sizing by default for fonts that h When optical sizing is used, small text sizes are often rendered with thicker strokes and larger serifs, whereas larger text is often rendered more delicately with more contrast between thicker and thinner strokes. -Possible values: `none` | `auto` (default) +Possible values: `none` / `auto` (default) Required flag: none @@ -417,7 +417,7 @@ Override class: User settings advanced (optional but should be applied by any me --USER__fontWidth ``` -Possible values: `ultra-condensed` | `extra-condensed` | `condensed` | `semi-condensed` | `normal` | `semi-expanded` | `expanded` | `extra-expanded` | `ultra-expanded` | `percentage` e.g. `50%`, `125%` +Possible values: `ultra-condensed` / `extra-condensed` / `condensed` / `semi-condensed` / `normal` / `semi-expanded` / `expanded` / `extra-expanded` / `ultra-expanded` / `percentage` e.g. `50%`, `125%` **Warning: the percentage values depend on the variable font you may be using.** You can use services such as [Wakamai Fondue](https://wakamaifondue.com) to get the values. @@ -453,7 +453,7 @@ This will apply a `mix-blend-mode` of `multiply` with a transparent background t --USER__darkenImages ``` -Possible values: `readium-darken-on` | `percentage` e.g. `50%`. +Possible values: `readium-darken-on` / `percentage` e.g. `50%`. This will apply a `brightness` filter with the percentage value it’s given, or a preset of `80%` if using it as a flag. @@ -463,7 +463,7 @@ This will apply a `brightness` filter with the percentage value it’s given, or --USER__invertImages ``` -Possible values: `readium-invert-on` | `percentage` e.g. `50%`. +Possible values: `readium-invert-on` / `percentage` e.g. `50%`. This will apply an `invert` filter with the percentage value it’s given, or a preset of `100%` if using it as a flag. @@ -473,7 +473,7 @@ If you want to only invert gaiji (valid Japanese character as `img`), you can us --USER__invertGaiji ``` -Possible values: `readium-invertGaiji-on` | `percentage` e.g. `50%`. +Possible values: `readium-invertGaiji-on` / `percentage` e.g. `50%`. This will apply an `invert` filter with the percentage value it’s given, or a preset of `100%` if using it as a flag, only to `img class="gaiji"`. diff --git a/docs/CSS14-user_settings_recs.md b/docs/CSS14-user_settings_recs.md index 3e0d5bd..a5b3efb 100644 --- a/docs/CSS14-user_settings_recs.md +++ b/docs/CSS14-user_settings_recs.md @@ -215,11 +215,11 @@ It is very rare authors’ will use those CSS properties for body copy. They may In any case, implementers should force those settings for body copy. -## Ligatures (Arabic & Persian scripts) +## Ligatures ### User’s intent -The user intends to disable ligatures. This setting applies to the Arabic and Persian scripts, and is believed to help dyslexic readers as `word-spacing` in Latin. +The user intends to disable ligatures. This setting applies to the Latin, Arabic and Persian scripts. In the two latter, it is believed to help dyslexic readers as `word-spacing` in Latin. ### Author’s intent diff --git a/docs/CSS16-internationalization.md b/docs/CSS16-internationalization.md index 0aeb9b0..50abc63 100644 --- a/docs/CSS16-internationalization.md +++ b/docs/CSS16-internationalization.md @@ -156,7 +156,7 @@ Several parts of the UI must follow the direction (`rtl`) of the primary languag - user settings e.g. text align; - implementers might want to localize the interface based on the language set at the system level, or at least fall back to English. -Moreover, some user settings should be removed if used (`letter-spacing`) and another one added (arabic ligatures in `ar` and `fa`). +Moreover, some user settings should be removed if used (`letter-spacing`). #### CJK diff --git a/docs/CSS18-further_details.md b/docs/CSS18-further_details.md index 162eb6d..2192fde 100644 --- a/docs/CSS18-further_details.md +++ b/docs/CSS18-further_details.md @@ -48,7 +48,7 @@ The typeface for code snippets. The value can be another variable e.g. `var(-RS_ The scale to be used for computing all elements’ `font-size`. Since those font sizes are computed dynamically, you can set a smaller type scale when the user sets one of the largest font sizes. -Possible values: `1` | `1.067` | `1.125` (suggested default) | `1.2` | `1.25` | `1.333` | `1.414` | `1.5` | `1.618` +Possible values: `1` / `1.067` / `1.125` (suggested default) / `1.2` / `1.25` / `1.333` / `1.414` / `1.5` / `1.618` The suggested default will accomodate most configurations, from small to large screens. diff --git a/docs/CSS19-api.md b/docs/CSS19-api.md index 145e31a..fd89de0 100644 --- a/docs/CSS19-api.md +++ b/docs/CSS19-api.md @@ -523,7 +523,7 @@ The typeface for code snippets. The value can be another variable e.g. `var(-RS_ The scale to be used for computing all elements’ `font-size`. Since those font sizes are computed dynamically, you can set a smaller type scale when the user sets one of the largest font sizes. -Possible values: `1` | `1.067` | `1.125` | `1.2` (suggested default) | `1.25` | `1.333` | `1.414` | `1.5` | `1.618` +Possible values: `1` / `1.067` / `1.125` / `1.2` (suggested default) / `1.25` / `1.333` / `1.414` / `1.5` / `1.618` * * * @@ -831,7 +831,7 @@ Scope: `html` It impacts `body`, `li`, and `p` which are not children of `blockquote` and `figcaption`. -Possible values: `left` (LTR) or `right` (RTL) | `start` (logical property resolving to `left` in LTR, `right` in RTL) | `justify` +Possible values: `left` (LTR) or `right` (RTL) / `start` (logical property resolving to `left` in LTR, `right` in RTL) / `justify` Override class: User settings advanced (optional but should be applied by any means necessary if provided to users) @@ -849,7 +849,7 @@ Scope: `html` It impacts `body`, `p`, `li`, `div` and `dd`. -Possible Values: `auto` | `none` +Possible Values: `auto` / `none` Override class: User settings advanced (optional but should be applied by any means necessary if provided to users) @@ -867,9 +867,9 @@ Scope: `html` It impacts everything except `code `, `var`, `kbd`, and `samp`. -Possible values: `var(--RS__oldStyleTf)` | `var(--RS__modernTf)` | `var(--RS__sansTf)` | `var(--RS__humanistTf)` | `` +Possible values: `var(--RS__oldStyleTf)` / `var(--RS__modernTf)` / `var(--RS__sansTf)` / `var(--RS__humanistTf)` / `` -For Japanese, possible values become: `var(--RS__serif-ja)` (horizontal writing) | `var(--RS__sans-serif-ja)` (horizontal writing) | `var(--RS__serif-ja-v)` (vertical writing) | `var(--RS__sans-serif-ja-v)` (vertical writing) | `` +For Japanese, possible values become: `var(--RS__serif-ja)` (horizontal writing) / `var(--RS__sans-serif-ja)` (horizontal writing) / `var(--RS__serif-ja-v)` (vertical writing) / `var(--RS__sans-serif-ja-v)` (vertical writing) / `` Required flag: `:--fontOverride` @@ -971,13 +971,13 @@ Override class: User settings advanced (optional but should be applied by any me --USER__ligatures ``` -Enabling and disabling ligatures in Arabic (related to a11y). +Enabling and disabling ligatures. Scope: `html` It impacts all text. -Possible values: `none` | `common-ligatures` +Possible values: `none` / `common-ligatures` Override class: User settings advanced (optional but should be applied by any means necessary if provided to users) @@ -993,7 +993,7 @@ Scope: `html` It impacts all text. -Possible values: `none` | `auto` +Possible values: `none` / `auto` Required flag: `:--fontOverride` @@ -1031,7 +1031,7 @@ Scope: `html` It impacts all text. -Possible values: `ultra-condensed` | `extra-condensed` | `condensed` | `semi-condensed` | `normal` | `semi-expanded` | `expanded` | `extra-expanded` | `ultra-expanded` | `percentage` +Possible values: `ultra-condensed` / `extra-condensed` / `condensed` / `semi-condensed` / `normal` / `semi-expanded` / `expanded` / `extra-expanded` / `ultra-expanded` / `percentage` **Warning: the percentage values depend on the variable font you may be using.** You can use services such as [Wakamai Fondue](https://wakamaifondue.com) to get the values. @@ -1065,7 +1065,7 @@ Scope: `html` It impacts all images. -Possible values: `readium-darken-on` | `percentage` e.g. `50%` +Possible values: `readium-darken-on` / `percentage` e.g. `50%` * * * @@ -1079,7 +1079,7 @@ Scope: `html` It impacts all images, including gaiji. -Possible values: `readium-invert-on` | `percentage` e.g. `50%` +Possible values: `readium-invert-on` / `percentage` e.g. `50%` * * * @@ -1093,4 +1093,4 @@ Scope: `html` It impacts images with a `gaiji` class name. -Possible values: `readium-invertGaiji-on` | `percentage` e.g. `50` \ No newline at end of file +Possible values: `readium-invertGaiji-on` / `percentage` e.g. `50` \ No newline at end of file diff --git a/docs/CSS28-migration_guide.md b/docs/CSS28-migration_guide.md index f7a6881..e731dfb 100644 --- a/docs/CSS28-migration_guide.md +++ b/docs/CSS28-migration_guide.md @@ -231,4 +231,30 @@ The 5 following custom properties are available: - `--RS__scrollPaddingLeft` - `--RS__scrollPaddingRight` -They accept the same values as the CSS property `padding`. \ No newline at end of file +They accept the same values as the CSS property `padding`. + +## Ligatures moved to the global space + +As of version `2.0.0-beta.22`, ligatures are no longer limited to RTL (arabic and farsi scripts). The setting is now available in Latin scripts as well. + +## Experimental Web Publications stylesheet + +As of version `2.0.0-beta.22`, ReadiumCSS provides an experimental stylesheet for Web Publications. It ships with the following features: + +- font-family +- font variations (weight, width, optical-sizing) +- hyphens +- letter spacing +- ligatures +- line height +- paragraph indent +- paragraph spacing +- Ruby annotations disabling +- text alignment +- text normalization +- word spacing +- zoom + +As well as the patching of zoom for iOS and iPadOS. **Note there is no fallback in case the `zoom` CSS property is not supported.** + +Typically, you would use zoom for all web publications, and the rest of the styles if the web publication’s accessibility metadata contains feature `displayTransformability`. \ No newline at end of file diff --git a/docs/ReadiumCSS_docs.epub b/docs/ReadiumCSS_docs.epub index 7396660..10579c1 100644 Binary files a/docs/ReadiumCSS_docs.epub and b/docs/ReadiumCSS_docs.epub differ diff --git a/docs/ReadiumCSS_docs/OEBPS/Text/Section-002.xhtml b/docs/ReadiumCSS_docs/OEBPS/Text/Section-002.xhtml index 475f29e..dc38210 100644 --- a/docs/ReadiumCSS_docs/OEBPS/Text/Section-002.xhtml +++ b/docs/ReadiumCSS_docs/OEBPS/Text/Section-002.xhtml @@ -161,7 +161,9 @@
  • build:cjk for CJK scripts;
    • -
  • build:vertical for CJK and the Mongolian scripts in vertical writing.
    • +
  • build:vertical for CJK and the Mongolian scripts in vertical writing;
    • + +
  • build:web for Web Publications stylesheets.
    • diff --git a/docs/ReadiumCSS_docs/OEBPS/Text/Section-006.xhtml b/docs/ReadiumCSS_docs/OEBPS/Text/Section-006.xhtml index 08f3c7a..17cf940 100644 --- a/docs/ReadiumCSS_docs/OEBPS/Text/Section-006.xhtml +++ b/docs/ReadiumCSS_docs/OEBPS/Text/Section-006.xhtml @@ -112,7 +112,7 @@
  • ReadiumCSS-letterSpacing_pref.css (does not apply to RTL scripts, except in vertical writing mode)
    • -
  • ReadiumCSS-arabicLigatures_pref.css (RTL only)
    • +
  • ReadiumCSS-ligatures_pref.css (RTL only)
  • ReadiumCSS-variableFont_pref.css (this contains optical sizing, weight and width prefs)
    • diff --git a/docs/ReadiumCSS_docs/OEBPS/Text/Section-011.xhtml b/docs/ReadiumCSS_docs/OEBPS/Text/Section-011.xhtml index 1685c67..9b25e16 100644 --- a/docs/ReadiumCSS_docs/OEBPS/Text/Section-011.xhtml +++ b/docs/ReadiumCSS_docs/OEBPS/Text/Section-011.xhtml @@ -85,7 +85,7 @@
  • word-spacing;
    • -
  • arabic ligatures;
    • +
  • ligatures;
  • hiding ruby (CJK);
    • diff --git a/docs/ReadiumCSS_docs/OEBPS/Text/Section-012.xhtml b/docs/ReadiumCSS_docs/OEBPS/Text/Section-012.xhtml index a2739ef..5dbfeb8 100644 --- a/docs/ReadiumCSS_docs/OEBPS/Text/Section-012.xhtml +++ b/docs/ReadiumCSS_docs/OEBPS/Text/Section-012.xhtml @@ -396,8 +396,8 @@ root.style.setProperty("name of var", "");

    Override class: User settings advanced (optional but should be applied by any means necessary if provided to users)

    -
    -

    Arabic Ligatures

    +
    +

    Ligatures

    --USER__ligatures
    diff --git a/docs/ReadiumCSS_docs/OEBPS/Text/Section-014.xhtml b/docs/ReadiumCSS_docs/OEBPS/Text/Section-014.xhtml index 2304a24..0820379 100644 --- a/docs/ReadiumCSS_docs/OEBPS/Text/Section-014.xhtml +++ b/docs/ReadiumCSS_docs/OEBPS/Text/Section-014.xhtml @@ -329,13 +329,13 @@
    -
    -

    Ligatures (Arabic & Persian scripts)

    +
    +

    Ligatures

    User’s intent

    -

    The user intends to disable ligatures. This setting applies to the Arabic and Persian scripts, and is believed to help dyslexic readers as word-spacing in Latin.

    +

    The user intends to disable ligatures. This setting applies to the Latin, Arabic and Persian scripts. In the two latter, it is believed to help dyslexic readers as word-spacing in Latin.

    diff --git a/docs/ReadiumCSS_docs/OEBPS/Text/Section-016.xhtml b/docs/ReadiumCSS_docs/OEBPS/Text/Section-016.xhtml index bb439d2..91ee91a 100644 --- a/docs/ReadiumCSS_docs/OEBPS/Text/Section-016.xhtml +++ b/docs/ReadiumCSS_docs/OEBPS/Text/Section-016.xhtml @@ -250,7 +250,7 @@
  • implementers might want to localize the interface based on the language set at the system level, or at least fall back to English.
    • -

    Moreover, some user settings should be removed if used (letter-spacing) and another one added (arabic ligatures in ar and fa).

    +

    Moreover, some user settings should be removed if used (letter-spacing).

    diff --git a/docs/ReadiumCSS_docs/OEBPS/Text/Section-019.xhtml b/docs/ReadiumCSS_docs/OEBPS/Text/Section-019.xhtml index 0521fc2..0278f81 100644 --- a/docs/ReadiumCSS_docs/OEBPS/Text/Section-019.xhtml +++ b/docs/ReadiumCSS_docs/OEBPS/Text/Section-019.xhtml @@ -856,7 +856,7 @@ 
    --USER__ligatures
    -

    Enabling and disabling ligatures in Arabic (related to a11y).

    +

    Enabling and disabling ligatures.

    Scope: html

    diff --git a/docs/ReadiumCSS_docs/OEBPS/Text/Section-028.xhtml b/docs/ReadiumCSS_docs/OEBPS/Text/Section-028.xhtml index f14bc26..1db4bbf 100644 --- a/docs/ReadiumCSS_docs/OEBPS/Text/Section-028.xhtml +++ b/docs/ReadiumCSS_docs/OEBPS/Text/Section-028.xhtml @@ -281,6 +281,34 @@ const backgroundColor = defaultColors.RS__backgroundColor;

    They accept the same values as the CSS property padding.

    + +
    +

    Ligatures moved to the global space

    + +

    Since version 2.0.0-beta.22, ligatures are no longer limited to RTL (arabic and farsi scripts). The setting is now available in Latin scripts as well.

    +
    + +
    +

    Experimental Web Publications stylesheet

    + +

    Since version 2.0.0-beta.22, ReadiumCSS provides an experimental stylesheet for Web Publications. It ships with the following features:

    + +
      +
    • font-family
      • +
    • font variations (weight, width, optical-sizing)
      • +
    • hyphens
      • +
    • letter spacing
      • +
    • ligatures
      • +
    • line height
      • +
    • paragraph indent
      • +
    • paragraph spacing
      • +
    • Ruby annotations disabling
      • +
    + +

    As well as the patching of zoom for iOS and iPadOS. Note there is no fallback in case the zoom CSS property is not supported.

    + +

    Typically, you would use zoom for all web publications, and the rest of the styles if the web publication’s accessibility metadata contains feature displayTransformability.

    +
    \ No newline at end of file diff --git a/docs/ReadiumCSS_docs/OEBPS/Text/nav.xhtml b/docs/ReadiumCSS_docs/OEBPS/Text/nav.xhtml index c72efd9..75237a9 100644 --- a/docs/ReadiumCSS_docs/OEBPS/Text/nav.xhtml +++ b/docs/ReadiumCSS_docs/OEBPS/Text/nav.xhtml @@ -420,7 +420,7 @@ Characters’ spacing
  • - Ligatures (Arabic & Persian scripts) + Ligatures
    • @@ -753,6 +753,12 @@
  • Addition of scroll-padding module
    • +
  • + Ligatures moved to the global space +
    • +
  • + Experimental Web Publications stylesheet +
    • diff --git a/docs/ReadiumCSS_docs/OEBPS/content.opf b/docs/ReadiumCSS_docs/OEBPS/content.opf index 99ebd3f..45670e4 100644 --- a/docs/ReadiumCSS_docs/OEBPS/content.opf +++ b/docs/ReadiumCSS_docs/OEBPS/content.opf @@ -8,7 +8,7 @@ en urn:uuid:527D093B-9C0A-4C83-8AF6-0A40E91D30FC - 2025-08-29T12:28:00Z + 2025-11-03T17:21:00Z displayTransformability readingOrder diff --git a/docs/ReadiumCSS_docs/OEBPS/toc.ncx b/docs/ReadiumCSS_docs/OEBPS/toc.ncx index 8561b5e..4588945 100644 --- a/docs/ReadiumCSS_docs/OEBPS/toc.ncx +++ b/docs/ReadiumCSS_docs/OEBPS/toc.ncx @@ -767,7 +767,7 @@ - Ligatures (Arabic & Persian scripts) + Ligatures @@ -1377,6 +1377,18 @@ + + + Ligatures moved to the global space + + + + + + Experimental Web Publications stylesheet + + + \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 3e171f3..b88e3bb 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@readium/css", - "version": "2.0.0-beta.21", + "version": "2.0.0-beta.22", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@readium/css", - "version": "2.0.0-beta.21", + "version": "2.0.0-beta.22", "license": "BSD-3-Clause", "devDependencies": { "@daltontan/postcss-import-json": "^1.1.1", diff --git a/package.json b/package.json index e6b546d..6480c4b 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "@readium/css", "description": "A set of reference stylesheets for EPUB Reading Systems", - "version": "2.0.0-beta.21", + "version": "2.0.0-beta.22", "homepage": "https://github.com/readium/css", "license": "BSD-3-Clause", "keywords": [ @@ -45,7 +45,8 @@ "stylelint": "^16.4.0" }, "scripts": { - "build": "npm run build:ltr && npm run build:rtl && npm run build:cjk && npm run build:vertical && npm run copyPatches", + "build": "npm run build:ltr && npm run build:rtl && npm run build:cjk && npm run build:vertical && npm run build:web && npm run copyPatches", + "build:web": "postcss css/src/ReadiumCSS-webPub.css -o css/dist/webPub/ReadiumCSS-webPub.css", "build:ltr": "postcss css/src/ReadiumCSS-before.css -o css/dist/ReadiumCSS-before.css && postcss css/src/ReadiumCSS-default.css -o css/dist/ReadiumCSS-default.css && postcss css/src/ReadiumCSS-after.css -o css/dist/ReadiumCSS-after.css", "build:rtl": "postcss css/src/ReadiumCSS-before-rtl.css -o css/dist/rtl/ReadiumCSS-before.css && postcss css/src/ReadiumCSS-default-rtl.css -o css/dist/rtl/ReadiumCSS-default.css && postcss css/src/ReadiumCSS-after-rtl.css -o css/dist/rtl/ReadiumCSS-after.css", "build:cjk": "postcss css/src/ReadiumCSS-before-cjk-horizontal.css -o css/dist/cjk-horizontal/ReadiumCSS-before.css && postcss css/src/ReadiumCSS-default-cjk-horizontal.css -o css/dist/cjk-horizontal/ReadiumCSS-default.css && postcss css/src/ReadiumCSS-after-cjk-horizontal.css -o css/dist/cjk-horizontal/ReadiumCSS-after.css",