From d8ab41919a6e4d04c7c2c3a2775223f9bad4b686 Mon Sep 17 00:00:00 2001 From: Steven Zeck <8315038+stevenzeck@users.noreply.github.com> Date: Mon, 17 Aug 2026 11:07:32 -0500 Subject: [PATCH 01/21] Configure pnpm and makefile to install CSS Makefile updates CSS, and optionally minifies it --- Makefile | 3 +- Sources/Navigator/EPUB/Scripts/package.json | 5 + Sources/Navigator/EPUB/Scripts/pnpm-lock.yaml | 97 +++++++++++++++++-- .../Navigator/EPUB/Scripts/webpack.config.js | 89 +++++++++++------ 4 files changed, 154 insertions(+), 40 deletions(-) diff --git a/Makefile b/Makefile index 4f21cb571c..82f4e00f16 100644 --- a/Makefile +++ b/Makefile @@ -8,6 +8,7 @@ help: \t\t\tUse 'lcp=' to enable LCP.\n\ podspecs\t\tGenerate the CocoaPods podspecs\n\ scripts\t\tBundle the Navigator EPUB scripts\n\ + \t\t\tUse 'minify=true' to minify CSS assets.\n\ test\t\t\tRun unit tests\n\ \t\t\tUse 'only=' to run a single test target.\n\ lint-format\t\tVerify formatting\n\ @@ -65,7 +66,7 @@ scripts: pnpm run lint && \ pnpm run typecheck && \ pnpm run test && \ - pnpm run bundle + MINIFY_CSS=$(minify) pnpm run bundle .PHONY: update-scripts update-scripts: diff --git a/Sources/Navigator/EPUB/Scripts/package.json b/Sources/Navigator/EPUB/Scripts/package.json index be87a47c44..ae7eb3bbba 100644 --- a/Sources/Navigator/EPUB/Scripts/package.json +++ b/Sources/Navigator/EPUB/Scripts/package.json @@ -7,6 +7,7 @@ "private": true, "scripts": { "bundle": "webpack", + "bundle:minify": "MINIFY_CSS=true webpack", "lint": "eslint src", "typecheck": "tsc --noEmit", "test": "jest", @@ -20,9 +21,13 @@ "@babel/core": "^7.29.7", "@babel/preset-env": "^7.29.7", "@babel/preset-typescript": "^7.29.7", + "@readium/css": "2.0.5", + "@types/clean-css": "^4.2.11", "@types/jest": "^30.0.0", "@types/node": "^26.1.2", "babel-loader": "^8.4.1", + "clean-css": "^5.3.3", + "copy-webpack-plugin": "14.0.0", "eslint": "^7.32.0", "jest": "^30.4.2", "jest-environment-jsdom": "^30.4.1", diff --git a/Sources/Navigator/EPUB/Scripts/pnpm-lock.yaml b/Sources/Navigator/EPUB/Scripts/pnpm-lock.yaml index 4127b06fd5..34dad33302 100644 --- a/Sources/Navigator/EPUB/Scripts/pnpm-lock.yaml +++ b/Sources/Navigator/EPUB/Scripts/pnpm-lock.yaml @@ -28,6 +28,12 @@ devDependencies: '@babel/preset-typescript': specifier: ^7.29.7 version: 7.29.7(@babel/core@7.29.7) + '@readium/css': + specifier: 2.0.5 + version: 2.0.5 + '@types/clean-css': + specifier: ^4.2.11 + version: 4.2.11 '@types/jest': specifier: ^30.0.0 version: 30.0.0 @@ -37,6 +43,12 @@ devDependencies: babel-loader: specifier: ^8.4.1 version: 8.4.1(@babel/core@7.29.7)(webpack@5.107.2) + clean-css: + specifier: ^5.3.3 + version: 5.3.3 + copy-webpack-plugin: + specifier: 14.0.0 + version: 14.0.0(webpack@5.107.2) eslint: specifier: ^7.32.0 version: 7.32.0 @@ -57,7 +69,7 @@ devDependencies: version: 5.9.3 webpack: specifier: ^5.107.2 - version: 5.107.2(webpack-cli@5.1.4) + version: 5.107.2(clean-css@5.3.3)(webpack-cli@5.1.4) webpack-cli: specifier: ^5.1.4 version: 5.1.4(webpack@5.107.2) @@ -1807,6 +1819,10 @@ packages: engines: {node: ^14.18.0 || >=16.0.0} dev: true + /@readium/css@2.0.5: + resolution: {integrity: sha512-rQWeDFSS9UfRTFFdWIhlko0jtkL9dOfNTqFjgMumlguromsyHC9/lGmbWDde7deEeE5ns+yBOSGKixMU0wqZ4A==} + dev: true + /@sinclair/typebox@0.34.52: resolution: {integrity: sha512-XiMQh7qqVlxZzcVD+kkGMNGMzcTrDMLWI7S4x7z1MkCkbDPrekpZXEUK0eZqZFMuHQg2a2DZOcDIh9o5v3Gonw==} dev: true @@ -1860,6 +1876,13 @@ packages: '@babel/types': 7.29.7 dev: true + /@types/clean-css@4.2.11: + resolution: {integrity: sha512-Y8n81lQVTAfP2TOdtJJEsCoYl1AnOkqDqMvXb9/7pfgZZ7r8YrEyurrAvAoAjHOGXKRybay+5CsExqIH6liccw==} + dependencies: + '@types/node': 26.1.2 + source-map: 0.6.1 + dev: true + /@types/estree@1.0.9: resolution: {integrity: sha512-GhdPgy1el4/ImP05X05Uw4cw2/M93BCUmnEvWZNStlCzEKME4Fkk+YpoA5OiHNQmoS7Cafb8Xa3Pya8m1Qrzeg==} dev: true @@ -2220,7 +2243,7 @@ packages: webpack: 5.x.x webpack-cli: 5.x.x dependencies: - webpack: 5.107.2(webpack-cli@5.1.4) + webpack: 5.107.2(clean-css@5.3.3)(webpack-cli@5.1.4) webpack-cli: 5.1.4(webpack@5.107.2) dev: true @@ -2231,7 +2254,7 @@ packages: webpack: 5.x.x webpack-cli: 5.x.x dependencies: - webpack: 5.107.2(webpack-cli@5.1.4) + webpack: 5.107.2(clean-css@5.3.3)(webpack-cli@5.1.4) webpack-cli: 5.1.4(webpack@5.107.2) dev: true @@ -2246,7 +2269,7 @@ packages: webpack-dev-server: optional: true dependencies: - webpack: 5.107.2(webpack-cli@5.1.4) + webpack: 5.107.2(clean-css@5.3.3)(webpack-cli@5.1.4) webpack-cli: 5.1.4(webpack@5.107.2) dev: true @@ -2470,7 +2493,7 @@ packages: loader-utils: 2.0.4 make-dir: 3.1.0 schema-utils: 2.7.1 - webpack: 5.107.2(webpack-cli@5.1.4) + webpack: 5.107.2(clean-css@5.3.3)(webpack-cli@5.1.4) dev: true /babel-plugin-istanbul@7.0.1: @@ -2700,6 +2723,13 @@ packages: resolution: {integrity: sha512-4bHTS2YuzUvtoLjdy+98ykbNB5jS0+07EvFNXerqZQJ89F7DI6ET7OQo/HJuW6K0aVsKA9hj9/RVb2kQVOrPDQ==} dev: true + /clean-css@5.3.3: + resolution: {integrity: sha512-D5J+kHaVb/wKSFcyyV75uCn8fiY4sV38XJoe4CUyGQ+mOU/fMVYUdH1hJC+CJQ5uY3EnW27SbJYS4X8BiLrAFg==} + engines: {node: '>= 10.0'} + dependencies: + source-map: 0.6.1 + dev: true + /cliui@8.0.1: resolution: {integrity: sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==} engines: {node: '>=12'} @@ -2773,6 +2803,20 @@ packages: resolution: {integrity: sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==} dev: true + /copy-webpack-plugin@14.0.0(webpack@5.107.2): + resolution: {integrity: sha512-3JLW90aBGeaTLpM7mYQKpnVdgsUZRExY55giiZgLuX/xTQRUs1dOCwbBnWnvY6Q6rfZoXMNwzOQJCSZPppfqXA==} + engines: {node: '>= 20.9.0'} + peerDependencies: + webpack: ^5.1.0 + dependencies: + glob-parent: 6.0.2 + normalize-path: 3.0.0 + schema-utils: 4.3.3 + serialize-javascript: 7.1.0 + tinyglobby: 0.2.17 + webpack: 5.107.2(clean-css@5.3.3)(webpack-cli@5.1.4) + dev: true + /core-js-compat@3.49.0: resolution: {integrity: sha512-VQXt1jr9cBz03b331DFDCCP90b3fanciLkgiOoy8SBHy06gNf+vQ1A3WFLqG7I8TipYIKeYK9wxd0tUrvHcOZA==} dependencies: @@ -3281,6 +3325,18 @@ packages: bser: 2.1.1 dev: true + /fdir@6.5.0(picomatch@4.0.5): + resolution: {integrity: sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==} + engines: {node: '>=12.0.0'} + peerDependencies: + picomatch: ^3 || ^4 + peerDependenciesMeta: + picomatch: + optional: true + dependencies: + picomatch: 4.0.5 + dev: true + /file-entry-cache@6.0.1: resolution: {integrity: sha512-7Gps/XWymbLk2QLYK4NzpMOrYjMhdIxXuIvy2QBsLE6ljuodKvdkWs/cpyJJ3CVIVpH0Oi1Hvg1ovbMzLdFBBg==} engines: {node: ^10.12.0 || >=12.0.0} @@ -3441,6 +3497,13 @@ packages: is-glob: 4.0.3 dev: true + /glob-parent@6.0.2: + resolution: {integrity: sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==} + engines: {node: '>=10.13.0'} + dependencies: + is-glob: 4.0.3 + dev: true + /glob-to-regexp@0.4.1: resolution: {integrity: sha512-lkX1HJXwyMcprw/5YUZc2s7DrpAiHB21/V+E1rHUrVNokkvB6bqMzT0VfV6/86ZNabt1k14YOIaT7nDvOX3Iiw==} dev: true @@ -5040,6 +5103,11 @@ packages: hasBin: true dev: true + /serialize-javascript@7.1.0: + resolution: {integrity: sha512-RNEqWOyhhUQYN9V1GfHwu9AR/g+NTciH6Z5u3/no6X3/w+04J2lVDL+svFQVXgXrEGBMG2puMVN3gq2SNGuTGw==} + engines: {node: '>=20.0.0'} + dev: true + /set-function-length@1.2.2: resolution: {integrity: sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==} engines: {node: '>= 0.4'} @@ -5351,7 +5419,7 @@ packages: engines: {node: '>=6'} dev: true - /terser-webpack-plugin@5.6.1(webpack@5.107.2): + /terser-webpack-plugin@5.6.1(clean-css@5.3.3)(webpack@5.107.2): resolution: {integrity: sha512-201R5j+sJpK8nFWwKVyNfZot8FaJbLZDq5evriVzbV1wDtSXDjRUDRfJzHpAaxFDMEhsZL1QkeqM61wgsS3KaQ==} engines: {node: '>= 10.13.0'} peerDependencies: @@ -5395,10 +5463,11 @@ packages: optional: true dependencies: '@jridgewell/trace-mapping': 0.3.31 + clean-css: 5.3.3 jest-worker: 27.5.1 schema-utils: 4.3.3 terser: 5.48.0 - webpack: 5.107.2(webpack-cli@5.1.4) + webpack: 5.107.2(clean-css@5.3.3)(webpack-cli@5.1.4) dev: true /terser@5.48.0: @@ -5425,6 +5494,14 @@ packages: resolution: {integrity: sha512-N+8UisAXDGk8PFXP4HAzVR9nbfmVJ3zYLAWiTIoqC5v5isinhr+r5uaO8+7r3BMfuNIufIsA7RdpVgacC2cSpw==} dev: true + /tinyglobby@0.2.17: + resolution: {integrity: sha512-wXR/dYpcqKmfWpEdZjiKJOwCNFndD0DMnrW/cYjVGttEkBfVgcLFHoNrlj47mjOVic9yyNu65alsgF4NQyTa2g==} + engines: {node: '>=12.0.0'} + dependencies: + fdir: 6.5.0(picomatch@4.0.5) + picomatch: 4.0.5 + dev: true + /tldts-core@6.1.86: resolution: {integrity: sha512-Je6p7pkk+KMzMv2XXKmAE3McmolOQFdxkKw0R8EYNr7sELW46JqnNeTX8ybPiQgvg1ymCoF8LXs5fzFaZvJPTA==} dev: true @@ -5738,7 +5815,7 @@ packages: import-local: 3.2.0 interpret: 3.1.1 rechoir: 0.8.0 - webpack: 5.107.2(webpack-cli@5.1.4) + webpack: 5.107.2(clean-css@5.3.3)(webpack-cli@5.1.4) webpack-merge: 5.10.0 dev: true @@ -5756,7 +5833,7 @@ packages: engines: {node: '>=10.13.0'} dev: true - /webpack@5.107.2(webpack-cli@5.1.4): + /webpack@5.107.2(clean-css@5.3.3)(webpack-cli@5.1.4): resolution: {integrity: sha512-v7RhXaJbpMlV0D7hC7lb2EbnxkoeUqf9qhKr6lozx3Q48pmFrqqNRmZFUEGmi7pSwm6fCQ2H1IjvCkHqdpVdjQ==} engines: {node: '>=10.13.0'} hasBin: true @@ -5786,7 +5863,7 @@ packages: neo-async: 2.6.2 schema-utils: 4.3.3 tapable: 2.3.3 - terser-webpack-plugin: 5.6.1(webpack@5.107.2) + terser-webpack-plugin: 5.6.1(clean-css@5.3.3)(webpack@5.107.2) watchpack: 2.5.2 webpack-cli: 5.1.4(webpack@5.107.2) webpack-sources: 3.5.0 diff --git a/Sources/Navigator/EPUB/Scripts/webpack.config.js b/Sources/Navigator/EPUB/Scripts/webpack.config.js index 1ab9985af0..74edc99511 100644 --- a/Sources/Navigator/EPUB/Scripts/webpack.config.js +++ b/Sources/Navigator/EPUB/Scripts/webpack.config.js @@ -1,34 +1,65 @@ const path = require("path"); +const CopyPlugin = require("copy-webpack-plugin"); +const CleanCSS = require("clean-css"); -module.exports = { - mode: "production", - devtool: "source-map", - // devtool: "eval-source-map", - entry: { - reflowable: "./src/index-reflowable.js", - fixed: "./src/index-fixed.js", - "fixed-wrapper-one": "./src/index-fixed-wrapper-one.js", - "fixed-wrapper-two": "./src/index-fixed-wrapper-two.js", - }, - output: { - filename: "readium-[name].js", - path: path.resolve(__dirname, "../Assets/Static/scripts"), - }, - resolve: { - extensions: [".ts", "..."], - }, - module: { - rules: [ - { - test: /\.m?[jt]s$/, - exclude: /node_modules/, - use: { - loader: "babel-loader", - options: { - presets: ["@babel/preset-env", "@babel/preset-typescript"], +module.exports = (env = {}) => { + const shouldMinify = + process.env.MINIFY_CSS === "true" || + process.env.MINIFY_CSS === "1" || + env.minify === true || + env.minify === "true"; + + const cleanCSS = shouldMinify ? new CleanCSS() : null; + + return { + mode: "production", + devtool: "source-map", + // devtool: "eval-source-map", + entry: { + reflowable: "./src/index-reflowable.js", + fixed: "./src/index-fixed.js", + "fixed-wrapper-one": "./src/index-fixed-wrapper-one.js", + "fixed-wrapper-two": "./src/index-fixed-wrapper-two.js", + }, + output: { + filename: "readium-[name].js", + path: path.resolve(__dirname, "../Assets/Static/scripts"), + }, + resolve: { + extensions: [".ts", "..."], + }, + plugins: [ + new CopyPlugin({ + patterns: [ + { + from: path.resolve(__dirname, "node_modules/@readium/css/css/dist"), + to: path.resolve(__dirname, "../Assets/Static/readium-css"), + globOptions: { + ignore: ["**/fonts/**"], + }, + transform(content, absoluteFrom) { + if (shouldMinify && absoluteFrom.endsWith(".css")) { + return cleanCSS.minify(content).styles; + } + return content; + }, }, - }, - }, + ], + }), ], - }, + module: { + rules: [ + { + test: /\.m?[jt]s$/, + exclude: /node_modules/, + use: { + loader: "babel-loader", + options: { + presets: ["@babel/preset-env", "@babel/preset-typescript"], + }, + }, + }, + ], + }, + }; }; From 2486b7f200d7c56b7a3079f5d27f192c9fd31403 Mon Sep 17 00:00:00 2001 From: Steven Zeck <8315038+stevenzeck@users.noreply.github.com> Date: Mon, 17 Aug 2026 11:09:15 -0500 Subject: [PATCH 02/21] Update CSS files --- .../EPUB/Assets/Static/readium-css/ReadMe.md | 27 +- .../Static/readium-css/ReadiumCSS-after.css | 1147 ++++++----------- .../Static/readium-css/ReadiumCSS-before.css | 809 +++++------- .../Static/readium-css/ReadiumCSS-default.css | 232 ++-- .../ReadiumCSS-ebpaj_fonts_patch.css | 95 +- .../cjk-horizontal/ReadiumCSS-after.css | 886 +++++-------- .../cjk-horizontal/ReadiumCSS-before.css | 783 +++++------ .../cjk-horizontal/ReadiumCSS-default.css | 258 ++-- .../cjk-vertical/ReadiumCSS-after.css | 850 +++++------- .../cjk-vertical/ReadiumCSS-before.css | 783 +++++------ .../cjk-vertical/ReadiumCSS-default.css | 264 ++-- .../readium-css/rtl/ReadiumCSS-after.css | 971 ++++++-------- .../readium-css/rtl/ReadiumCSS-before.css | 783 +++++------ .../readium-css/rtl/ReadiumCSS-default.css | 232 ++-- .../readium-css/webPub/ReadiumCSS-webPub.css | 274 ++++ 15 files changed, 3581 insertions(+), 4813 deletions(-) create mode 100644 Sources/Navigator/EPUB/Assets/Static/readium-css/webPub/ReadiumCSS-webPub.css diff --git a/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadMe.md b/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadMe.md index b9d6ef6ee4..a8726098b5 100644 --- a/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadMe.md +++ b/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadMe.md @@ -25,13 +25,9 @@ Finally, page progression is impacted: Disabled user settings: - `hyphens`; -- `word-spacing`; +- a11y text normalization (`a11yNormalize`); - `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. @@ -53,9 +49,14 @@ Disabled user settings: - `text-align`; - `hyphens`; +- a11y text normalization (`a11yNormalize`); +- `ligatures`; - paragraphs’ indent; -- `word-spacing`; -- `letter-spacing`. +- `word-spacing`. + +Added user settings: + +- hiding/disabling ruby (mapped to `--USER__noRuby: readium-noRuby-on` flag). ### Vertical @@ -86,9 +87,14 @@ Disabled user settings: - `column-count` (number of columns); - `text-align`; - `hyphens`; +- a11y text normalization (`a11yNormalize`); +- `ligatures`; - paragraphs’ indent; -- `word-spacing`; -- `letter-spacing`. +- `word-spacing`. + +Added user settings: + +- hiding/disabling ruby (mapped to `--USER__noRuby: readium-noRuby-on` flag). ### EBPAJ Polyfill @@ -108,5 +114,4 @@ This is currently an edge case as we still have to see whether we want to suppor - Traditional is written `vertical-lr` so we can’t use `page-progression-direction` as an hint, and we must check if the language item (`mn`) is enough: - if `mn-Mong` is set, then `vertical-lr` must be used; - if `mn-Cyrl` is set, then the publication is in cyrillic and it is `horizontal-tb`. -- We don’t currently support the `mn` language, and we can’t rely on system fonts to do so, we’ll have to embed one. - +- We don’t currently support the `mn` language, and we can’t rely on system fonts to do so, we’ll have to embed one. \ No newline at end of file diff --git a/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadiumCSS-after.css b/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadiumCSS-after.css index eb6124c286..020aff7693 100644 --- a/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadiumCSS-after.css +++ b/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadiumCSS-after.css @@ -1,922 +1,589 @@ -/* Readium CSS - Config module - - A file allowing implementers to customize flags for reading modes, - user settings, etc. - - Repo: https://github.com/readium/readium-css */ - -/* Custom medias - Syntax: @custom-media --variable (prop: value) */ - -/* Responsive columns - The minimum width for which responsive columns (2 -> 1 and vice versa, - depending on the current font-size) must be enabled */ - -/* Mobile columns - The minimum and maximum width for mobile devices. - We’re forcing the landscape orientation by default, - and must still investigate large tablets (iPad Pro, Surface Pro 3, etc.). */ - -/* Custom selectors - Syntax: @custom-selector :--variable selector - The selectors you will use for flags/switches - You can alternatively use classes or custom data-* attributes */ - -/* User view = paged | scrolled */ - -/* Font-family override */ - -/* Advanced settings */ - -/* Reading Modes */ - -/* Filters (images) */ - -/* Accessibility normalization */ - -/* Accessibility font. You can add selectors, using “, ” as a separator, if you have multiple fonts */ - -/* Direction i.e. ltr and rtl */ - -/* Readium CSS - Namespaces module - - Namespaces to import in all 3 dist stylesheets - - Repo: https://github.com/readium/readium-css */ +/*! + * Readium CSS v.2.0.5 + * Copyright (c) 2017–2026. 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 + */ @namespace url("http://www.w3.org/1999/xhtml"); @namespace epub url("http://www.idpf.org/2007/ops"); -@namespace m url("http://www.w3.org/1998/Math/MathML/"); +@namespace m url("http://www.w3.org/1998/Math/MathML"); @namespace svg url("http://www.w3.org/2000/svg"); -/* Readium CSS - Pagination module - - A set of styles to paginate ePublications - - Repo: https://github.com/readium/readium-css */ - -/* Config */ +:root{ -/* Columns are responsive by default, even if column-width is set in pixels, - which means two-page spread will switch to single page depending on current font-size. - If you want more control, I’m afraid you’ll have to update colWidth/colGap dynamically, - which is how a significant amount of RS do at the moment. */ + --RS__viewportWidth:100%; -/* Default for smartphone portrait (small screens) */ + --RS__pageGutter:0; -:root { - /* Your columns’ width floor */ - --RS__colWidth: 45em; /* The width at which we’ll switch to 2 columns by default. PS: you can’t set it in rem */ + --RS__defaultLineLength:100%; - /* Ideal number of columns (depending on columns’ width floor) */ - --RS__colCount: 1; + --RS__colGap:0; - /* Gap between columns (in pixels so that it won’t resize with font-size) */ - --RS__colGap: 0; + --RS__colCount:1; - /* Optimal line-length (rem will take :root font-size into account, whatever the body’s font-size) */ - --RS__maxLineLength: 40rem; - - /* Default page horizontal margins (in pixels so that it won’t resize with font-size) */ - --RS__pageGutter: 20px; /* See if colGap and pageGutter can be the same var */ + --RS__colWidth:100vw; } -/* Reset page margins for Forward compatibility */ - -@page { - margin: 0 !important; +@page{ + margin:0 !important; } -/* :root selector has same specificity as a class i.e. 0010 - We might have to change that to html / context - -> https://css-tricks.com/almanac/selectors/r/root/ */ - -:root { - - /* In case you use left position to scroll, can be removed if using transform: translateX() */ - position: relative; - - -webkit-column-width: var(--RS__colWidth); - -moz-column-width: var(--RS__colWidth); - column-width: var(--RS__colWidth); - - /* Init pagination */ - /* TODO: document columns’ logic cos it might feel weird at first */ - -webkit-column-count: var(--RS__colCount); - -moz-column-count: var(--RS__colCount); - column-count: var(--RS__colCount); - - -webkit-column-gap: var(--RS__colGap); - -moz-column-gap: var(--RS__colGap); - column-gap: var(--RS__colGap); - - /* Default is balance and we want columns to be filled entirely (100vh) */ - -moz-column-fill: auto; - column-fill: auto; - width: 100%; - height: 100vh; - max-width: 100%; - max-height: 100vh; - min-width: 100%; - min-height: 100vh; - padding: 0 !important; - margin: 0 !important; - - /* Column size will depend on this if we want to make it responsive */ - font-size: 100% !important; - - -webkit-text-size-adjust: 100%; +:root{ + position:relative; - /* Switch to newer box model (not inherited by authors’ styles) */ - box-sizing: border-box; + -webkit-column-width:var(--RS__colWidth); + -moz-column-width:var(--RS__colWidth); + column-width:var(--RS__colWidth); + -webkit-column-count:var(--RS__colCount); + -moz-column-count:var(--RS__colCount); + column-count:var(--RS__colCount); - /* Fix bug for older Chrome */ - -webkit-perspective: 1; - /* Prevents options pop-up when long tap in webkit */ - -webkit-touch-callout: none; + -webkit-column-gap:var(--RS__colGap); + -moz-column-gap:var(--RS__colGap); + column-gap:var(--RS__colGap); + -moz-column-fill:auto; + column-fill:auto; + width:var(--RS__viewportWidth); + height:100vh; + max-width:var(--RS__viewportWidth); + max-height:100vh; + min-width:var(--RS__viewportWidth); + min-height:100vh; + padding:0 !important; + margin:0 !important; + font-size:1rem !important; + box-sizing:border-box; + -webkit-touch-callout:none; } -body { - /* overflow: hidden; bugfix: contents won’t paginate in Firefox and one sample in Safari */ - width: 100%; - - /* Limit line-length but we have to reset when 2 columns and control the viewport. - By using max-width + margin auto, margins will shrink when font-size increases, - which is what would be expected in terms of typography. */ - max-width: var(--RS__maxLineLength) !important; - padding: 0 var(--RS__pageGutter) !important; - margin: 0 auto !important; - - /* We need a minimum padding on body so that descandants/ascendants in italic/script are not cut-off. - Drawback: we have to use border-box so that it doesn’t screw the box model, - which means it impacts colWidth and max-width */ - box-sizing: border-box; +body{ + width:100%; + max-width:var(--RS__defaultLineLength) !important; + margin:0 auto !important; + box-sizing:border-box; } -/* We’ll now redefine margins and columns depending on the minimum width available - The goal is having the simplest model possible and avoid targeting devices */ - -/* Smartphone landscape */ - -@media screen and (min-width: 35em) { - :root { - --RS__pageGutter: 30px; - } +:root:not([style*="readium-scroll-on"]) body{ + padding:0 var(--RS__pageGutter) !important; } -/* Tablet portrait */ - -@media screen and (min-width: 45em) { - :root { - --RS__pageGutter: 40px; - } +:root:not([style*="readium-noOverflow-on"]) body{ + overflow:hidden; } -/* Desktop + tablet large */ +@supports (overflow: clip){ -/* We get the previous settings, we just change the margins */ + :root:not([style*="readium-noOverflow-on"]){ + overflow:clip; + } -@media screen and (min-width: 75em) { - :root { - --RS__pageGutter: 50px; - } + :root:not([style*="readium-noOverflow-on"]) body{ + overflow:clip; + overflow-clip-margin:content-box; + } } -/* At this point (80em or so), constraining line length must be done at the web view/iframe level, or by limiting the size of :root itself */ - -/* Responsive columns */ - -@media screen and (min-width: 60em), screen and (min-device-width: 36em) and (max-device-width: 47em) and (orientation: landscape) { - :root { - /* The size at which we want 2 columns to switch to 1 (depending on font-size) */ - --RS__colWidth: 20em; /* 20 * 16 = 320px but 20 * 28 = 560px so it will switch to 1 col @ 175% font-size (user-setting) on an iPad */ - /* We constrain to 2 columns so that we can never get 3 or 4, etc. */ - --RS__colCount: 2; - --RS__maxLineLength: 39.99rem; /* If we don’t use this, colNumber user setting won’t work in Safari… */ - } +:root[style*="readium-scroll-on"]{ + -webkit-columns:auto auto !important; + -moz-columns:auto auto !important; + columns:auto auto !important; + width:auto !important; + height:auto !important; + max-width:none !important; + max-height:none !important; + min-width:0 !important; + min-height:0 !important; } -/* Readium CSS - Scroll module - - A set of styles to scroll ePublications - This module overrides pagination - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-scroll-on"] { - - /* Reset columns, auto + auto = columns can’t be created */ - -webkit-columns: auto auto !important; - -moz-columns: auto auto !important; - columns: auto auto !important; - width: auto !important; - height: auto !important; - max-width: none !important; - max-height: none !important; - /* Reset html size so that the user can scroll */ - min-width: 0 !important; - min-height: 0 !important; +:root[style*="readium-scroll-on"] body{ + max-width:var(--RS__defaultLineLength) !important; + box-sizing:border-box !important; } -/* Make sure line-length is limited in all configs */ - -:root[style*="readium-scroll-on"] body { - --RS__maxLineLength: 40rem !important; +:root[style*="readium-scroll-on"]:not([style*="readium-noOverflow-on"]) body{ + overflow:auto; } -/* Readium CSS - Night mode - - A preset theme for night mode - - Repo: https://github.com/readium/readium-css */ - -/* CONFIG */ +@supports (overflow: clip){ -/* [style*="--USER__appearance"] can be used to increase specificity but performance hit */ - -:root[style*="readium-night-on"] { - --RS__backgroundColor: #000000; - --RS__textColor: #FEFEFE; - - --RS__linkColor: #63caff; - --RS__visitedColor: #0099E5; + :root[style*="readium-scroll-on"]:not([style*="readium-noOverflow-on"]){ + overflow:auto; + } - /* This can be customized but initial will re-use default value of the browser */ - --RS__selectionBackgroundColor: #b4d8fe; - --RS__selectionTextColor: inherit; + :root[style*="readium-scroll-on"]:not([style*="readium-noOverflow-on"]) body{ + overflow:clip; + } } -/* we don’t need to redeclare bg-color and color for :root since we will inherit and update from day/default mode */ - -:root[style*="readium-night-on"] *:not(a) { - color: inherit !important; - background-color: transparent !important; - border-color: currentColor !important; +:root[style*="readium-scroll-on"][style*="--RS__scrollPaddingTop"] body{ + padding-top:var(--RS__scrollPaddingTop) !important; } -:root[style*="readium-night-on"] svg text { - fill: currentColor !important; - stroke: none !important; +:root[style*="readium-scroll-on"][style*="--RS__scrollPaddingBottom"] body{ + padding-bottom:var(--RS__scrollPaddingBottom) !important; } -:root[style*="readium-night-on"] a:link, -:root[style*="readium-night-on"] a:link * { - color: var(--RS__linkColor) !important; +:root[style*="readium-scroll-on"][style*="--RS__scrollPaddingLeft"] body{ + padding-left:var(--RS__scrollPaddingLeft) !important; } -:root[style*="readium-night-on"] a:visited, -:root[style*="readium-night-on"] a:visited * { - color: var(--RS__visitedColor) !important; +:root[style*="readium-scroll-on"][style*="--RS__scrollPaddingRight"] body{ + padding-right:var(--RS__scrollPaddingRight) !important; } -/* For epub:type, in case the contents are served as text/html, namespaces won’t work hence why we’re using both syntax */ - -:root[style*="readium-night-on"] img[class*="gaiji"], -:root[style*="readium-night-on"] *[epub\:type~="titlepage"] img:only-child, -:root[style*="readium-night-on"] *[epub|type~="titlepage"] img:only-child { - -webkit-filter: invert(100%); - filter: invert(100%); +:root[style*="--USER__backgroundColor"]{ + background-color:var(--USER__backgroundColor) !important; } -/* Darken all images on user’s demand */ - -:root[style*="readium-night-on"][style*="readium-darken-on"] img { - -webkit-filter: brightness(80%); - filter: brightness(80%); +:root[style*="--USER__backgroundColor"] *{ + background-color:transparent !important; } -/* Invert all images on user’s demand */ - -:root[style*="readium-night-on"][style*="readium-invert-on"] img { - -webkit-filter: invert(100%); - filter: invert(100%); +:root[style*="--USER__textColor"]{ + color:var(--USER__textColor) !important; } -/* Darken and invert on user’s demand */ - -:root[style*="readium-night-on"][style*="readium-darken-on"][style*="readium-invert-on"] img { - -webkit-filter: brightness(80%) invert(100%); - filter: brightness(80%) invert(100%); +:root[style*="--USER__textColor"] *:not(a){ + color:inherit !important; + background-color:transparent !important; + border-color:currentcolor !important; } -/* Readium CSS - Sepia mode - - A preset theme for sepia mode - - Repo: https://github.com/readium/readium-css */ - -/* CONFIG */ - -:root[style*="readium-sepia-on"] { - --RS__backgroundColor: #faf4e8; - --RS__textColor: #121212; - - --RS__linkColor: #0000EE; - --RS__visitedColor: #551A8B; - - /* This can be customized but initial will re-use default value of the browser */ - --RS__selectionBackgroundColor: #b4d8fe; - --RS__selectionTextColor: inherit; - - --RS__maxLineLength: 40.01rem; /* Forcing a reflow in Blink/Webkit so that blend mode can work */ +:root[style*="--USER__textColor"] svg text{ + fill:currentcolor !important; + stroke:none !important; } -/* we don’t need to redeclare bg-color and color for :root since we will inherit and update from day/default mode */ - -:root[style*="readium-sepia-on"] *:not(a) { - color: inherit !important; - background-color: transparent !important; +:root[style*="--USER__linkColor"] a:link, +:root[style*="--USER__linkColor"] a:link *{ + color:var(--USER__linkColor) !important; } -:root[style*="readium-sepia-on"] a:link, -:root[style*="readium-sepia-on"] a:link * { - color: var(--RS__linkColor); +:root[style*="--USER__visitedColor"] a:visited, +:root[style*="--USER__visitedColor"] a:visited *{ + color:var(--USER__visitedColor) !important; } -:root[style*="readium-sepia-on"] a:visited, -:root[style*="readium-sepia-on"] a:visited * { - color: var(--RS__visitedColor); +:root[style*="--USER__selectionBackgroundColor"][style*="--USER__selectionTextColor"] ::-moz-selection{ + color:var(--USER__selectionTextColor) !important; + background-color:var(--USER__selectionBackgroundColor) !important; } -:root[style*="readium-sepia-on"] svg, -:root[style*="readium-sepia-on"] img { - /* Make sure the proper bg-color is used for the blend mode */ - background-color: transparent !important; - mix-blend-mode: multiply; +:root[style*="--USER__selectionBackgroundColor"][style*="--USER__selectionTextColor"] ::selection{ + color:var(--USER__selectionTextColor) !important; + background-color:var(--USER__selectionBackgroundColor) !important; } -/* Readium CSS - OS Accessibility Modes - - A stylesheet to deal with OS accessibility settings - - Repo: https://github.com/readium/readium-css */ +:root[style*="--USER__colCount"]{ + -webkit-column-count:var(--USER__colCount); + -moz-column-count:var(--USER__colCount); + column-count:var(--USER__colCount); -/* Windows high contrast colors are mapped to CSS system color keywords - See http://www.gwhitworth.com/blog/2017/04/how-to-use-ms-high-contrast */ - -@media screen and (-ms-high-contrast: active) { - :root { - color: windowText !important; - background-color: window !important; - } - - /* The following selectors are super funky but it makes sure everything is inherited, this is indeed critical for this mode */ - :root :not(#\#):not(#\#):not(#\#), - :root :not(#\#):not(#\#):not(#\#) :not(#\#):not(#\#):not(#\#) - :root :not(#\#):not(#\#):not(#\#) :not(#\#):not(#\#):not(#\#) :not(#\#):not(#\#):not(#\#) { - color: inherit !important; - background-color: inherit !important; - } - - .readiumCSS-mo-active-default { - color: highlightText !important; - background-color: highlight !important; - } - - /* For links, hyperlink keyword is automatically set */ - - /* Should we also set user highlights? */ + --RS__colWidth:auto; } -@media screen and (-ms-high-contrast: white-on-black) { - :root[style*="readium-night-on"] img[class*="gaiji"], - :root[style*="readium-night-on"] *[epub\:type~="titlepage"] img:only-child, - :root[style*="readium-night-on"] *[epub|type~="titlepage"] img:only-child { - -webkit-filter: none !important; - filter: none !important; - } - :root[style*="readium-night-on"][style*="readium-invert-on"] img { - -webkit-filter: none !important; - filter: none !important; - } - :root[style*="readium-night-on"][style*="readium-darken-on"][style*="readium-invert-on"] img { - -webkit-filter: brightness(80%); - filter: brightness(80%); - } +:root[style*="--USER__colCount: 0"], +:root[style*="--USER__colCount:0"]{ + -webkit-column-count:1; + -moz-column-count:1; + column-count:1; } -/* Will be true on recent versions of iOS and MacOS if inverted setting enabled by the user */ +:root[style*="--USER__colCount: 0"], +:root[style*="--USER__colCount:0"], +:root[style*="--USER__colCount: 1"], +:root[style*="--USER__colCount:1"]{ + --RS__colWidth:100vw; +} -@media screen and (inverted-colors) { - :root[style*="readium-night-on"] img[class*="gaiji"], - :root[style*="readium-night-on"] *[epub\:type~="titlepage"] img:only-child, - :root[style*="readium-night-on"] *[epub|type~="titlepage"] img:only-child { - -webkit-filter: none !important; - filter: none !important; - } - :root[style*="readium-night-on"][style*="readium-invert-on"] img { - -webkit-filter: none !important; - filter: none !important; - } - :root[style*="readium-night-on"][style*="readium-darken-on"][style*="readium-invert-on"] img { - -webkit-filter: brightness(80%); - filter: brightness(80%); +:root[style*="--USER__lineLength"] body{ + max-width:var(--USER__lineLength) !important; } -} -@media screen and (monochrome) { - /* Grayscale (Implemented in Safari, what about eInk?) */ - /* Must deal with anything color (contrast) so must be managed at the night/sepia/theme level :( */ +:root[style*="--USER__textAlign"]{ + text-align:var(--USER__textAlign); } -@media screen and (prefers-reduced-motion) { - /* If reduced motion is set on MacOS, in case we have animation/transition */ +:root[style*="--USER__textAlign"] body, +:root[style*="--USER__textAlign"] p:not( + blockquote p, + figcaption p, + header p, + hgroup p, + :root[style*="readium-experimentalHeaderFiltering-on"] p[class*="title"], + :root[style*="readium-experimentalHeaderFiltering-on"] div:has(+ *) > h1 + p, + :root[style*="readium-experimentalHeaderFiltering-on"] 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; } -/* Readium CSS - Columns number pref - - A submodule managing columns number for user settings - Part of “Chrome Advanced” class – no flag required. - - Repo: https://github.com/readium/readium-css */ - -/* Number of columns = 1 | 2 */ - -/* We still need to see if we allow users to force number of columns for all configs, currently it behaves as an "auto" setting */ - -/* apply col setting except for mobile portrait */ - -@media screen and (min-width: 60em), screen and (min-device-width: 36em) and (max-device-width: 47em) and (orientation: landscape) { - :root[style*="--USER__colCount: 1"], - :root[style*="--USER__colCount:1"], - :root[style*="--USER__colCount: 2"], - :root[style*="--USER__colCount:2"] { - -webkit-column-count: var(--USER__colCount); - -moz-column-count: var(--USER__colCount); - column-count: var(--USER__colCount); - } - - /* If one column, make sure we limit line-length */ - :root[style*="--USER__colCount: 1"], - :root[style*="--USER__colCount:1"] { - --RS__maxLineLength: 40rem !important; /* This is the only way for the user setting to work in webkit… */ - --RS__colWidth: 100vw; - } - - /* If smartphone landscape, and 2 columns, col width the same as iPad landscape + desktop */ - :root[style*="--USER__colCount: 2"], - :root[style*="--USER__colCount:2"] { - --RS__colWidth: auto; /* User explicitely tells he/she wants 2 columns, we reset floor value */ - } +: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; } -/* Readium CSS - Page margins pref - - A submodule managing page margins for user settings - Part of “Chrome Advanced” class – no flag required. - - Repo: https://github.com/readium/readium-css */ - -/* Page Margins: the user margin is a factor of the page gutter e.g. 0.5, 0.75, 1, 1.25, 1.5, etc. */ - -:root[style*="--USER__pageMargins"] body { - padding: 0 calc(var(--RS__pageGutter) * var(--USER__pageMargins)) !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: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; } -/* Readium CSS - Custom colors pref - - A submodule managing custom colors for user settings - Part of “Chrome Advanced” class – no flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="--USER__backgroundColor"] { - background-color: var(--USER__backgroundColor) !important; +:root[style*="--USER__fontFamily"]{ + font-family:var(--USER__fontFamily) !important; } -:root[style*="--USER__backgroundColor"] * { - background-color: transparent !important; +:root[style*="--USER__fontFamily"] *{ + font-family:revert !important; } -:root[style*="--USER__textColor"] { - color: var(--USER__textColor) !important; +:root[style*="readium-a11y-on"]{ + font-style:normal !important; + font-weight:normal !important; } -:root[style*="--USER__textColor"] *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(pre) { - color: inherit !important; +: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; } -/* Readium CSS - Text align pref - - A submodule managing text-align for user settings - Part of “User Overrides Advanced” class – “advanced settings” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-advanced-on"][style*="--USER__textAlign"] { - text-align: var(--USER__textAlign); +:root[style*="readium-a11y-on"] body *:not(a){ + text-decoration:none !important; } -:root[style*="readium-advanced-on"][style*="--USER__textAlign"] body, -:root[style*="readium-advanced-on"][style*="--USER__textAlign"] *:not(blockquote):not(figcaption) p, -:root[style*="readium-advanced-on"][style*="--USER__textAlign"] li { - text-align: inherit !important; - -moz-text-align-last: auto !important; - -epub-text-align-last: auto !important; - text-align-last: auto !important; +:root[style*="readium-a11y-on"] body *{ + font-variant-caps:normal !important; + font-variant-numeric:normal !important; + font-variant-position:normal !important; } -/* In case something goes wrong at the programmatic level + rtl for body + rtl in ltr */ - -:root[style*="readium-advanced-on"][dir="rtl"][style*="--USER__textAlign: left"], -:root[style*="readium-advanced-on"][dir="rtl"][style*="--USER__textAlign:left"], -:root[style*="readium-advanced-on"][style*="--USER__textAlign: left"] *[dir="rtl"], -:root[style*="readium-advanced-on"][style*="--USER__textAlign:left"] *[dir="rtl"] { - text-align: right; +:root[style*="readium-a11y-on"] sup, +:root[style*="readium-a11y-on"] sub{ + font-size:1rem !important; + vertical-align:baseline !important; } -/* Edge, if logical value is used, think of it as a polyfill. For LTR, it will fall back to the default, which is left */ +:root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] body{ + zoom:var(--USER__fontSize) !important; +} -:root[style*="readium-advanced-on"][dir="rtl"][style*="--USER__textAlign: start"], -:root[style*="readium-advanced-on"][dir="rtl"][style*="--USER__textAlign:start"] { - text-align: right; +:root:not([style*="readium-deprecatedFontSize-on"])[style*="readium-iOSPatch-on"][style*="--USER__fontSize"] body{ + -webkit-text-size-adjust:var(--USER__fontSize) !important; } -/* Readium CSS - Hyphenation pref +@supports selector(figure:has(> img)){ - A submodule managing hyphens for user settings - Part of “User Overrides Advanced” class – “advanced settings” flag required. + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> img), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> video), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> svg), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> canvas), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> iframe), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> audio), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> img:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> video:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> svg:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> canvas:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> iframe:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> audio:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] table{ + zoom:calc(100% / var(--USER__fontSize)) !important; + } - Repo: https://github.com/readium/readium-css */ + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figcaption, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] caption, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] td, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] th{ + zoom:var(--USER__fontSize) !important; + } +} -/* Managing hyphenation automatically for text-align values */ +@supports not (zoom: 1){ -:root[style*="readium-advanced-on"][style*="--USER__textAlign: justify"] body, -:root[style*="readium-advanced-on"][style*="--USER__textAlign:justify"] body { - -webkit-hyphens: auto; - -moz-hyphens: auto; - -ms-hyphens: auto; - -epub-hyphens: auto; - hyphens: auto; + :root[style*="--USER__fontSize"]{ + font-size:var(--USER__fontSize) !important; + } } -:root[style*="readium-advanced-on"][style*="--USER__textAlign: left"] body, -:root[style*="readium-advanced-on"][style*="--USER__textAlign:left"] body, -:root[style*="readium-advanced-on"][style*="--USER__textAlign: right"] body, -:root[style*="readium-advanced-on"][style*="--USER__textAlign:right"] body { - -webkit-hyphens: none; - -moz-hyphens: none; - -ms-hyphens: none; - -epub-hyphens: none; - hyphens: none; +:root[style*="readium-deprecatedFontSize-on"][style*="--USER__fontSize"]{ + font-size:var(--USER__fontSize) !important; } -/* Managing the user override */ - -:root[style*="readium-advanced-on"][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__lineHeight"]{ + line-height:var(--USER__lineHeight) !important; } -/* Sorry, we can’t use `:matches`, `:-moz-any` or `:-webkit-any` because MS doesn’t support it yet */ - -:root[style*="readium-advanced-on"][style*="--USER__bodyHyphens"] body, -:root[style*="readium-advanced-on"][style*="--USER__bodyHyphens"] p, -:root[style*="readium-advanced-on"][style*="--USER__bodyHyphens"] li, -:root[style*="readium-advanced-on"][style*="--USER__bodyHyphens"] div, -:root[style*="readium-advanced-on"][style*="--USER__bodyHyphens"] dd { - -webkit-hyphens: inherit; - -moz-hyphens: inherit; - -ms-hyphens: inherit; - -epub-hyphens: inherit; - hyphens: inherit; +:root[style*="--USER__lineHeight"] body, +:root[style*="--USER__lineHeight"] p, +:root[style*="--USER__lineHeight"] li, +:root[style*="--USER__lineHeight"] div{ + line-height:var(--USER__lineHeight) !important; } -/* Readium CSS - Font Family pref - - A submodule managing font-family for user settings - Part of “User Overrides” class – “font override” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-font-on"][style*="--USER__fontFamily"] { - font-family: var(--USER__fontFamily) !important; +:root[style*="--USER__paraSpacing"] p{ + margin-top:var(--USER__paraSpacing) !important; + margin-bottom:var(--USER__paraSpacing) !important; } -:root[style*="readium-font-on"][style*="--USER__fontFamily"] body, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] p, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] li, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] div, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] dt, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] dd { - font-family: inherit !important; +:root[style*="--USER__paraIndent"] p:not( + blockquote p, + figcaption p, + header p, + hgroup p, + :root[style*="readium-experimentalHeaderFiltering-on"] p[class*="title"], + :root[style*="readium-experimentalHeaderFiltering-on"] div:has(+ *) > h1 + p, + :root[style*="readium-experimentalHeaderFiltering-on"] div:has(+ *) > p:has(+ h1) +){ + text-indent:var(--USER__paraIndent) !important; } -:root[style*="readium-font-on"][style*="--USER__fontFamily"] i:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] i:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] em:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] em:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] cite:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] cite:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] b:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] b:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] strong:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] strong:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] span:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] span:not([xml\:lang]) { - font-family: inherit !important; +:root[style*="--USER__paraIndent"] p *{ + text-indent:0 !important; } -/* Readium CSS - A11y font pref - - A submodule managing a11y text normalization for user settings - Part of “User Overrides” class – “font override” flag required. - - Repo: https://github.com/readium/readium-css */ - -/* For AccessibleDfA, we need to normalize font-weight and font-style since only the normal style is available */ - -:root[style*="readium-font-on"][style*="AccessibleDfA"] { - /* We won’t use the variable there since we need fallbacks for missing characters */ - font-family: AccessibleDfA, Verdana, Tahoma, "Trebuchet MS", sans-serif !important; - --RS__lineHeightCompensation: 1.167; +: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) !important; } -:root[style*="readium-font-on"][style*="IA Writer Duospace"] { - /* We won’t use the variable there since we need fallbacks for missing characters */ - font-family: "IA Writer Duospace", Menlo, "DejaVu Sans Mono", "Bitstream Vera Sans Mono", Courier, monospace !important; - --RS__lineHeightCompensation: 1.167; +: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) !important; + font-variant:none !important; } -:root[style*="readium-font-on"][style*="readium-a11y-on"] { - font-family: var(--USER__fontFamily) !important; - --RS__lineHeightCompensation: 1.167; +:root[style*="--USER__ligatures"]{ + font-variant-ligatures:var(--USER__ligatures) !important; } -/* Maybe users want a setting to normalize any font offered so there is a “a11y Normalize” flag for it */ - -:root[style*="readium-font-on"][style*="AccessibleDfA"], -:root[style*="readium-font-on"][style*="IA Writer Duospace"], -:root[style*="readium-font-on"][style*="readium-a11y-on"] { - font-style: normal !important; - font-weight: normal !important; +:root[style*="--USER__ligatures"] *{ + font-variant-ligatures:inherit !important; } -/* Targeting everything except code. Note that Open Dyslexic has a monospaced font for code */ - -:root[style*="readium-font-on"][style*="AccessibleDfA"] *:not(code):not(var):not(kbd):not(samp), -:root[style*="readium-font-on"][style*="IA Writer Duospace"] *:not(code):not(var):not(kbd):not(samp), -:root[style*="readium-font-on"][style*="readium-a11y-on"] *:not(code):not(var):not(kbd):not(samp) { - font-family: inherit !important; - font-style: inherit !important; - font-weight: inherit !important; +:root[style*="--USER__fontWeight"] body{ + font-weight:var(--USER__fontWeight) !important; } -/* Normalizing text-decoration, subs and sups */ - -:root[style*="readium-font-on"][style*="AccessibleDfA"] *, -:root[style*="readium-font-on"][style*="IA Writer Duospace"] *, -:root[style*="readium-font-on"][style*="readium-a11y-on"] * { - text-decoration: none !important; - font-variant-caps: normal !important; - font-variant-numeric: normal !important; - font-variant-position: normal !important; +:root[style*="--USER__fontWeight"] b, +:root[style*="--USER__fontWeight"] strong{ + font-weight:bolder; } -:root[style*="readium-font-on"][style*="AccessibleDfA"] sup, -:root[style*="readium-font-on"][style*="IA Writer Duospace"] sup, -:root[style*="readium-font-on"][style*="readium-a11y-on"] sup, -:root[style*="readium-font-on"][style*="AccessibleDfA"] sub, -:root[style*="readium-font-on"][style*="IA Writer Duospace"] sub, -:root[style*="readium-font-on"][style*="readium-a11y-on"] sub { - font-size: 1rem !important; - vertical-align: baseline !important; +:root[style*="--USER__fontWidth"] body{ + font-stretch:var(--USER__fontWidth) !important; } -/* Readium CSS - Font size pref - - A submodule managing font-size for user settings - Part of “User Overrides” class – no flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="--USER__fontSize"] { - font-size: var(--USER__fontSize) !important; +:root[style*="--USER__fontOpticalSizing"] body{ + font-optical-sizing:var(--USER__fontOpticalSizing) !important; } -/* Readium CSS - Line height pref - - A submodule managing line-height for user settings - Part of “User Overrides Advanced” class – “advanced settings” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] { - line-height: var(--USER__lineHeight) !important; +:root[style*="readium-blend-on"] svg, +:root[style*="readium-blend-on"] img{ + background-color:transparent !important; + mix-blend-mode:multiply !important; } -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] body, -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] p, -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] li, -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] div { - line-height: inherit; +:root[style*="--USER__darkenImages"] img{ + -webkit-filter:brightness(var(--USER__darkenImages)) !important; + filter:brightness(var(--USER__darkenImages)) !important; } -/* Readium CSS - Para spacing pref - - A submodule managing paragraphs’ top and bottom margins for user settings - Part of “User Overrides Advanced” class – “advanced settings” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-advanced-on"][style*="--USER__paraSpacing"] p { - margin-top: var(--USER__paraSpacing) !important; - margin-bottom: var(--USER__paraSpacing) !important; +:root[style*="readium-darken-on"] img{ + -webkit-filter:brightness(80%) !important; + filter:brightness(80%) !important; } -/* Readium CSS - Para indent pref - - A submodule managing paragraphs’ text-indent for user settings - Part of “User Overrides Advanced” class – “advanced settings” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-advanced-on"][style*="--USER__paraIndent"] p { - text-indent: var(--USER__paraIndent) !important; +:root[style*="--USER__invertImages"] img{ + -webkit-filter:invert(var(--USER__invertImages)) !important; + filter:invert(var(--USER__invertImages)) !important; } -/* If there are inline-block elements in paragraphs, text-indent will inherit so we must reset it */ - -:root[style*="readium-advanced-on"][style*="--USER__paraIndent"] p * { - text-indent: 0 !important; +:root[style*="readium-invert-on"] img{ + -webkit-filter:invert(100%) !important; + filter:invert(100%) !important; } -/* Readium CSS - Word spacing pref - - A submodule managing word-spacing for user settings - Part of “User Overrides Advanced” class – “advanced settings” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-advanced-on"][style*="--USER__wordSpacing"] h1, -:root[style*="readium-advanced-on"][style*="--USER__wordSpacing"] h2, -:root[style*="readium-advanced-on"][style*="--USER__wordSpacing"] h3, -:root[style*="readium-advanced-on"][style*="--USER__wordSpacing"] h4, -:root[style*="readium-advanced-on"][style*="--USER__wordSpacing"] h5, -:root[style*="readium-advanced-on"][style*="--USER__wordSpacing"] h6, -:root[style*="readium-advanced-on"][style*="--USER__wordSpacing"] p, -:root[style*="readium-advanced-on"][style*="--USER__wordSpacing"] li, -:root[style*="readium-advanced-on"][style*="--USER__wordSpacing"] div { - word-spacing: var(--USER__wordSpacing); +:root[style*="--USER__darkenImages"][style*="--USER__invertImages"] img{ + -webkit-filter:brightness(var(--USER__darkenImages)) invert(var(--USER__invertImages)) !important; + filter:brightness(var(--USER__darkenImages)) invert(var(--USER__invertImages)) !important; } -/* Readium CSS - Letter spacing pref - - A submodule managing letter-spacing for user settings - Part of “User Overrides Advanced” class – “advanced settings” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-advanced-on"][style*="--USER__letterSpacing"] h1, -:root[style*="readium-advanced-on"][style*="--USER__letterSpacing"] h2, -:root[style*="readium-advanced-on"][style*="--USER__letterSpacing"] h3, -:root[style*="readium-advanced-on"][style*="--USER__letterSpacing"] h4, -:root[style*="readium-advanced-on"][style*="--USER__letterSpacing"] h5, -:root[style*="readium-advanced-on"][style*="--USER__letterSpacing"] h6, -:root[style*="readium-advanced-on"][style*="--USER__letterSpacing"] p, -:root[style*="readium-advanced-on"][style*="--USER__letterSpacing"] li, -:root[style*="readium-advanced-on"][style*="--USER__letterSpacing"] div { - letter-spacing: var(--USER__letterSpacing); - font-variant: none; +:root[style*="readium-darken-on"][style*="--USER__invertImages"] img{ + -webkit-filter:brightness(80%) invert(var(--USER__invertImages)) !important; + filter:brightness(80%) invert(var(--USER__invertImages)) !important; } -/* Readium CSS - Font size normalize - - A stylesheet to normalize font-size - - Repo: https://github.com/readium/readium-css */ - -/* STYLES */ - -/* :root is used so that you can quickly add a class or attribute if you prefer e.g. `:root[data-rs-normalize]` */ - -/* We create a default so that you don’t need to explicitly set one in the DOM. - Once the “Publisher’s styles” checkbox is unchecked, the normalize is applied automatically */ - -:root[style*="readium-advanced-on"] { - --USER__typeScale: 1.2; /* This is the default type scale you’ll find in most publications */ +:root[style*="--USER__darkenImages"][style*="readium-invert-on"] img{ + -webkit-filter:brightness(var(--USER__darkenImages)) invert(100%) !important; + filter:brightness(var(--USER__darkenImages)) invert(100%) !important; } -:root[style*="readium-advanced-on"] p, -:root[style*="readium-advanced-on"] li, -:root[style*="readium-advanced-on"] div, -:root[style*="readium-advanced-on"] pre, -:root[style*="readium-advanced-on"] dd { - font-size: 1rem !important; +:root[style*="readium-darken-on"][style*="readium-invert-on"] img{ + -webkit-filter:brightness(80%) invert(100%) !important; + filter:brightness(80%) invert(100%) !important; } -:root[style*="readium-advanced-on"] h1 { - /* Fallback if browser doesn’t support vars */ - font-size: 1.75rem !important; - font-size: calc(((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) * var(--USER__typeScale)) !important; +:root[style*="--USER__invertGaiji"] img[class*="gaiji"]{ + -webkit-filter:invert(var(--USER__invertGaiji)) !important; + filter:invert(var(--USER__invertGaiji)) !important; } -:root[style*="readium-advanced-on"] h2 { - /* Fallback if browser doesn’t support vars */ - font-size: 1.5rem !important; - font-size: calc((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) !important; +:root[style*="readium-invertGaiji-on"] img[class*="gaiji"]{ + -webkit-filter:invert(100%) !important; + filter:invert(100%) !important; } -:root[style*="readium-advanced-on"] h3 { - /* Fallback if browser doesn’t support vars */ - font-size: 1.25rem !important; - font-size: calc(1rem * var(--USER__typeScale)) !important; +:root[style*="readium-normalize-on"]{ + --USER__typeScale:1.2; } -:root[style*="readium-advanced-on"] h4, -:root[style*="readium-advanced-on"] h5, -:root[style*="readium-advanced-on"] h6 { - font-size: 1rem !important; +:root[style*="readium-normalize-on"] p, +:root[style*="readium-normalize-on"] li, +:root[style*="readium-normalize-on"] div, +:root[style*="readium-normalize-on"] pre, +:root[style*="readium-normalize-on"] dd{ + font-size:1rem !important; } -:root[style*="readium-advanced-on"] small { - font-size: smaller !important; +:root[style*="readium-normalize-on"] h1{ + font-size:1.75rem !important; + font-size:calc(((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) * var(--USER__typeScale)) !important; } -:root[style*="readium-advanced-on"] sub, -:root[style*="readium-advanced-on"] sup { - font-size: 67.5% !important; +:root[style*="readium-normalize-on"] h2{ + font-size:1.5rem !important; + font-size:calc((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) !important; } -/* The following styles kick in if you define the typeScale variable in the DOM. - No need to repeat declarations which don’t make use of the variable */ - -:root[style*="readium-advanced-on"][style*="--USER__typeScale"] h1 { - font-size: calc(((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) * var(--USER__typeScale)) !important; +:root[style*="readium-normalize-on"] h3{ + font-size:1.25rem !important; + font-size:calc(1rem * var(--USER__typeScale)) !important; } -:root[style*="readium-advanced-on"][style*="--USER__typeScale"] h2 { - font-size: calc((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) !important; +:root[style*="readium-normalize-on"] h4, +:root[style*="readium-normalize-on"] h5, +:root[style*="readium-normalize-on"] h6{ + font-size:1rem !important; } -:root[style*="readium-advanced-on"][style*="--USER__typeScale"] h3 { - font-size: calc(1rem * var(--USER__typeScale)) !important; +:root[style*="readium-normalize-on"] small{ + font-size:smaller !important; } -/* Readium CSS - Default highlights - - A stylesheet for user highlights - - Repo: https://github.com/readium/readium-css */ - -/* User Highlights */ +:root[style*="readium-normalize-on"] sub, +:root[style*="readium-normalize-on"] sup{ + font-size:67.5% !important; +} -.readiumCSS-yellow-highlight, -:root[style*="readium-sepia-on"] .readiumCSS-yellow-highlight, -:root[style*="readium-night-on"] .readiumCSS-yellow-highlight { - background-color: rgba(255, 255, 0, 0.5) !important; +:root[style*="readium-normalize-on"][style*="--USER__typeScale"] h1{ + font-size:calc(((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) * var(--USER__typeScale)) !important; } -.readiumCSS-green-highlight, -:root[style*="readium-sepia-on"] .readiumCSS-green-highlight, -:root[style*="readium-night-on"] .readiumCSS-green-highlight { - background-color: rgba(0, 255, 0, 0.5) !important; +:root[style*="readium-normalize-on"][style*="--USER__typeScale"] h2{ + font-size:calc((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) !important; } -.readiumCSS-orange-highlight, -:root[style*="readium-sepia-on"] .readiumCSS-orange-highlight, -:root[style*="readium-night-on"] .readiumCSS-orange-highlight { - background-color: rgba(255, 165, 0, 0.5) !important; +:root[style*="readium-normalize-on"][style*="--USER__typeScale"] h3{ + font-size:calc(1rem * var(--USER__typeScale)) !important; } -.readiumCSS-pink-highlight, -:root[style*="readium-sepia-on"] .readiumCSS-pink-highlight, -:root[style*="readium-night-on"] .readiumCSS-pink-highlight { - background-color: rgba(255, 105, 180, 0.5) !important; +:root[style*="readium-iPadOSPatch-on"] body{ + -webkit-text-size-adjust:none; } -/* Media overlays */ +: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; +} -.readiumCSS-mo-active-default { - color: black !important; - background-color: yellow !important; +: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; } -/*# sourceMappingURL=ReadiumCSS-after.css.map */ + +: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/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadiumCSS-before.css b/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadiumCSS-before.css index 6511e6d589..4271373511 100644 --- a/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadiumCSS-before.css +++ b/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadiumCSS-before.css @@ -1,643 +1,526 @@ -/* Readium CSS - Config module +/*! + * Readium CSS v.2.0.5 + * Copyright (c) 2017–2026. 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 + */ - A file allowing implementers to customize flags for reading modes, - user settings, etc. - - Repo: https://github.com/readium/readium-css */ +@namespace url("http://www.w3.org/1999/xhtml"); -/* Custom medias - Syntax: @custom-media --variable (prop: value) */ +@namespace epub url("http://www.idpf.org/2007/ops"); -/* Responsive columns - The minimum width for which responsive columns (2 -> 1 and vice versa, - depending on the current font-size) must be enabled */ +@namespace m url("http://www.w3.org/1998/Math/MathML"); -/* Mobile columns - The minimum and maximum width for mobile devices. - We’re forcing the landscape orientation by default, - and must still investigate large tablets (iPad Pro, Surface Pro 3, etc.). */ +@namespace svg url("http://www.w3.org/2000/svg"); -/* Custom selectors - Syntax: @custom-selector :--variable selector - The selectors you will use for flags/switches - You can alternatively use classes or custom data-* attributes */ +@-ms-viewport{ + width:device-width; +} -/* User view = paged | scrolled */ +@viewport{ + width:device-width; + zoom:1; +} -/* Font-family override */ +:root{ -/* Advanced settings */ + --RS__sans-serif-ja-v:'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ W3', 'YuGothic', 'Yu Gothic Medium', 'BIZ UDGothic', 'Yu Gothic', 'ＭＳゴシック', 'MS Gothic', sans-serif; -/* Reading Modes */ + --RS__serif-ja-v:'Hiragino Mincho ProN', 'Hiragino Mincho Pro', 'YuMincho', 'BIZ UDMincho', 'Yu Mincho', 'ＭＳ明朝', 'MS Mincho', serif; -/* Filters (images) */ + --RS__sans-serif-ja:'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ W3', 'YuGothic', 'Yu Gothic Medium', 'BIZ UDPGothic', 'Yu Gothic', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; -/* Accessibility normalization */ + --RS__serif-ja:'Hiragino Mincho ProN', 'Hiragino Mincho Pro', 'YuMincho', 'BIZ UDPMincho', 'Yu Mincho', 'ＭＳ Ｐ明朝', 'MS PMincho', serif; -/* Accessibility font. You can add selectors, using “, ” as a separator, if you have multiple fonts */ + --RS__monospaceTf:ui-monospace, 'Andale Mono', 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; -/* Direction i.e. ltr and rtl */ + --RS__humanistTf:Seravek, Calibri, 'Gill Sans Nova', Roboto, Ubuntu, 'DejaVu Sans', source-sans-pro, sans-serif; -/* Readium CSS - Namespaces module + --RS__sansTf:-ui-sans-serif, -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI Variable', 'Segoe UI', Inter, Roboto, 'Helvetica Neue', 'Arial Nova', 'Liberation Sans', Arial, sans-serif; - Namespaces to import in all 3 dist stylesheets + --RS__modernTf:Athelas, Constantia, Charter, 'Bitstream Charter', Cambria, 'Georgia Pro', Georgia, serif; - Repo: https://github.com/readium/readium-css */ + --RS__oldStyleTf:'Iowan Old Style', Sitka, 'Sitka Text', Palatino, 'Book Antiqua', 'URW Palladio L', P052, serif; -@namespace url("http://www.w3.org/1999/xhtml"); + --RS__zh-HK-lineHeightCompensation:1.167; -@namespace epub url("http://www.idpf.org/2007/ops"); + --RS__zh-HK-baseFontFamily:'方體', 'PingFang HK', '方體', 'PingFang TC', '黑體', 'Heiti TC', 'Microsoft JhengHei UI', 'Microsoft JhengHei', Roboto, Noto, 'Noto Sans CJK TC', sans-serif; -@namespace m url("http://www.w3.org/1998/Math/MathML/"); + --RS__zh-TW-lineHeightCompensation:1.167; -@namespace svg url("http://www.w3.org/2000/svg"); + --RS__zh-TW-baseFontFamily:'方體', 'PingFang TC', '黑體', 'Heiti TC', 'Microsoft JhengHei UI', 'Microsoft JhengHei', Roboto, Noto, 'Noto Sans CJK TC', sans-serif; -/* Readium CSS - Base module + --RS__zh-Hant-lineHeightCompensation:1.167; - A minimal stylesheet for all ebooks + --RS__zh-Hant-baseFontFamily:'方體', 'PingFang TC', '黑體', 'Heiti TC', 'Microsoft JhengHei UI', 'Microsoft JhengHei', Roboto, Noto, 'Noto Sans CJK TC', sans-serif; - Repo: https://github.com/readium/readium-css */ + --RS__zh-lineHeightCompensation:1.167; -/* Define viewport, HTML5-style */ + --RS__zh-baseFontFamily:'方体', 'PingFang SC', '黑体', 'Heiti SC', 'Microsoft JhengHei UI', 'Microsoft JhengHei', Roboto, Noto, 'Noto Sans CJK SC', sans-serif; -@-ms-viewport { - width: device-width; -} + --RS__th-lineHeightCompensation:1.067; -@viewport { - width: device-width; - zoom: 1; -} + --RS__th-baseFontFamily:Thonburi, 'Leelawadee UI', 'Cordia New', Roboto, Noto, 'Noto Sans Thai', sans-serif; -:root { - /* Default font-stacks */ - --RS__oldStyleTf: "Iowan Old Style", "Sitka Text", Palatino, "Book Antiqua", serif; - --RS__modernTf: Athelas, Constantia, Georgia, serif; - --RS__sansTf: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; - --RS__humanistTf: Seravek, Calibri, Roboto, Arial, sans-serif; - --RS__monospaceTf: "Andale Mono", Consolas, monospace; + --RS__te-baseFontFamily:'Kohinoor Telugu', 'Telugu Sangam MN', 'Nirmala UI', Gautami, Roboto, Noto, 'Noto Sans Telugu', sans-serif; - /* Config */ - --RS__baseFontFamily: var(--RS__oldStyleTf); + --RS__ta-lineHeightCompensation:1.067; - /* For square-ish fonts (CJK, Indic, etc.), we must apply some compensation in dynamic leading. Default is 1 i.e. no compensation */ - --RS__lineHeightCompensation: 1; + --RS__ta-baseFontFamily:'Tamil Sangam MN', 'Nirmala UI', Latha, Roboto, Noto, 'Noto Sans Tamil', sans-serif; - /* Dynamic leading based on typeface metrics + font-size setting */ - --RS__baseLineHeight: calc((1em + (2ex - 1ch) - ((1rem - 16px) * 0.1667)) * var(--RS__lineHeightCompensation)); -} + --RS__si-lineHeightCompensation:1.167; -/* Set default font for the html doc, so that it can be overridden by the authors’s stylesheet */ + --RS__si-baseFontFamily:'Sinhala Sangam MN', 'Nirmala UI', 'Iskoola Pota', Roboto, Noto, 'Noto Sans Sinhala', sans-serif; -html { - font-family: var(--RS__baseFontFamily); - /* Fallback line-height */ - line-height: 1.6; /* Fits a little bit better for all languages than 1.5 */ - line-height: var(--RS__baseLineHeight); - text-rendering: optimizeLegibility; -} + --RS__pa-lineHeightCompensation:1.1; -/* 1.5 being too loose with larger font-sizes, we reset headings to normal (which value is 1.125–1.375 for our font-stacks) */ + --RS__pa-baseFontFamily:'Gurmukhi MN', 'Nirmala UI', Kartika, Roboto, Noto, 'Noto Sans Gurmukhi', sans-serif; -h1, h2, h3 { - line-height: normal; -} + --RS__or-lineHeightCompensation:1.167; -:lang(ja), -:lang(zh), -:lang(ko) { - word-wrap: break-word; - -webkit-line-break: strict; - -epub-line-break: strict; - line-break: strict; -} + --RS__or-baseFontFamily:'Oriya Sangam MN', 'Nirmala UI', Kalinga, Roboto, Noto, 'Noto Sans Oriya', sans-serif; -/* Set default font for Math */ + --RS__ml-lineHeightCompensation:1.067; -math { - font-family: "Latin Modern Math", "STIX Two Math", "XITS Math", "STIX Math", "Libertinus Math", "TeX Gyre Termes Math", "TeX Gyre Bonum Math", "TeX Gyre Schola", "DejaVu Math TeX Gyre", "TeX Gyre Pagella Math", "Asana Math", "Cambria Math", "Lucida Bright Math", "Minion Math", STIXGeneral, STIXSizeOneSym, Symbol, "Times New Roman", serif; -} + --RS__ml-baseFontFamily:'Malayalam Sangam MN', 'Nirmala UI', Kartika, Roboto, Noto, 'Noto Sans Malayalam', sans-serif; -/* Language Overrides - That will only work if either html or body have a (xml:)lang attribute, not for inline overrides */ + --RS__lo-baseFontFamily:'Lao Sangam MN', 'Leelawadee UI', 'Lao UI', Roboto, Noto, 'Noto Sans Lao', sans-serif; -:lang(am) { - --RS__baseFontFamily: Kefa, Nyala, Roboto, Noto, "Noto Sans Ethiopic", serif; - --RS__lineHeightCompensation: 1.167; -} + --RS__ko-lineHeightCompensation:1.167; -:lang(ar) { - --RS__baseFontFamily: "Geeza Pro", "Arabic Typesetting", Roboto, Noto, "Noto Naskh Arabic", "Times New Roman", serif; -} + --RS__ko-baseFontFamily:'Nanum Gothic', 'Apple SD Gothic Neo', 'Malgun Gothic', Roboto, Noto, 'Noto Sans CJK KR', sans-serif; -:lang(bn) { - --RS__baseFontFamily: "Kohinoor Bangla", "Bangla Sangam MN", Vrinda, Roboto, Noto, "Noto Sans Bengali", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__kn-lineHeightCompensation:1.1; -:lang(bo) { - --RS__baseFontFamily: Kailasa, "Microsoft Himalaya", Roboto, Noto, "Noto Sans Tibetan", sans-serif; -} + --RS__kn-baseFontFamily:'Kannada Sangam MN', 'Nirmala UI', Tunga, Roboto, Noto, 'Noto Sans Kannada', sans-serif; -:lang(chr) { - --RS__baseFontFamily: "Plantagenet Cherokee", Roboto, Noto, "Noto Sans Cherokee"; - --RS__lineHeightCompensation: 1.167; -} + --RS__km-lineHeightCompensation:1.067; -:lang(fa) { - --RS__baseFontFamily: "Geeza Pro", "Arabic Typesetting", Roboto, Noto, "Noto Naskh Arabic", "Times New Roman", serif; -} + --RS__km-baseFontFamily:'Khmer Sangam MN', 'Leelawadee UI', 'Khmer UI', Roboto, Noto, 'Noto Sans Khmer', sans-serif; -:lang(gu) { - --RS__baseFontFamily: "Gujarati Sangam MN", "Nirmala UI", Shruti, Roboto, Noto, "Noto Sans Gujarati", sans-serif; - --RS__lineHeightCompensation: 1.167; -} + --RS__ja-lineHeightCompensation:1.167; -:lang(he) { - --RS__baseFontFamily: "New Peninim MT", "Arial Hebrew", Gisha, "Times New Roman", Roboto, Noto, "Noto Sans Hebrew" sans-serif; - --RS__lineHeightCompensation: 1.1; -} + --RS__ja-baseFontFamily:YuGothic, 'Hiragino Maru Gothic ProN', 'Hiragino Sans', 'Yu Gothic UI', 'Meiryo UI', 'MS Gothic', Roboto, Noto, 'Noto Sans CJK JP', sans-serif; -:lang(hi) { - --RS__baseFontFamily: "Kohinoor Devanagari", "Devanagari Sangam MN", Kokila, "Nirmala UI", Roboto, Noto, "Noto Sans Devanagari", sans-serif; + --RS__iu-baseFontFamily:'Euphemia UCAS', Euphemia, Roboto, Noto, 'Noto Sans Canadian Aboriginal', sans-serif; - --RS__lineHeightCompensation: 1.1; -} + --RS__hy-baseFontFamily:Mshtakan, Sylfaen, Roboto, Noto, 'Noto Serif Armenian', serif; -:lang(hy) { - --RS__baseFontFamily: Mshtakan, Sylfaen, Roboto, Noto, "Noto Serif Armenian", serif; -} + --RS__hi-lineHeightCompensation:1.1; -:lang(iu) { - --RS__baseFontFamily: "Euphemia UCAS", Euphemia, Roboto, Noto, "Noto Sans Canadian Aboriginal", sans-serif; -} + --RS__hi-baseFontFamily:'Kohinoor Devanagari', 'Devanagari Sangam MN', Kokila, 'Nirmala UI', Roboto, Noto, 'Noto Sans Devanagari', sans-serif; -:lang(ja) { - --RS__baseFontFamily: "游ゴシック体", YuGothic, "ヒラギノ丸ゴ", "Hiragino Sans", "Yu Gothic UI", "Meiryo UI", "MS Gothic", Roboto, Noto, "Noto Sans CJK JP", sans-serif; + --RS__he-lineHeightCompensation:1.1; - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; + --RS__he-baseFontFamily:'New Peninim MT', 'Arial Hebrew', Gisha, 'Times New Roman', Roboto, Noto, 'Noto Sans Hebrew', sans-serif; - /* Extra variables for Japanese font-stacks as we may want to reuse them for user settings + default */ - --RS__serif-ja: "ＭＳ Ｐ明朝", "MS PMincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "游明朝", "YuMincho", "ＭＳ 明朝", "MS Mincho", "Hiragino Mincho ProN", serif; - --RS__sans-serif-ja: "ＭＳ Ｐゴシック", "MS PGothic", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", "Hiragino Sans GB", "ヒラギノ角ゴシック W3", "游ゴシック", "YuGothic", "ＭＳ ゴシック", "MS Gothic", "Hiragino Sans", sans-serif; - --RS__serif-ja-v: "ＭＳ 明朝", "MS Mincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho", "Hiragino Mincho ProN", serif; - --RS__sans-serif-ja-v: "ＭＳ ゴシック", "MS Gothic", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", "Hiragino Sans GB", "ヒラギノ角ゴシック W3", "游ゴシック", "YuGothic", "ＭＳ Ｐゴシック", "MS PGothic", "Hiragino Sans", sans-serif; -} + --RS__gu-lineHeightCompensation:1.167; -:lang(km) { - --RS__baseFontFamily: "Khmer Sangam MN", "Leelawadee UI", "Khmer UI", Roboto, Noto, "Noto Sans Khmer", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__gu-baseFontFamily:'Gujarati Sangam MN', 'Nirmala UI', Shruti, Roboto, Noto, 'Noto Sans Gujarati', sans-serif; -:lang(kn) { - --RS__baseFontFamily: "Kannada Sangam MN", "Nirmala UI", Tunga, Roboto, Noto, "Noto Sans Kannada", sans-serif; - --RS__lineHeightCompensation: 1.1; -} + --RS__fa-baseFontFamily:'Geeza Pro', 'Arabic Typesetting', Roboto, Noto, 'Noto Naskh Arabic', 'Times New Roman', serif; -:lang(ko) { - --RS__baseFontFamily: "Nanum Gothic", "Apple SD Gothic Neo", "Malgun Gothic", Roboto, Noto, "Noto Sans CJK KR", sans-serif; + --RS__chr-lineHeightCompensation:1.167; - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; -} + --RS__chr-baseFontFamily:'Plantagenet Cherokee', Roboto, Noto, 'Noto Sans Cherokee'; -:lang(lo) { - --RS__baseFontFamily: "Lao Sangam MN", "Leelawadee UI", "Lao UI", Roboto, Noto, "Noto Sans Lao", sans-serif; -} + --RS__bo-baseFontFamily:Kailasa, 'Microsoft Himalaya', Roboto, Noto, 'Noto Sans Tibetan', sans-serif; -:lang(ml) { - --RS__baseFontFamily: "Malayalam Sangam MN", "Nirmala UI", Kartika, Roboto, Noto, "Noto Sans Malayalam", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__bn-lineHeightCompensation:1.067; -:lang(or) { - --RS__baseFontFamily: "Oriya Sangam MN", "Nirmala UI", Kalinga, Roboto, Noto, "Noto Sans Oriya", sans-serif; - --RS__lineHeightCompensation: 1.167; -} + --RS__bn-baseFontFamily:'Kohinoor Bangla', 'Bangla Sangam MN', Vrinda, Roboto, Noto, 'Noto Sans Bengali', sans-serif; -:lang(pa) { - --RS__baseFontFamily: "Gurmukhi MN", "Nirmala UI", Kartika, Roboto, Noto, "Noto Sans Gurmukhi", sans-serif; - --RS__lineHeightCompensation: 1.1; -} + --RS__ar-baseFontFamily:'Geeza Pro', 'Arabic Typesetting', Roboto, Noto, 'Noto Naskh Arabic', 'Times New Roman', serif; -:lang(si) { - --RS__baseFontFamily: "Sinhala Sangam MN", "Nirmala UI", "Iskoola Pota", Roboto, Noto, "Noto Sans Sinhala", sans-serif; - --RS__lineHeightCompensation: 1.167; -} + --RS__am-lineHeightCompensation:1.167; -:lang(ta) { - --RS__baseFontFamily: "Tamil Sangam MN", "Nirmala UI", Latha, Roboto, Noto, "Noto Sans Tamil", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__am-baseFontFamily:Kefa, Nyala, Roboto, Noto, 'Noto Sans Ethiopic', serif; -:lang(te) { - --RS__baseFontFamily: "Kohinoor Telugu", "Telugu Sangam MN", "Nirmala UI", Gautami, Roboto, Noto, "Noto Sans Telugu", sans-serif; -} + --RS__latin-lineHeightCompensation:1; -:lang(th) { - --RS__baseFontFamily: "Thonburi", "Leelawadee UI", "Cordia New", Roboto, Noto, "Noto Sans Thai", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__latin-baseFontFamily:var(--RS__oldStyleTf); + --RS__baseFontFamily:var(--RS__latin-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__latin-lineHeightCompensation); + --RS__baseLineHeight:calc(1.5 * var(--RS__lineHeightCompensation)); -/* The following will also work for zh-Hans */ + --RS__selectionTextColor:inherit; -:lang(zh) { - --RS__baseFontFamily: "方体", "PingFang SC", "黑体", "Heiti SC", "Microsoft JhengHei UI", "Microsoft JhengHei", Roboto, Noto, "Noto Sans CJK SC", sans-serif; + --RS__selectionBackgroundColor:#b4d8fe; - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; -} + --RS__visitedColor:#551A8B; -:lang(zh-Hant), -:lang(zh-TW) { - --RS__baseFontFamily: "方體", "PingFang TC", "黑體", "Heiti TC", "Microsoft JhengHei UI", "Microsoft JhengHei", Roboto, Noto, "Noto Sans CJK TC", sans-serif; + --RS__linkColor:#0000EE; - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; -} + --RS__textColor:#121212; -:lang(zh-HK) { - --RS__baseFontFamily: "方體", "PingFang HK", "方體", "PingFang TC", "黑體", "Heiti TC", "Microsoft JhengHei UI", "Microsoft JhengHei", Roboto, Noto, "Noto Sans CJK TC", sans-serif; + --RS__backgroundColor:#FFFFFF; + color:var(--RS__textColor) !important; - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; + background-color:var(--RS__backgroundColor) !important; } -/* Readium CSS - Day/Default mode - - A preset theme for day mode, which is the default - - Repo: https://github.com/readium/readium-css */ - -/* CONFIG */ +::-moz-selection{ + color:var(--RS__selectionTextColor); + background-color:var(--RS__selectionBackgroundColor); +} -:root { - --RS__backgroundColor: #FFFFFF; - --RS__textColor: #121212; +::selection{ + color:var(--RS__selectionTextColor); + background-color:var(--RS__selectionBackgroundColor); +} - /* This can be customized but initial will re-use default value of the browser */ - --RS__selectionBackgroundColor: #b4d8fe; - --RS__selectionTextColor: inherit; +html{ + font-family:var(--RS__baseFontFamily); + line-height:1.6; + line-height:var(--RS__baseLineHeight); + text-rendering:optimizelegibility; } -:root { - color: var(--RS__textColor) !important; - background-color: var(--RS__backgroundColor) !important; +h1, h2, h3{ + line-height:normal; } -/* Note: Though `::selection` was present in drafts of CSS Selectors Level 3, it was removed during the Candidate Recommendation phase because its behavior was under-specified (especially with nested elements) and interoperability wasn’t achieved. Source: https://developer.mozilla.org/en-US/docs/Web/CSS/::selection */ +:lang(ja), +:lang(zh), +:lang(ko){ + word-wrap:break-word; + -webkit-line-break:strict; + -epub-line-break:strict; + line-break:strict; +} -::-moz-selection { - color: var(--RS__selectionTextColor); - background-color: var(--RS__selectionBackgroundColor); +math{ + font-family:"Latin Modern Math", "STIX Two Math", "XITS Math", "STIX Math", "Libertinus Math", "TeX Gyre Termes Math", "TeX Gyre Bonum Math", "TeX Gyre Schola", "DejaVu Math TeX Gyre", "TeX Gyre Pagella Math", "Asana Math", "Cambria Math", "Lucida Bright Math", "Minion Math", STIXGeneral, STIXSizeOneSym, Symbol, "Times New Roman", serif; } -::selection { - color: var(--RS__selectionTextColor); - background-color: var(--RS__selectionBackgroundColor); +:lang(am){ + --RS__baseFontFamily:var(--RS__am-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__am-lineHeightCompensation); } -/* Readium CSS - Fonts module +:lang(ar){ + --RS__baseFontFamily:var(--RS__ar-baseFontFamily); +} - A stylesheet for embedded fonts +:lang(bn){ + --RS__baseFontFamily:var(--RS__bn-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__bn-lineHeightCompensation); +} - Repo: https://github.com/readium/readium-css */ +:lang(bo){ + --RS__baseFontFamily:var(--RS__bo-baseFontFamily); +} -/* /!\ Mind the path (relative to the folders in which you have stylesheets and the fonts) */ +:lang(chr){ + --RS__baseFontFamily:var(--RS__chr-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__chr-lineHeightCompensation); +} -@font-face { - font-family: AccessibleDfA; - font-style: normal; - font-weight: normal; - src: local("AccessibleDfA"), - url("fonts/AccessibleDfA.otf") format("opentype"); +:lang(fa){ + --RS__baseFontFamily:var(--RS__fa-baseFontFamily); } -@font-face { - font-family: "IA Writer Duospace"; - font-style: normal; - font-weight: normal; - src: local("iAWriterDuospace-Regular"), - url("fonts/iAWriterDuospace-Regular.ttf") format("truetype"); +:lang(gu){ + --RS__baseFontFamily:var(--RS__gu-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__gu-lineHeightCompensation); } -/* If you have different weights/styles, - use `font-weight` and `font-style`, - not prefixes in the font-family name, - or else it will be a nightmare to manage in user settings. */ +:lang(he){ + --RS__baseFontFamily:var(--RS__he-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__he-lineHeightCompensation); +} -/* Readium CSS - HTML5 SR Patch stylesheet +:lang(hi){ + --RS__baseFontFamily:var(--RS__hi-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__hi-lineHeightCompensation); +} - A set of style to adjust HTML5 Suggested Rendering to paginated content +:lang(hy){ + --RS__baseFontFamily:var(--RS__hy-baseFontFamily); +} - Repo: https://github.com/readium/readium-css */ +:lang(iu){ + --RS__baseFontFamily:var(--RS__iu-baseFontFamily); +} -/* Fragmentation */ +:lang(ja){ + --RS__baseFontFamily:var(--RS__ja-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__ja-lineHeightCompensation); +} -body { - widows: 2; - orphans: 2; +:lang(km){ + --RS__baseFontFamily:var(--RS__km-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__km-lineHeightCompensation); } -figcaption, th, td { - widows: 1; - orphans: 1; +:lang(kn){ + --RS__baseFontFamily:var(--RS__kn-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__kn-lineHeightCompensation); } -h2, -h3, -h4, -h5, -h6, -dt, -hr, -caption { - -webkit-column-break-after: avoid; - page-break-after: avoid; - break-after: avoid; +:lang(ko){ + --RS__baseFontFamily:var(--RS__ko-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__ko-lineHeightCompensation); } -h1, -h2, -h3, -h4, -h5, -h6, -dt, -figure, -tr { - -webkit-column-break-inside: avoid; - page-break-inside: avoid; - break-inside: avoid; +:lang(lo){ + --RS__baseFontFamily:var(--RS__lo-baseFontFamily); } -/* Hyphenation */ +:lang(ml){ + --RS__baseFontFamily:var(--RS__ml-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__ml-lineHeightCompensation); +} -body { - -webkit-hyphenate-character: "\002D"; - -moz-hyphenate-character: "\002D"; - -ms-hyphenate-character: "\002D"; - hyphenate-character: "\002D"; - -webkit-hyphenate-limit-lines: 3; - -ms-hyphenate-limit-lines: 3; - hyphenate-limit-lines: 3; +:lang(or){ + --RS__baseFontFamily:var(--RS__or-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__or-lineHeightCompensation); } -h1, -h2, -h3, -h4, -h5, -h6, -dt, -figcaption, -pre, -caption, -address, -center, -code, -var { - -ms-hyphens: none; - -moz-hyphens: none; - -webkit-hyphens: none; - -epub-hyphens: none; - hyphens: none; -} +:lang(pa){ + --RS__baseFontFamily:var(--RS__pa-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__pa-lineHeightCompensation); +} -/* OTF */ - -body { - font-variant-numeric: oldstyle-nums proportional-nums; +:lang(si){ + --RS__baseFontFamily:var(--RS__si-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__si-lineHeightCompensation); } -:lang(ja) body, -:lang(zh) body, -:lang(ko) body { - font-variant-numeric: lining-nums proportional-nums; +:lang(ta){ + --RS__baseFontFamily:var(--RS__ta-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__ta-lineHeightCompensation); } -h1, h2, h3, h4, h5, h6, dt { - font-variant-numeric: lining-nums proportional-nums; +:lang(te){ + --RS__baseFontFamily:var(--RS__te-baseFontFamily); } -table { - font-variant-numeric: lining-nums tabular-nums; +:lang(th){ + --RS__baseFontFamily:var(--RS__th-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__th-lineHeightCompensation); } -code, var { - font-variant-ligatures: none; - font-variant-numeric: lining-nums tabular-nums slashed-zero; +:lang(zh){ + --RS__baseFontFamily:var(--RS__zh-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__zh-lineHeightCompensation); } -rt { - font-variant-east-asian: ruby; +:lang(zh-Hant){ + --RS__baseFontFamily:var(--RS__zh-Hant-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__zh-Hant-lineHeightCompensation); } -:lang(ar) { - font-variant-ligatures: common-ligatures; +:lang(zh-TW){ + --RS__baseFontFamily:var(--RS__zh-TW-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__zh-TW-lineHeightCompensation); } -:lang(ko) { - font-kerning: normal; +:lang(zh-HK){ + --RS__baseFontFamily:var(--RS__zh-HK-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__zh-HK-lineHeightCompensation); } -/* Night mode */ +body{ + widows:2; + orphans:2; +} -hr { - color: inherit; - border-color: currentColor; +figcaption, th, td{ + widows:1; + orphans:1; } -table, th, td { - border-color: currentColor; +h2, h3, h4, h5, h6, dt, +hr, caption{ + -webkit-column-break-after:avoid; + page-break-after:avoid; + break-after:avoid; } -/* Horizontal Spacing */ +h1, h2, h3, h4, h5, h6, dt, +figure, tr{ + -webkit-column-break-inside:avoid; + page-break-inside:avoid; + break-inside:avoid; +} -figure, blockquote { - margin: 1em 5%; +body{ + -webkit-hyphenate-character:"\002D"; + -moz-hyphenate-character:"\002D"; + -ms-hyphenate-character:"\002D"; + hyphenate-character:"\002D"; + -webkit-hyphenate-limit-lines:3; + -ms-hyphenate-limit-lines:3; + hyphenate-limit-lines:3; } -/* +h1, h2, h3, h4, h5, h6, dt, +figcaption, pre, caption, address, +center, code, var{ + -ms-hyphens:none; + -moz-hyphens:none; + -webkit-hyphens:none; + -epub-hyphens:none; + hyphens:none; +} -:lang(ja) figure, :lang(ja) blockquote, -:lang(zh-Hant) figure, :lang(zh-Hant) blockquote, -:lang(zh-TW) figure, :lang(zh-TW) blockquote, -:lang(mn) figure, :lang(mn) blockquote { - margin: 5% 1em; +body{ + font-variant-numeric:oldstyle-nums proportional-nums; } -*/ +:lang(ja) body, +:lang(zh) body, +:lang(ko) body{ + font-variant-numeric:lining-nums proportional-nums; +} -ul, ol { - padding-left: 5%; +h1, h2, h3, h4, h5, h6, dt{ + font-variant-numeric:lining-nums proportional-nums; } -/* +table{ + font-variant-numeric:lining-nums tabular-nums; +} -:lang(ja) ul, :lang(ja) ol, -:lang(zh-Hant) ul, :lang(zh-Hant) ol, -:lang(zh-TW) ul, :lang(zh-TW) ol, -:lang(mn) ul, :lang(mn) ol { - padding-top: 5%; +code, var{ + font-variant-ligatures:none; + font-variant-numeric:lining-nums tabular-nums slashed-zero; } -*/ +rt{ + font-variant-east-asian:ruby; +} -dd { - margin-left: 5%; +:lang(ar){ + font-variant-ligatures:common-ligatures; } -/* +:lang(ko){ + font-kerning:normal; +} -:lang(ja) dd, -:lang(zh-Hant) dd, -:lang(zh-TW) dd, -:lang(mn) dd { - margin-top: 5%; +hr{ + color:inherit; + border-color:currentcolor; } -*/ +table, th, td{ + border-color:currentcolor; +} -pre { - white-space: pre-wrap; - -ms-tab-size: 2; - -moz-tab-size: 2; - -webkit-tab-size: 2; - tab-size: 2; +figure, blockquote{ + margin:1em 5%; } -/* Normalization */ +ul, ol{ + padding-left:5%; +} -abbr[title], acronym[title] { - text-decoration: dotted underline; +dd{ + margin-left:5%; } -nobr wbr { - white-space: normal; +pre{ + white-space:pre-wrap; + -ms-tab-size:2; + -moz-tab-size:2; + -webkit-tab-size:2; + tab-size:2; } -/* Make ruby text and parentheses non-selectable (TBC) */ +abbr[title], acronym[title]{ + text-decoration:dotted underline; +} -ruby > rt, ruby > rp { - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; +nobr wbr{ + white-space:normal; } -/* Internationalization */ +ruby > rt, ruby > rp{ + -webkit-user-select:none; + -moz-user-select:none; + -ms-user-select:none; + user-select:none; +} -*:lang(ja), -*:lang(zh), -*:lang(ko), -:lang(ja) cite, -:lang(ja) dfn, -:lang(ja) em, -:lang(ja) i, -:lang(zh) cite, -:lang(zh) dfn, -:lang(zh) em, -:lang(zh) i, -:lang(ko) cite, -:lang(ko) dfn, -:lang(ko) em, -:lang(ko) i { - font-style: normal; +*:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)), +*:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)), +*:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)), +:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)) cite, +:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)) dfn, +:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)) em, +:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)) i, +:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)) cite, +:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)) dfn, +:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)) em, +:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)) i, +:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)) cite, +:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)) dfn, +:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)) em, +:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)) i{ + font-style:normal; } :lang(ja) a, :lang(zh) a, -:lang(ko) a { - text-decoration: none; +:lang(ko) a{ + text-decoration:none; } -/* Readium CSS - Safeguards module - - A set of styles to prevent common issues in pagination - - Repo: https://github.com/readium/readium-css */ - -/* Config */ - -/* We’ll be using an "RS__" prefix so that we can prevent collisions with authors’ CSS */ - -:root { - /* max-width for media, you can override that via JS if not compiled to static */ - --RS__maxMediaWidth: 100%; - - /* max-height for media, you can override that via JS if not compiled to static - Please consider figures might have a figcaption, which is why 95vh in the first place */ - --RS__maxMediaHeight: 95vh; - - /* value for medias’ box-sizing */ - --RS__boxSizingMedia: border-box; - - /* value for table’s box-sizing */ - --RS__boxSizingTable: border-box; +:root{ + --RS__maxMediaWidth:100%; + --RS__maxMediaHeight:95vh; + --RS__boxSizingMedia:border-box; + --RS__boxSizingTable:border-box; } -/* Sanitize line-heights in webkit e.g. raised cap without a declared line-height - See effect by checking this demo in Safari: https://codepen.io/JayPanoz/pen/gRmzrE - Note: glyphs has to be reset to inline for CJK */ - -html { - -webkit-line-box-contain: block glyphs replaced; +a, a span, span a, h1, h2, h3, h4, h5, h6{ + word-wrap:break-word; } -:lang(ja) { - -webkit-line-box-contain: block inline replaced; +div{ + max-width:var(--RS__maxMediaWidth); } -/* Wrap long strings if larger than line-length */ - -a, h1, h2, h3, h4, h5, h6 { - word-wrap: break-word; -} +img, svg|svg, video{ + object-fit:contain; -div { - max-width: var(--RS__maxMediaWidth); + width:auto; + height:auto; + max-width:var(--RS__maxMediaWidth); + max-height:var(--RS__maxMediaHeight) !important; + box-sizing:var(--RS__boxSizingMedia); + -webkit-column-break-inside:avoid; + page-break-inside:avoid; + break-inside:avoid; } -/* Size medias */ - -/* You can override CSS variables by re-defining it for all elements or a specific one */ - -img, svg, audio, video { +@supports (zoom: 1) and (not ((-webkit-column-axis: horizontal) and (-webkit-column-progression: normal))){ - /* Object-fit allows us to keep the correct aspect-ratio */ - object-fit: contain; - - width: auto; - height: auto; - - /* Some files don’t have max-width */ - max-width: var(--RS__maxMediaWidth); - - /* We’re setting a max-height, especially for covers */ - max-height: var(--RS__maxMediaHeight) !important; - /* We probably don’t need to use modern box-sizing as auto behaves like it */ - box-sizing: var(--RS__boxSizingMedia); - - /* For page-break, we must use those 3 - We can’t use a variable there, webkit seems to no support them for those properties */ - -webkit-column-break-inside: avoid; - page-break-inside: avoid; - break-inside: avoid; + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] img, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] svg|svg, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] video{ + zoom:calc(100% / var(--USER__fontSize)); + } } -/* Try preventing border being cut-off, webkit + blink have content-box by default */ +audio{ + max-width:100%; + -webkit-column-break-inside:avoid; + page-break-inside:avoid; + break-inside:avoid; + } -table { - max-width: var(--RS__maxMediaWidth); - box-sizing: var(--RS__boxSizingTable); -} -/*# sourceMappingURL=ReadiumCSS-before.css.map */ \ No newline at end of file +table{ + max-width:var(--RS__maxMediaWidth); + box-sizing:var(--RS__boxSizingTable); +} \ No newline at end of file diff --git a/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadiumCSS-default.css b/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadiumCSS-default.css index 78aa0172b6..b541add35e 100644 --- a/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadiumCSS-default.css +++ b/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadiumCSS-default.css @@ -1,189 +1,159 @@ -/* Readium CSS - Namespaces module - - Namespaces to import in all 3 dist stylesheets - - Repo: https://github.com/readium/readium-css */ +/*! + * Readium CSS v.2.0.5 + * Copyright (c) 2017–2026. 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 + */ @namespace url("http://www.w3.org/1999/xhtml"); @namespace epub url("http://www.idpf.org/2007/ops"); -@namespace m url("http://www.w3.org/1998/Math/MathML/"); +@namespace m url("http://www.w3.org/1998/Math/MathML"); @namespace svg url("http://www.w3.org/2000/svg"); -/* Readium CSS - Default module - - A stylesheet for unstyled ebooks based on HTML5 Suggested Rendering - Note: works in combination with Base module - - Repo: https://github.com/readium/readium-css */ +:root{ + --RS__compFontFamily:var(--RS__baseFontFamily); + --RS__codeFontFamily:var(--RS__monospaceTf); -/* CONFIG */ + --RS__typeScale:1.125; + --RS__baseFontSize:100%; -:root { - --RS__compFontFamily: var(--RS__baseFontFamily); - --RS__codeFontFamily: var(--RS__monospaceTf); + --RS__flowSpacing:1.5rem; + --RS__paraSpacing:0; + --RS__paraIndent:1em; - --RS__typeScale: 1.125; /* 1.067 | 1.125 | 1.2 | 1.25 | 1.333 | 1.414 | 1.5 | 1.618 */ - --RS__baseFontSize: 100%; + --RS__linkColor:#0000EE; + --RS__visitedColor:#551A8B; - --RS__flowSpacing: 1.5rem; - --RS__paraSpacing: 0; - --RS__paraIndent: 1em; - - --RS__linkColor: #0000EE; - --RS__visitedColor: #551A8B; - - --RS__primaryColor: ; - --RS__secondaryColor: ; + --RS__primaryColor:; + --RS__secondaryColor:; } -/* STYLES */ - -/* Typo */ - -body { - font-size: var(--RS__baseFontSize); +body{ + font-size:var(--RS__baseFontSize); } -h1, h2, h3, h4, h5, h6 { - font-family: var(--RS__compFontFamily); +h1, h2, h3, h4, h5, h6{ + font-family:var(--RS__compFontFamily); } -/* Flow content */ - -blockquote, -figure, -p, -pre, -aside, -footer, -form, -hr { - margin-top: var(--RS__flowSpacing); - margin-bottom: var(--RS__flowSpacing); +blockquote, figure, p, pre, +aside, footer, form, hr{ + margin-top:var(--RS__flowSpacing); + margin-bottom:var(--RS__flowSpacing); } -p { - margin-top: var(--RS__paraSpacing); - margin-bottom: var(--RS__paraSpacing); - text-indent: var(--RS__paraIndent); +p{ + margin-top:var(--RS__paraSpacing); + margin-bottom:var(--RS__paraSpacing); + text-indent:var(--RS__paraIndent); } -h1 + p, -h2 + p, -h3 + p, -h4 + p, -h5 + p, -h6 + p, -hr + p { - text-indent: 0; +h1 + p, h2 + p, h3 + p, h4 + p, h5 + p, h6 + p, +hr + p{ + text-indent:0; } -pre { - font-family: var(--RS__codeFontFamily); +pre{ + font-family:var(--RS__codeFontFamily); } -/* Phrasing content */ - -code, kbd, samp, tt { - font-family: var(--RS__codeFontFamily); +code, kbd, samp, tt{ + font-family:var(--RS__codeFontFamily); } -sub, sup { - position: relative; - font-size: 67.5%; - line-height: 1; +sub, sup{ + position:relative; + font-size:67.5%; + line-height:1; } -sub { - bottom: -0.2ex; +sub{ + bottom:-0.2ex; } -sup { - bottom: 0; +sup{ + bottom:0; } -:link { - color: var(--RS__linkColor); +:link{ + color:var(--RS__linkColor); } -:visited { - color: var(--RS__visitedColor); +:visited{ + color:var(--RS__visitedColor); } -/* Headings */ - -h1 { - margin-top: calc(var(--RS__flowSpacing) * 2); - margin-bottom: calc(var(--RS__flowSpacing) * 2); - /* The following is base font size * typescale power of 3 */ - font-size: calc(((1em * var(--RS__typeScale)) * var(--RS__typeScale)) * var(--RS__typeScale)); +h1{ + margin-top:calc(var(--RS__flowSpacing) * 2); + margin-bottom:calc(var(--RS__flowSpacing) * 2); + font-size:calc(((1em * var(--RS__typeScale)) * var(--RS__typeScale)) * var(--RS__typeScale)); } -h2 { - margin-top: calc(var(--RS__flowSpacing) * 2); - margin-bottom: var(--RS__flowSpacing); - /* The following is base font size * typescale power of 2 */ - font-size: calc((1em * var(--RS__typeScale)) * var(--RS__typeScale)); +h2{ + margin-top:calc(var(--RS__flowSpacing) * 2); + margin-bottom:var(--RS__flowSpacing); + font-size:calc((1em * var(--RS__typeScale)) * var(--RS__typeScale)); } -h3 { - margin-top: var(--RS__flowSpacing); - margin-bottom: var(--RS__flowSpacing); - font-size: calc(1em * var(--RS__typeScale)); +h3{ + margin-top:var(--RS__flowSpacing); + margin-bottom:var(--RS__flowSpacing); + font-size:calc(1em * var(--RS__typeScale)); } -h4 { - margin-top: var(--RS__flowSpacing); - margin-bottom: var(--RS__flowSpacing); - font-size: 1em; +h4{ + margin-top:var(--RS__flowSpacing); + margin-bottom:var(--RS__flowSpacing); + font-size:1em; } -h5 { - margin-top: var(--RS__flowSpacing); - margin-bottom: var(--RS__flowSpacing); - font-size: 1em; - font-variant: small-caps; +h5{ + margin-top:var(--RS__flowSpacing); + margin-bottom:var(--RS__flowSpacing); + font-size:1em; + font-variant:small-caps; } -h6 { - margin-top: var(--RS__flowSpacing); - margin-bottom: 0; - font-size: 1em; - text-transform: lowercase; - font-variant: small-caps; +h6{ + margin-top:var(--RS__flowSpacing); + margin-bottom:0; + font-size:1em; + text-transform:lowercase; + font-variant:small-caps; } -/* Lists */ - -dl, ol, ul { - margin-top: var(--RS__flowSpacing); - margin-bottom: var(--RS__flowSpacing); +dl, ol, ul{ + margin-top:var(--RS__flowSpacing); + margin-bottom:var(--RS__flowSpacing); } -/* Table */ - -table { - margin: var(--RS__flowSpacing) 0; - border: 1px solid currentColor; - border-collapse: collapse; - empty-cells: show; +table{ + margin:var(--RS__flowSpacing) 0; + border:1px solid currentcolor; + border-collapse:collapse; + empty-cells:show; } -thead, tbody, tfoot, table > tr { - vertical-align: top; +thead, tbody, tfoot, table > tr{ + vertical-align:top; } -th { - text-align: left; +th{ + text-align:left; } -th, td { - padding: 4px; - border: 1px solid currentColor; -} -/*# sourceMappingURL=ReadiumCSS-default.css.map */ \ No newline at end of file +th, td{ + padding:4px; + border:1px solid currentcolor; +} \ No newline at end of file diff --git a/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadiumCSS-ebpaj_fonts_patch.css b/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadiumCSS-ebpaj_fonts_patch.css index b73eb6744f..16da6be425 100644 --- a/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadiumCSS-ebpaj_fonts_patch.css +++ b/Sources/Navigator/EPUB/Assets/Static/readium-css/ReadiumCSS-ebpaj_fonts_patch.css @@ -1,80 +1,79 @@ -/* Readium CSS +/* Readium CSS EBPAJ Fonts Patch module A stylesheet improving EBPAJ @font-face declarations to cover all platforms - Repo: https://github.com/readium/readium-css */ + Repo: https://github.com/readium/css */ /* EBPAJ template only references fonts from MS Windows… - so we must reference fonts from other platforms + so we must reference fonts from other platforms and override authors’ stylesheets. What we do there is keeping their default value and providing fallbacks. - + /!\ /!\ /!\ /!\ /!\ FYI, you might want to load this polyfill only if you find one of the following metadata items in the OPF package: - - version 1: + - version 1: ebpaj-guide-1.0 - - version 1.1: - 1.1 - */ + - version 1.1: + 1.1 +*/ + +/* + Hiragino PostScript Font name lists: + https://www.screen.co.jp/ga_product/sento/support/QA/ss_psname.html +*/ /* 横組み用 (horizontal writing) */ @font-face { font-family: "serif-ja"; - src: local("ＭＳ Ｐ明朝"), - local("MS PMincho"), - local("Hiragino Mincho Pro"), - local("ヒラギノ明朝 Pro W3"), - local("游明朝"), - local("YuMincho"), - local("ＭＳ 明朝"), - local("MS Mincho"), - local("Hiragino Mincho ProN"); + src: local("ＭＳ Ｐ明朝"), /* for IE */ + local("MS PMincho"), /* ＭＳ Ｐ明朝 */ + local("HiraMinProN-W3"), local("Hiragino Mincho ProN"), /* ヒラギノ明朝 ProN W3 */ + local("HiraMinPro-W3"), local("Hiragino Mincho Pro"), /* ヒラギノ明朝 Pro W3 */ + local("YuMin-Medium"), local("YuMincho"), /* 游明朝体(macOS) */ + local("Yu Mincho"), /* 游明朝(Windows) */ + local("BIZ UDPMincho"); /* BIZ UDP明朝 */ } @font-face { font-family: "sans-serif-ja"; - src: local("ＭＳ Ｐゴシック"), - local("MS PGothic"), - local("Hiragino Kaku Gothic Pro W3"), - local("ヒラギノ角ゴ Pro W3"), - local("Hiragino Sans GB"), - local("ヒラギノ角ゴシック W3"), - local("游ゴシック"), - local("YuGothic"), - local("ＭＳ ゴシック"), - local("MS Gothic"), - local("Hiragino Sans"); + src: local("ＭＳ Ｐゴシック"), /* for IE */ + local("MS PGothic"), /* ＭＳ Ｐゴシック */ + local("HiraginoSans-W3"), local("Hiragino Sans"), /* ヒラギノ角ゴシック */ + local("HiraKakuProN-W3"), local("Hiragino Kaku Gothic ProN"), /* ヒラギノ角ゴ ProN W3 */ + local("HiraKakuPro-W3"), local("Hiragino Kaku Gothic Pro"), /* ヒラギノ角ゴ Pro W3 */ + local("ヒラギノ角ゴ W3"), /* for old Safari */ + local("HiraginoKaku-W3-90msp-RKSJ-H"), /* ヒラギノ角ゴ W3(TrueType) */ + local("YuGothic-Medium"), local("YuGothic"), /* 游ゴシック体(macOS) */ + local("Yu Gothic Medium"), local("Yu Gothic"), /* 游ゴシック(Windows) "Yu Gothic" is a fallback. */ + local("BIZ UDPGothic"); /* BIZ UDPゴシック */ } /* 縦組み用 (vertical writing) */ @font-face { font-family: "serif-ja-v"; - src: local("ＭＳ 明朝"), - local("MS Mincho"), - local("Hiragino Mincho Pro"), - local("ヒラギノ明朝 Pro W3"), - local("游明朝"), - local("YuMincho"), - local("ＭＳ Ｐ明朝"), - local("MS PMincho"), - local("Hiragino Mincho ProN"); + src: local("ＭＳ 明朝"), /* for IE */ + local("MS Mincho"), /* ＭＳ 明朝 */ + local("HiraMinProN-W3"), local("Hiragino Mincho ProN"), /* ヒラギノ明朝 ProN W3 */ + local("HiraMinPro-W3"), local("Hiragino Mincho Pro"), /* ヒラギノ明朝 Pro W3 */ + local("YuMin-Medium"), local("YuMincho"), /* 游明朝体(macOS) */ + local("Yu Mincho"), /* 游明朝(Windows) */ + local("BIZ UDMincho"); /* BIZ UD明朝 */ } @font-face { font-family: "sans-serif-ja-v"; - src: local("ＭＳ ゴシック"), - local("MS Gothic"), - local("Hiragino Kaku Gothic Pro W3"), - local("ヒラギノ角ゴ Pro W3"), - local("Hiragino Sans GB"), - local("ヒラギノ角ゴシック W3"), - local("游ゴシック"), - local("YuGothic"), - local("ＭＳ Ｐゴシック"), - local("MS PGothic"), - local("Hiragino Sans"); + src: local("ＭＳ ゴシック"), /* for IE */ + local("MS Gothic"), /* ＭＳ ゴシック */ + local("HiraginoSans-W3"), local("Hiragino Sans"), /* ヒラギノ角ゴシック */ + local("HiraKakuProN-W3"), local("Hiragino Kaku Gothic ProN"), /* ヒラギノ角ゴ ProN W3 */ + local("HiraKakuPro-W3"), local("Hiragino Kaku Gothic Pro"), /* ヒラギノ角ゴ Pro W3 */ + local("ヒラギノ角ゴ W3"), /* for old Safari */ + local("HiraKakuDS-W3-83pv-RKSJ-H"), /* ヒラギノ角ゴ W3(TrueType) */ + local("YuGothic-Medium"), local("YuGothic"), /* 游ゴシック体(macOS) */ + local("Yu Gothic Medium"), local("Yu Gothic"), /* 游ゴシック(Windows) "Yu Gothic" is a fallback. */ + local("BIZ UDGothic"); /* BIZ UDゴシック */ } \ No newline at end of file diff --git a/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-horizontal/ReadiumCSS-after.css b/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-horizontal/ReadiumCSS-after.css index 47867bfd54..ec07373a80 100644 --- a/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-horizontal/ReadiumCSS-after.css +++ b/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-horizontal/ReadiumCSS-after.css @@ -1,705 +1,487 @@ -/* Readium CSS - Config module - - A file allowing implementers to customize flags for reading modes, - user settings, etc. - - Repo: https://github.com/readium/readium-css */ - -/* Custom medias - Syntax: @custom-media --variable (prop: value) */ - -/* Responsive columns - The minimum width for which responsive columns (2 -> 1 and vice versa, - depending on the current font-size) must be enabled */ - -/* Mobile columns - The minimum and maximum width for mobile devices. - We’re forcing the landscape orientation by default, - and must still investigate large tablets (iPad Pro, Surface Pro 3, etc.). */ - -/* Custom selectors - Syntax: @custom-selector :--variable selector - The selectors you will use for flags/switches - You can alternatively use classes or custom data-* attributes */ - -/* User view = paged | scrolled */ - -/* Font-family override */ - -/* Advanced settings */ - -/* Reading Modes */ - -/* Filters (images) */ - -/* Accessibility normalization */ - -/* Accessibility font. You can add selectors, using “, ” as a separator, if you have multiple fonts */ - -/* Direction i.e. ltr and rtl */ - -/* Readium CSS - Namespaces module - - Namespaces to import in all 3 dist stylesheets - - Repo: https://github.com/readium/readium-css */ +/*! + * Readium CSS v.2.0.5 + * Copyright (c) 2017–2026. 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 + */ @namespace url("http://www.w3.org/1999/xhtml"); @namespace epub url("http://www.idpf.org/2007/ops"); -@namespace m url("http://www.w3.org/1998/Math/MathML/"); +@namespace m url("http://www.w3.org/1998/Math/MathML"); @namespace svg url("http://www.w3.org/2000/svg"); -/* Readium CSS - Pagination module - - A set of styles to paginate ePublications - - Repo: https://github.com/readium/readium-css */ +:root{ -/* Config */ + --RS__viewportWidth:100%; -/* Columns are responsive by default, even if column-width is set in pixels, - which means two-page spread will switch to single page depending on current font-size. - If you want more control, I’m afraid you’ll have to update colWidth/colGap dynamically, - which is how a significant amount of RS do at the moment. */ + --RS__pageGutter:0; -/* Default for smartphone portrait (small screens) */ + --RS__defaultLineLength:100%; -:root { - /* Your columns’ width floor */ - --RS__colWidth: 45em; /* The width at which we’ll switch to 2 columns by default. PS: you can’t set it in rem */ + --RS__colGap:0; - /* Ideal number of columns (depending on columns’ width floor) */ - --RS__colCount: 1; + --RS__colCount:1; - /* Gap between columns (in pixels so that it won’t resize with font-size) */ - --RS__colGap: 0; - - /* Optimal line-length (rem will take :root font-size into account, whatever the body’s font-size) */ - --RS__maxLineLength: 40rem; - - /* Default page horizontal margins (in pixels so that it won’t resize with font-size) */ - --RS__pageGutter: 20px; /* See if colGap and pageGutter can be the same var */ + --RS__colWidth:100vw; } -/* Reset page margins for Forward compatibility */ - -@page { - margin: 0 !important; +@page{ + margin:0 !important; } -/* :root selector has same specificity as a class i.e. 0010 - We might have to change that to html / context - -> https://css-tricks.com/almanac/selectors/r/root/ */ - -:root { - - /* In case you use left position to scroll, can be removed if using transform: translateX() */ - position: relative; - - -webkit-column-width: var(--RS__colWidth); - -moz-column-width: var(--RS__colWidth); - column-width: var(--RS__colWidth); - - /* Init pagination */ - /* TODO: document columns’ logic cos it might feel weird at first */ - -webkit-column-count: var(--RS__colCount); - -moz-column-count: var(--RS__colCount); - column-count: var(--RS__colCount); - - -webkit-column-gap: var(--RS__colGap); - -moz-column-gap: var(--RS__colGap); - column-gap: var(--RS__colGap); - - /* Default is balance and we want columns to be filled entirely (100vh) */ - -moz-column-fill: auto; - column-fill: auto; - width: 100%; - height: 100vh; - max-width: 100%; - max-height: 100vh; - min-width: 100%; - min-height: 100vh; - padding: 0 !important; - margin: 0 !important; - - /* Column size will depend on this if we want to make it responsive */ - font-size: 100% !important; - - -webkit-text-size-adjust: 100%; +:root{ + position:relative; - /* Switch to newer box model (not inherited by authors’ styles) */ - box-sizing: border-box; + -webkit-column-width:var(--RS__colWidth); + -moz-column-width:var(--RS__colWidth); + column-width:var(--RS__colWidth); + -webkit-column-count:var(--RS__colCount); + -moz-column-count:var(--RS__colCount); + column-count:var(--RS__colCount); - /* Fix bug for older Chrome */ - -webkit-perspective: 1; - /* Prevents options pop-up when long tap in webkit */ - -webkit-touch-callout: none; + -webkit-column-gap:var(--RS__colGap); + -moz-column-gap:var(--RS__colGap); + column-gap:var(--RS__colGap); + -moz-column-fill:auto; + column-fill:auto; + width:var(--RS__viewportWidth); + height:100vh; + max-width:var(--RS__viewportWidth); + max-height:100vh; + min-width:var(--RS__viewportWidth); + min-height:100vh; + padding:0 !important; + margin:0 !important; + font-size:1rem !important; + box-sizing:border-box; + -webkit-touch-callout:none; } -body { - /* overflow: hidden; bugfix: contents won’t paginate in Firefox and one sample in Safari */ - width: 100%; +body{ + width:100%; + max-width:var(--RS__defaultLineLength) !important; + margin:0 auto !important; + box-sizing:border-box; +} - /* Limit line-length but we have to reset when 2 columns and control the viewport. - By using max-width + margin auto, margins will shrink when font-size increases, - which is what would be expected in terms of typography. */ - max-width: var(--RS__maxLineLength) !important; - padding: 0 var(--RS__pageGutter) !important; - margin: 0 auto !important; +:root:not([style*="readium-scroll-on"]) body{ + padding:0 var(--RS__pageGutter) !important; +} - /* We need a minimum padding on body so that descandants/ascendants in italic/script are not cut-off. - Drawback: we have to use border-box so that it doesn’t screw the box model, - which means it impacts colWidth and max-width */ - box-sizing: border-box; +:root:not([style*="readium-noOverflow-on"]) body{ + overflow:hidden; } -/* We’ll now redefine margins and columns depending on the minimum width available - The goal is having the simplest model possible and avoid targeting devices */ +@supports (overflow: clip){ -/* Smartphone landscape */ + :root:not([style*="readium-noOverflow-on"]){ + overflow:clip; + } -@media screen and (min-width: 35em) { - :root { - --RS__pageGutter: 30px; - } + :root:not([style*="readium-noOverflow-on"]) body{ + overflow:clip; + overflow-clip-margin:content-box; + } } -/* Tablet portrait */ - -@media screen and (min-width: 45em) { - :root { - --RS__pageGutter: 40px; - } +:root[style*="readium-scroll-on"]{ + -webkit-columns:auto auto !important; + -moz-columns:auto auto !important; + columns:auto auto !important; + width:auto !important; + height:auto !important; + max-width:none !important; + max-height:none !important; + min-width:0 !important; + min-height:0 !important; } -/* Desktop + tablet large */ - -/* We get the previous settings, we just change the margins */ +:root[style*="readium-scroll-on"] body{ + max-width:var(--RS__defaultLineLength) !important; + box-sizing:border-box !important; +} -@media screen and (min-width: 75em) { - :root { - --RS__pageGutter: 50px; - } +:root[style*="readium-scroll-on"]:not([style*="readium-noOverflow-on"]) body{ + overflow:auto; } -/* At this point (80em or so), constraining line length must be done at the web view/iframe level, or by limiting the size of :root itself */ +@supports (overflow: clip){ -/* Responsive columns */ + :root[style*="readium-scroll-on"]:not([style*="readium-noOverflow-on"]){ + overflow:auto; + } -@media screen and (min-width: 60em), screen and (min-device-width: 36em) and (max-device-width: 47em) and (orientation: landscape) { - :root { - /* The size at which we want 2 columns to switch to 1 (depending on font-size) */ - --RS__colWidth: 20em; /* 20 * 16 = 320px but 20 * 28 = 560px so it will switch to 1 col @ 175% font-size (user-setting) on an iPad */ - /* We constrain to 2 columns so that we can never get 3 or 4, etc. */ - --RS__colCount: 2; - --RS__maxLineLength: 39.99rem; /* If we don’t use this, colNumber user setting won’t work in Safari… */ + :root[style*="readium-scroll-on"]:not([style*="readium-noOverflow-on"]) body{ + overflow:clip; } } -/* Readium CSS - Scroll module - - A set of styles to scroll ePublications - This module overrides pagination - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-scroll-on"] { - - /* Reset columns, auto + auto = columns can’t be created */ - -webkit-columns: auto auto !important; - -moz-columns: auto auto !important; - columns: auto auto !important; - width: auto !important; - height: auto !important; - max-width: none !important; - max-height: none !important; - /* Reset html size so that the user can scroll */ - min-width: 0 !important; - min-height: 0 !important; +:root[style*="readium-scroll-on"][style*="--RS__scrollPaddingTop"] body{ + padding-top:var(--RS__scrollPaddingTop) !important; } -/* Make sure line-length is limited in all configs */ - -:root[style*="readium-scroll-on"] body { - --RS__maxLineLength: 40rem !important; +:root[style*="readium-scroll-on"][style*="--RS__scrollPaddingBottom"] body{ + padding-bottom:var(--RS__scrollPaddingBottom) !important; } -/* Readium CSS - Night mode - - A preset theme for night mode - - Repo: https://github.com/readium/readium-css */ - -/* CONFIG */ - -/* [style*="--USER__appearance"] can be used to increase specificity but performance hit */ - -:root[style*="readium-night-on"] { - --RS__backgroundColor: #000000; - --RS__textColor: #FEFEFE; - - --RS__linkColor: #63caff; - --RS__visitedColor: #0099E5; - - /* This can be customized but initial will re-use default value of the browser */ - --RS__selectionBackgroundColor: #b4d8fe; - --RS__selectionTextColor: inherit; +:root[style*="readium-scroll-on"][style*="--RS__scrollPaddingLeft"] body{ + padding-left:var(--RS__scrollPaddingLeft) !important; } -/* we don’t need to redeclare bg-color and color for :root since we will inherit and update from day/default mode */ - -:root[style*="readium-night-on"] *:not(a) { - color: inherit !important; - background-color: transparent !important; - border-color: currentColor !important; +:root[style*="readium-scroll-on"][style*="--RS__scrollPaddingRight"] body{ + padding-right:var(--RS__scrollPaddingRight) !important; } -:root[style*="readium-night-on"] svg text { - fill: currentColor !important; - stroke: none !important; +:root[style*="--USER__backgroundColor"]{ + background-color:var(--USER__backgroundColor) !important; } -:root[style*="readium-night-on"] a:link, -:root[style*="readium-night-on"] a:link * { - color: var(--RS__linkColor) !important; +:root[style*="--USER__backgroundColor"] *{ + background-color:transparent !important; } -:root[style*="readium-night-on"] a:visited, -:root[style*="readium-night-on"] a:visited * { - color: var(--RS__visitedColor) !important; +:root[style*="--USER__textColor"]{ + color:var(--USER__textColor) !important; } -/* For epub:type, in case the contents are served as text/html, namespaces won’t work hence why we’re using both syntax */ - -:root[style*="readium-night-on"] img[class*="gaiji"], -:root[style*="readium-night-on"] *[epub\:type~="titlepage"] img:only-child, -:root[style*="readium-night-on"] *[epub|type~="titlepage"] img:only-child { - -webkit-filter: invert(100%); - filter: invert(100%); +:root[style*="--USER__textColor"] *:not(a){ + color:inherit !important; + background-color:transparent !important; + border-color:currentcolor !important; } -/* Darken all images on user’s demand */ - -:root[style*="readium-night-on"][style*="readium-darken-on"] img { - -webkit-filter: brightness(80%); - filter: brightness(80%); +:root[style*="--USER__textColor"] svg text{ + fill:currentcolor !important; + stroke:none !important; } -/* Invert all images on user’s demand */ - -:root[style*="readium-night-on"][style*="readium-invert-on"] img { - -webkit-filter: invert(100%); - filter: invert(100%); +:root[style*="--USER__linkColor"] a:link, +:root[style*="--USER__linkColor"] a:link *{ + color:var(--USER__linkColor) !important; } -/* Darken and invert on user’s demand */ - -:root[style*="readium-night-on"][style*="readium-darken-on"][style*="readium-invert-on"] img { - -webkit-filter: brightness(80%) invert(100%); - filter: brightness(80%) invert(100%); +:root[style*="--USER__visitedColor"] a:visited, +:root[style*="--USER__visitedColor"] a:visited *{ + color:var(--USER__visitedColor) !important; } -/* Readium CSS - Sepia mode - - A preset theme for sepia mode - - Repo: https://github.com/readium/readium-css */ +:root[style*="--USER__selectionBackgroundColor"][style*="--USER__selectionTextColor"] ::-moz-selection{ + color:var(--USER__selectionTextColor) !important; + background-color:var(--USER__selectionBackgroundColor) !important; +} -/* CONFIG */ +:root[style*="--USER__selectionBackgroundColor"][style*="--USER__selectionTextColor"] ::selection{ + color:var(--USER__selectionTextColor) !important; + background-color:var(--USER__selectionBackgroundColor) !important; +} -:root[style*="readium-sepia-on"] { - --RS__backgroundColor: #faf4e8; - --RS__textColor: #121212; +:root[style*="--USER__colCount"]{ + -webkit-column-count:var(--USER__colCount); + -moz-column-count:var(--USER__colCount); + column-count:var(--USER__colCount); - --RS__linkColor: #0000EE; - --RS__visitedColor: #551A8B; + --RS__colWidth:auto; +} - /* This can be customized but initial will re-use default value of the browser */ - --RS__selectionBackgroundColor: #b4d8fe; - --RS__selectionTextColor: inherit; +:root[style*="--USER__colCount: 0"], +:root[style*="--USER__colCount:0"]{ + -webkit-column-count:1; + -moz-column-count:1; + column-count:1; +} - --RS__maxLineLength: 40.01rem; /* Forcing a reflow in Blink/Webkit so that blend mode can work */ +:root[style*="--USER__colCount: 0"], +:root[style*="--USER__colCount:0"], +:root[style*="--USER__colCount: 1"], +:root[style*="--USER__colCount:1"]{ + --RS__colWidth:100vw; } -/* we don’t need to redeclare bg-color and color for :root since we will inherit and update from day/default mode */ +:root[style*="--USER__lineLength"] body{ + max-width:var(--USER__lineLength) !important; + } -:root[style*="readium-sepia-on"] *:not(a) { - color: inherit !important; - background-color: transparent !important; +:root[style*="--USER__fontFamily"]{ + font-family:var(--USER__fontFamily) !important; } -:root[style*="readium-sepia-on"] a:link, -:root[style*="readium-sepia-on"] a:link * { - color: var(--RS__linkColor); +:root[style*="--USER__fontFamily"] *{ + font-family:revert !important; } -:root[style*="readium-sepia-on"] a:visited, -:root[style*="readium-sepia-on"] a:visited * { - color: var(--RS__visitedColor); +:root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] body{ + zoom:var(--USER__fontSize) !important; } -:root[style*="readium-sepia-on"] svg, -:root[style*="readium-sepia-on"] img { - /* Make sure the proper bg-color is used for the blend mode */ - background-color: transparent !important; - mix-blend-mode: multiply; +:root:not([style*="readium-deprecatedFontSize-on"])[style*="readium-iOSPatch-on"][style*="--USER__fontSize"] body{ + -webkit-text-size-adjust:var(--USER__fontSize) !important; } -/* Readium CSS - OS Accessibility Modes - - A stylesheet to deal with OS accessibility settings - - Repo: https://github.com/readium/readium-css */ - -/* Windows high contrast colors are mapped to CSS system color keywords - See http://www.gwhitworth.com/blog/2017/04/how-to-use-ms-high-contrast */ - -@media screen and (-ms-high-contrast: active) { - :root { - color: windowText !important; - background-color: window !important; - } +@supports selector(figure:has(> img)){ - /* The following selectors are super funky but it makes sure everything is inherited, this is indeed critical for this mode */ - :root :not(#\#):not(#\#):not(#\#), - :root :not(#\#):not(#\#):not(#\#) :not(#\#):not(#\#):not(#\#) - :root :not(#\#):not(#\#):not(#\#) :not(#\#):not(#\#):not(#\#) :not(#\#):not(#\#):not(#\#) { - color: inherit !important; - background-color: inherit !important; + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> img), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> video), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> svg), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> canvas), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> iframe), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> audio), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> img:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> video:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> svg:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> canvas:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> iframe:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> audio:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] table{ + zoom:calc(100% / var(--USER__fontSize)) !important; } - .readiumCSS-mo-active-default { - color: highlightText !important; - background-color: highlight !important; - } - - /* For links, hyperlink keyword is automatically set */ - - /* Should we also set user highlights? */ -} - -@media screen and (-ms-high-contrast: white-on-black) { - :root[style*="readium-night-on"] img[class*="gaiji"], - :root[style*="readium-night-on"] *[epub\:type~="titlepage"] img:only-child, - :root[style*="readium-night-on"] *[epub|type~="titlepage"] img:only-child { - -webkit-filter: none !important; - filter: none !important; - } - :root[style*="readium-night-on"][style*="readium-invert-on"] img { - -webkit-filter: none !important; - filter: none !important; - } - :root[style*="readium-night-on"][style*="readium-darken-on"][style*="readium-invert-on"] img { - -webkit-filter: brightness(80%); - filter: brightness(80%); + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figcaption, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] caption, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] td, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] th{ + zoom:var(--USER__fontSize) !important; } } -/* Will be true on recent versions of iOS and MacOS if inverted setting enabled by the user */ +@supports not (zoom: 1){ -@media screen and (inverted-colors) { - :root[style*="readium-night-on"] img[class*="gaiji"], - :root[style*="readium-night-on"] *[epub\:type~="titlepage"] img:only-child, - :root[style*="readium-night-on"] *[epub|type~="titlepage"] img:only-child { - -webkit-filter: none !important; - filter: none !important; - } - :root[style*="readium-night-on"][style*="readium-invert-on"] img { - -webkit-filter: none !important; - filter: none !important; - } - :root[style*="readium-night-on"][style*="readium-darken-on"][style*="readium-invert-on"] img { - -webkit-filter: brightness(80%); - filter: brightness(80%); + :root[style*="--USER__fontSize"]{ + font-size:var(--USER__fontSize) !important; } } -@media screen and (monochrome) { - /* Grayscale (Implemented in Safari, what about eInk?) */ - /* Must deal with anything color (contrast) so must be managed at the night/sepia/theme level :( */ +:root[style*="readium-deprecatedFontSize-on"][style*="--USER__fontSize"]{ + font-size:var(--USER__fontSize) !important; } -@media screen and (prefers-reduced-motion) { - /* If reduced motion is set on MacOS, in case we have animation/transition */ +:root[style*="--USER__lineHeight"]{ + line-height:var(--USER__lineHeight) !important; } -/* Readium CSS - Columns number pref - - A submodule managing columns number for user settings - Part of “Chrome Advanced” class – no flag required. - - Repo: https://github.com/readium/readium-css */ - -/* Number of columns = 1 | 2 */ - -/* We still need to see if we allow users to force number of columns for all configs, currently it behaves as an "auto" setting */ - -/* apply col setting except for mobile portrait */ - -@media screen and (min-width: 60em), screen and (min-device-width: 36em) and (max-device-width: 47em) and (orientation: landscape) { - :root[style*="--USER__colCount: 1"], - :root[style*="--USER__colCount:1"], - :root[style*="--USER__colCount: 2"], - :root[style*="--USER__colCount:2"] { - -webkit-column-count: var(--USER__colCount); - -moz-column-count: var(--USER__colCount); - column-count: var(--USER__colCount); - } - - /* If one column, make sure we limit line-length */ - :root[style*="--USER__colCount: 1"], - :root[style*="--USER__colCount:1"] { - --RS__maxLineLength: 40rem !important; /* This is the only way for the user setting to work in webkit… */ - --RS__colWidth: 100vw; - } - - /* If smartphone landscape, and 2 columns, col width the same as iPad landscape + desktop */ - :root[style*="--USER__colCount: 2"], - :root[style*="--USER__colCount:2"] { - --RS__colWidth: auto; /* User explicitely tells he/she wants 2 columns, we reset floor value */ - } +:root[style*="--USER__lineHeight"] body, +:root[style*="--USER__lineHeight"] p, +:root[style*="--USER__lineHeight"] li, +:root[style*="--USER__lineHeight"] div{ + line-height:var(--USER__lineHeight) !important; } -/* Readium CSS - Page margins pref - - A submodule managing page margins for user settings - Part of “Chrome Advanced” class – no flag required. - - Repo: https://github.com/readium/readium-css */ - -/* Page Margins: the user margin is a factor of the page gutter e.g. 0.5, 0.75, 1, 1.25, 1.5, etc. */ - -:root[style*="--USER__pageMargins"] body { - padding: 0 calc(var(--RS__pageGutter) * var(--USER__pageMargins)) !important; +:root[style*="--USER__paraSpacing"] p{ + margin-top:var(--USER__paraSpacing) !important; + margin-bottom:var(--USER__paraSpacing) !important; } -/* Readium CSS - Custom colors pref - - A submodule managing custom colors for user settings - Part of “Chrome Advanced” class – no flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="--USER__backgroundColor"] { - background-color: var(--USER__backgroundColor) !important; +:root[style*="--USER__fontWeight"] body{ + font-weight:var(--USER__fontWeight) !important; } -:root[style*="--USER__backgroundColor"] * { - background-color: transparent !important; +:root[style*="--USER__fontWeight"] b, +:root[style*="--USER__fontWeight"] strong{ + font-weight:bolder; } -:root[style*="--USER__textColor"] { - color: var(--USER__textColor) !important; +:root[style*="--USER__fontWidth"] body{ + font-stretch:var(--USER__fontWidth) !important; } -:root[style*="--USER__textColor"] *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(pre) { - color: inherit !important; +:root[style*="--USER__fontOpticalSizing"] body{ + font-optical-sizing:var(--USER__fontOpticalSizing) !important; } -/* Readium CSS - Font Family pref - - A submodule managing font-family for user settings - Part of “User Overrides” class – “font override” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-font-on"][style*="--USER__fontFamily"] { - font-family: var(--USER__fontFamily) !important; +: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) !important; + font-variant:none !important; } -:root[style*="readium-font-on"][style*="--USER__fontFamily"] body, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] p, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] li, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] div, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] dt, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] dd { - font-family: inherit !important; +:root[style*="readium-noRuby-on"] body rt, +:root[style*="readium-noRuby-on"] body rp{ + display:none; } -:root[style*="readium-font-on"][style*="--USER__fontFamily"] i:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] i:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] em:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] em:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] cite:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] cite:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] b:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] b:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] strong:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] strong:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] span:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] span:not([xml\:lang]) { - font-family: inherit !important; +:root[style*="readium-blend-on"] svg, +:root[style*="readium-blend-on"] img{ + background-color:transparent !important; + mix-blend-mode:multiply !important; } -/* Readium CSS - Font size pref - - A submodule managing font-size for user settings - Part of “User Overrides” class – no flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="--USER__fontSize"] { - font-size: var(--USER__fontSize) !important; +:root[style*="--USER__darkenImages"] img{ + -webkit-filter:brightness(var(--USER__darkenImages)) !important; + filter:brightness(var(--USER__darkenImages)) !important; } -/* Readium CSS - Line height pref - - A submodule managing line-height for user settings - Part of “User Overrides Advanced” class – “advanced settings” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] { - line-height: var(--USER__lineHeight) !important; +:root[style*="readium-darken-on"] img{ + -webkit-filter:brightness(80%) !important; + filter:brightness(80%) !important; } -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] body, -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] p, -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] li, -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] div { - line-height: inherit; +:root[style*="--USER__invertImages"] img{ + -webkit-filter:invert(var(--USER__invertImages)) !important; + filter:invert(var(--USER__invertImages)) !important; } -/* Readium CSS - Para spacing pref - - A submodule managing paragraphs’ top and bottom margins for user settings - Part of “User Overrides Advanced” class – “advanced settings” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-advanced-on"][style*="--USER__paraSpacing"] p { - margin-top: var(--USER__paraSpacing) !important; - margin-bottom: var(--USER__paraSpacing) !important; +:root[style*="readium-invert-on"] img{ + -webkit-filter:invert(100%) !important; + filter:invert(100%) !important; } -/* Readium CSS - Font size normalize - - A stylesheet to normalize font-size - - Repo: https://github.com/readium/readium-css */ - -/* STYLES */ - -/* :root is used so that you can quickly add a class or attribute if you prefer e.g. `:root[data-rs-normalize]` */ - -/* We create a default so that you don’t need to explicitly set one in the DOM. - Once the “Publisher’s styles” checkbox is unchecked, the normalize is applied automatically */ - -:root[style*="readium-advanced-on"] { - --USER__typeScale: 1.2; /* This is the default type scale you’ll find in most publications */ +:root[style*="--USER__darkenImages"][style*="--USER__invertImages"] img{ + -webkit-filter:brightness(var(--USER__darkenImages)) invert(var(--USER__invertImages)) !important; + filter:brightness(var(--USER__darkenImages)) invert(var(--USER__invertImages)) !important; } -:root[style*="readium-advanced-on"] p, -:root[style*="readium-advanced-on"] li, -:root[style*="readium-advanced-on"] div, -:root[style*="readium-advanced-on"] pre, -:root[style*="readium-advanced-on"] dd { - font-size: 1rem !important; +:root[style*="readium-darken-on"][style*="--USER__invertImages"] img{ + -webkit-filter:brightness(80%) invert(var(--USER__invertImages)) !important; + filter:brightness(80%) invert(var(--USER__invertImages)) !important; } -:root[style*="readium-advanced-on"] h1 { - /* Fallback if browser doesn’t support vars */ - font-size: 1.75rem !important; - font-size: calc(((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) * var(--USER__typeScale)) !important; +:root[style*="--USER__darkenImages"][style*="readium-invert-on"] img{ + -webkit-filter:brightness(var(--USER__darkenImages)) invert(100%) !important; + filter:brightness(var(--USER__darkenImages)) invert(100%) !important; } -:root[style*="readium-advanced-on"] h2 { - /* Fallback if browser doesn’t support vars */ - font-size: 1.5rem !important; - font-size: calc((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) !important; +:root[style*="readium-darken-on"][style*="readium-invert-on"] img{ + -webkit-filter:brightness(80%) invert(100%) !important; + filter:brightness(80%) invert(100%) !important; } -:root[style*="readium-advanced-on"] h3 { - /* Fallback if browser doesn’t support vars */ - font-size: 1.25rem !important; - font-size: calc(1rem * var(--USER__typeScale)) !important; +:root[style*="--USER__invertGaiji"] img[class*="gaiji"]{ + -webkit-filter:invert(var(--USER__invertGaiji)) !important; + filter:invert(var(--USER__invertGaiji)) !important; } -:root[style*="readium-advanced-on"] h4, -:root[style*="readium-advanced-on"] h5, -:root[style*="readium-advanced-on"] h6 { - font-size: 1rem !important; +:root[style*="readium-invertGaiji-on"] img[class*="gaiji"]{ + -webkit-filter:invert(100%) !important; + filter:invert(100%) !important; } -:root[style*="readium-advanced-on"] small { - font-size: smaller !important; +:root[style*="readium-normalize-on"]{ + --USER__typeScale:1.2; } -:root[style*="readium-advanced-on"] sub, -:root[style*="readium-advanced-on"] sup { - font-size: 67.5% !important; +:root[style*="readium-normalize-on"] p, +:root[style*="readium-normalize-on"] li, +:root[style*="readium-normalize-on"] div, +:root[style*="readium-normalize-on"] pre, +:root[style*="readium-normalize-on"] dd{ + font-size:1rem !important; } -/* The following styles kick in if you define the typeScale variable in the DOM. - No need to repeat declarations which don’t make use of the variable */ - -:root[style*="readium-advanced-on"][style*="--USER__typeScale"] h1 { - font-size: calc(((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) * var(--USER__typeScale)) !important; +:root[style*="readium-normalize-on"] h1{ + font-size:1.75rem !important; + font-size:calc(((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) * var(--USER__typeScale)) !important; } -:root[style*="readium-advanced-on"][style*="--USER__typeScale"] h2 { - font-size: calc((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) !important; +:root[style*="readium-normalize-on"] h2{ + font-size:1.5rem !important; + font-size:calc((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) !important; } -:root[style*="readium-advanced-on"][style*="--USER__typeScale"] h3 { - font-size: calc(1rem * var(--USER__typeScale)) !important; +:root[style*="readium-normalize-on"] h3{ + font-size:1.25rem !important; + font-size:calc(1rem * var(--USER__typeScale)) !important; } -/* Readium CSS - Default highlights - - A stylesheet for user highlights +:root[style*="readium-normalize-on"] h4, +:root[style*="readium-normalize-on"] h5, +:root[style*="readium-normalize-on"] h6{ + font-size:1rem !important; +} - Repo: https://github.com/readium/readium-css */ +:root[style*="readium-normalize-on"] small{ + font-size:smaller !important; +} -/* User Highlights */ +:root[style*="readium-normalize-on"] sub, +:root[style*="readium-normalize-on"] sup{ + font-size:67.5% !important; +} -.readiumCSS-yellow-highlight, -:root[style*="readium-sepia-on"] .readiumCSS-yellow-highlight, -:root[style*="readium-night-on"] .readiumCSS-yellow-highlight { - background-color: rgba(255, 255, 0, 0.5) !important; +:root[style*="readium-normalize-on"][style*="--USER__typeScale"] h1{ + font-size:calc(((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) * var(--USER__typeScale)) !important; } -.readiumCSS-green-highlight, -:root[style*="readium-sepia-on"] .readiumCSS-green-highlight, -:root[style*="readium-night-on"] .readiumCSS-green-highlight { - background-color: rgba(0, 255, 0, 0.5) !important; +:root[style*="readium-normalize-on"][style*="--USER__typeScale"] h2{ + font-size:calc((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) !important; } -.readiumCSS-orange-highlight, -:root[style*="readium-sepia-on"] .readiumCSS-orange-highlight, -:root[style*="readium-night-on"] .readiumCSS-orange-highlight { - background-color: rgba(255, 165, 0, 0.5) !important; +:root[style*="readium-normalize-on"][style*="--USER__typeScale"] h3{ + font-size:calc(1rem * var(--USER__typeScale)) !important; } -.readiumCSS-pink-highlight, -:root[style*="readium-sepia-on"] .readiumCSS-pink-highlight, -:root[style*="readium-night-on"] .readiumCSS-pink-highlight { - background-color: rgba(255, 105, 180, 0.5) !important; +:root[style*="readium-iPadOSPatch-on"] body{ + -webkit-text-size-adjust:none; } -/* Media overlays */ +: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; +} -.readiumCSS-mo-active-default { - color: black !important; - background-color: yellow !important; +: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; } -/*# sourceMappingURL=ReadiumCSS-after.css.map */ \ No newline at end of file + +: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/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-horizontal/ReadiumCSS-before.css b/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-horizontal/ReadiumCSS-before.css index dcb79fffdd..4271373511 100644 --- a/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-horizontal/ReadiumCSS-before.css +++ b/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-horizontal/ReadiumCSS-before.css @@ -1,615 +1,526 @@ -/* Readium CSS - Config module +/*! + * Readium CSS v.2.0.5 + * Copyright (c) 2017–2026. 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 + */ - A file allowing implementers to customize flags for reading modes, - user settings, etc. +@namespace url("http://www.w3.org/1999/xhtml"); - Repo: https://github.com/readium/readium-css */ +@namespace epub url("http://www.idpf.org/2007/ops"); -/* Custom medias - Syntax: @custom-media --variable (prop: value) */ +@namespace m url("http://www.w3.org/1998/Math/MathML"); -/* Responsive columns - The minimum width for which responsive columns (2 -> 1 and vice versa, - depending on the current font-size) must be enabled */ +@namespace svg url("http://www.w3.org/2000/svg"); -/* Mobile columns - The minimum and maximum width for mobile devices. - We’re forcing the landscape orientation by default, - and must still investigate large tablets (iPad Pro, Surface Pro 3, etc.). */ +@-ms-viewport{ + width:device-width; +} -/* Custom selectors - Syntax: @custom-selector :--variable selector - The selectors you will use for flags/switches - You can alternatively use classes or custom data-* attributes */ +@viewport{ + width:device-width; + zoom:1; +} -/* User view = paged | scrolled */ +:root{ -/* Font-family override */ + --RS__sans-serif-ja-v:'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ W3', 'YuGothic', 'Yu Gothic Medium', 'BIZ UDGothic', 'Yu Gothic', 'ＭＳゴシック', 'MS Gothic', sans-serif; -/* Advanced settings */ + --RS__serif-ja-v:'Hiragino Mincho ProN', 'Hiragino Mincho Pro', 'YuMincho', 'BIZ UDMincho', 'Yu Mincho', 'ＭＳ明朝', 'MS Mincho', serif; -/* Reading Modes */ + --RS__sans-serif-ja:'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ W3', 'YuGothic', 'Yu Gothic Medium', 'BIZ UDPGothic', 'Yu Gothic', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; -/* Filters (images) */ + --RS__serif-ja:'Hiragino Mincho ProN', 'Hiragino Mincho Pro', 'YuMincho', 'BIZ UDPMincho', 'Yu Mincho', 'ＭＳ Ｐ明朝', 'MS PMincho', serif; -/* Accessibility normalization */ + --RS__monospaceTf:ui-monospace, 'Andale Mono', 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; -/* Accessibility font. You can add selectors, using “, ” as a separator, if you have multiple fonts */ + --RS__humanistTf:Seravek, Calibri, 'Gill Sans Nova', Roboto, Ubuntu, 'DejaVu Sans', source-sans-pro, sans-serif; -/* Direction i.e. ltr and rtl */ + --RS__sansTf:-ui-sans-serif, -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI Variable', 'Segoe UI', Inter, Roboto, 'Helvetica Neue', 'Arial Nova', 'Liberation Sans', Arial, sans-serif; -/* Readium CSS - Namespaces module + --RS__modernTf:Athelas, Constantia, Charter, 'Bitstream Charter', Cambria, 'Georgia Pro', Georgia, serif; - Namespaces to import in all 3 dist stylesheets + --RS__oldStyleTf:'Iowan Old Style', Sitka, 'Sitka Text', Palatino, 'Book Antiqua', 'URW Palladio L', P052, serif; - Repo: https://github.com/readium/readium-css */ + --RS__zh-HK-lineHeightCompensation:1.167; -@namespace url("http://www.w3.org/1999/xhtml"); + --RS__zh-HK-baseFontFamily:'方體', 'PingFang HK', '方體', 'PingFang TC', '黑體', 'Heiti TC', 'Microsoft JhengHei UI', 'Microsoft JhengHei', Roboto, Noto, 'Noto Sans CJK TC', sans-serif; -@namespace epub url("http://www.idpf.org/2007/ops"); + --RS__zh-TW-lineHeightCompensation:1.167; -@namespace m url("http://www.w3.org/1998/Math/MathML/"); + --RS__zh-TW-baseFontFamily:'方體', 'PingFang TC', '黑體', 'Heiti TC', 'Microsoft JhengHei UI', 'Microsoft JhengHei', Roboto, Noto, 'Noto Sans CJK TC', sans-serif; -@namespace svg url("http://www.w3.org/2000/svg"); + --RS__zh-Hant-lineHeightCompensation:1.167; -/* Readium CSS - Base module + --RS__zh-Hant-baseFontFamily:'方體', 'PingFang TC', '黑體', 'Heiti TC', 'Microsoft JhengHei UI', 'Microsoft JhengHei', Roboto, Noto, 'Noto Sans CJK TC', sans-serif; - A minimal stylesheet for all ebooks + --RS__zh-lineHeightCompensation:1.167; - Repo: https://github.com/readium/readium-css */ + --RS__zh-baseFontFamily:'方体', 'PingFang SC', '黑体', 'Heiti SC', 'Microsoft JhengHei UI', 'Microsoft JhengHei', Roboto, Noto, 'Noto Sans CJK SC', sans-serif; -/* Define viewport, HTML5-style */ + --RS__th-lineHeightCompensation:1.067; -@-ms-viewport { - width: device-width; -} + --RS__th-baseFontFamily:Thonburi, 'Leelawadee UI', 'Cordia New', Roboto, Noto, 'Noto Sans Thai', sans-serif; -@viewport { - width: device-width; - zoom: 1; -} + --RS__te-baseFontFamily:'Kohinoor Telugu', 'Telugu Sangam MN', 'Nirmala UI', Gautami, Roboto, Noto, 'Noto Sans Telugu', sans-serif; -:root { - /* Default font-stacks */ - --RS__oldStyleTf: "Iowan Old Style", "Sitka Text", Palatino, "Book Antiqua", serif; - --RS__modernTf: Athelas, Constantia, Georgia, serif; - --RS__sansTf: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; - --RS__humanistTf: Seravek, Calibri, Roboto, Arial, sans-serif; - --RS__monospaceTf: "Andale Mono", Consolas, monospace; + --RS__ta-lineHeightCompensation:1.067; - /* Config */ - --RS__baseFontFamily: var(--RS__oldStyleTf); + --RS__ta-baseFontFamily:'Tamil Sangam MN', 'Nirmala UI', Latha, Roboto, Noto, 'Noto Sans Tamil', sans-serif; - /* For square-ish fonts (CJK, Indic, etc.), we must apply some compensation in dynamic leading. Default is 1 i.e. no compensation */ - --RS__lineHeightCompensation: 1; + --RS__si-lineHeightCompensation:1.167; - /* Dynamic leading based on typeface metrics + font-size setting */ - --RS__baseLineHeight: calc((1em + (2ex - 1ch) - ((1rem - 16px) * 0.1667)) * var(--RS__lineHeightCompensation)); -} + --RS__si-baseFontFamily:'Sinhala Sangam MN', 'Nirmala UI', 'Iskoola Pota', Roboto, Noto, 'Noto Sans Sinhala', sans-serif; -/* Set default font for the html doc, so that it can be overridden by the authors’s stylesheet */ + --RS__pa-lineHeightCompensation:1.1; -html { - font-family: var(--RS__baseFontFamily); - /* Fallback line-height */ - line-height: 1.6; /* Fits a little bit better for all languages than 1.5 */ - line-height: var(--RS__baseLineHeight); - text-rendering: optimizeLegibility; -} + --RS__pa-baseFontFamily:'Gurmukhi MN', 'Nirmala UI', Kartika, Roboto, Noto, 'Noto Sans Gurmukhi', sans-serif; -/* 1.5 being too loose with larger font-sizes, we reset headings to normal (which value is 1.125–1.375 for our font-stacks) */ + --RS__or-lineHeightCompensation:1.167; -h1, h2, h3 { - line-height: normal; -} + --RS__or-baseFontFamily:'Oriya Sangam MN', 'Nirmala UI', Kalinga, Roboto, Noto, 'Noto Sans Oriya', sans-serif; -:lang(ja), -:lang(zh), -:lang(ko) { - word-wrap: break-word; - -webkit-line-break: strict; - -epub-line-break: strict; - line-break: strict; -} + --RS__ml-lineHeightCompensation:1.067; -/* Set default font for Math */ + --RS__ml-baseFontFamily:'Malayalam Sangam MN', 'Nirmala UI', Kartika, Roboto, Noto, 'Noto Sans Malayalam', sans-serif; -math { - font-family: "Latin Modern Math", "STIX Two Math", "XITS Math", "STIX Math", "Libertinus Math", "TeX Gyre Termes Math", "TeX Gyre Bonum Math", "TeX Gyre Schola", "DejaVu Math TeX Gyre", "TeX Gyre Pagella Math", "Asana Math", "Cambria Math", "Lucida Bright Math", "Minion Math", STIXGeneral, STIXSizeOneSym, Symbol, "Times New Roman", serif; -} + --RS__lo-baseFontFamily:'Lao Sangam MN', 'Leelawadee UI', 'Lao UI', Roboto, Noto, 'Noto Sans Lao', sans-serif; -/* Language Overrides - That will only work if either html or body have a (xml:)lang attribute, not for inline overrides */ + --RS__ko-lineHeightCompensation:1.167; -:lang(am) { - --RS__baseFontFamily: Kefa, Nyala, Roboto, Noto, "Noto Sans Ethiopic", serif; - --RS__lineHeightCompensation: 1.167; -} + --RS__ko-baseFontFamily:'Nanum Gothic', 'Apple SD Gothic Neo', 'Malgun Gothic', Roboto, Noto, 'Noto Sans CJK KR', sans-serif; -:lang(ar) { - --RS__baseFontFamily: "Geeza Pro", "Arabic Typesetting", Roboto, Noto, "Noto Naskh Arabic", "Times New Roman", serif; -} + --RS__kn-lineHeightCompensation:1.1; -:lang(bn) { - --RS__baseFontFamily: "Kohinoor Bangla", "Bangla Sangam MN", Vrinda, Roboto, Noto, "Noto Sans Bengali", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__kn-baseFontFamily:'Kannada Sangam MN', 'Nirmala UI', Tunga, Roboto, Noto, 'Noto Sans Kannada', sans-serif; -:lang(bo) { - --RS__baseFontFamily: Kailasa, "Microsoft Himalaya", Roboto, Noto, "Noto Sans Tibetan", sans-serif; -} + --RS__km-lineHeightCompensation:1.067; -:lang(chr) { - --RS__baseFontFamily: "Plantagenet Cherokee", Roboto, Noto, "Noto Sans Cherokee"; - --RS__lineHeightCompensation: 1.167; -} + --RS__km-baseFontFamily:'Khmer Sangam MN', 'Leelawadee UI', 'Khmer UI', Roboto, Noto, 'Noto Sans Khmer', sans-serif; -:lang(fa) { - --RS__baseFontFamily: "Geeza Pro", "Arabic Typesetting", Roboto, Noto, "Noto Naskh Arabic", "Times New Roman", serif; -} + --RS__ja-lineHeightCompensation:1.167; -:lang(gu) { - --RS__baseFontFamily: "Gujarati Sangam MN", "Nirmala UI", Shruti, Roboto, Noto, "Noto Sans Gujarati", sans-serif; - --RS__lineHeightCompensation: 1.167; -} + --RS__ja-baseFontFamily:YuGothic, 'Hiragino Maru Gothic ProN', 'Hiragino Sans', 'Yu Gothic UI', 'Meiryo UI', 'MS Gothic', Roboto, Noto, 'Noto Sans CJK JP', sans-serif; -:lang(he) { - --RS__baseFontFamily: "New Peninim MT", "Arial Hebrew", Gisha, "Times New Roman", Roboto, Noto, "Noto Sans Hebrew" sans-serif; - --RS__lineHeightCompensation: 1.1; -} + --RS__iu-baseFontFamily:'Euphemia UCAS', Euphemia, Roboto, Noto, 'Noto Sans Canadian Aboriginal', sans-serif; -:lang(hi) { - --RS__baseFontFamily: "Kohinoor Devanagari", "Devanagari Sangam MN", Kokila, "Nirmala UI", Roboto, Noto, "Noto Sans Devanagari", sans-serif; + --RS__hy-baseFontFamily:Mshtakan, Sylfaen, Roboto, Noto, 'Noto Serif Armenian', serif; - --RS__lineHeightCompensation: 1.1; -} + --RS__hi-lineHeightCompensation:1.1; -:lang(hy) { - --RS__baseFontFamily: Mshtakan, Sylfaen, Roboto, Noto, "Noto Serif Armenian", serif; -} + --RS__hi-baseFontFamily:'Kohinoor Devanagari', 'Devanagari Sangam MN', Kokila, 'Nirmala UI', Roboto, Noto, 'Noto Sans Devanagari', sans-serif; -:lang(iu) { - --RS__baseFontFamily: "Euphemia UCAS", Euphemia, Roboto, Noto, "Noto Sans Canadian Aboriginal", sans-serif; -} + --RS__he-lineHeightCompensation:1.1; -:lang(ja) { - --RS__baseFontFamily: "游ゴシック体", YuGothic, "ヒラギノ丸ゴ", "Hiragino Sans", "Yu Gothic UI", "Meiryo UI", "MS Gothic", Roboto, Noto, "Noto Sans CJK JP", sans-serif; + --RS__he-baseFontFamily:'New Peninim MT', 'Arial Hebrew', Gisha, 'Times New Roman', Roboto, Noto, 'Noto Sans Hebrew', sans-serif; - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; + --RS__gu-lineHeightCompensation:1.167; - /* Extra variables for Japanese font-stacks as we may want to reuse them for user settings + default */ - --RS__serif-ja: "ＭＳ Ｐ明朝", "MS PMincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "游明朝", "YuMincho", "ＭＳ 明朝", "MS Mincho", "Hiragino Mincho ProN", serif; - --RS__sans-serif-ja: "ＭＳ Ｐゴシック", "MS PGothic", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", "Hiragino Sans GB", "ヒラギノ角ゴシック W3", "游ゴシック", "YuGothic", "ＭＳ ゴシック", "MS Gothic", "Hiragino Sans", sans-serif; - --RS__serif-ja-v: "ＭＳ 明朝", "MS Mincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho", "Hiragino Mincho ProN", serif; - --RS__sans-serif-ja-v: "ＭＳ ゴシック", "MS Gothic", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", "Hiragino Sans GB", "ヒラギノ角ゴシック W3", "游ゴシック", "YuGothic", "ＭＳ Ｐゴシック", "MS PGothic", "Hiragino Sans", sans-serif; -} + --RS__gu-baseFontFamily:'Gujarati Sangam MN', 'Nirmala UI', Shruti, Roboto, Noto, 'Noto Sans Gujarati', sans-serif; -:lang(km) { - --RS__baseFontFamily: "Khmer Sangam MN", "Leelawadee UI", "Khmer UI", Roboto, Noto, "Noto Sans Khmer", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__fa-baseFontFamily:'Geeza Pro', 'Arabic Typesetting', Roboto, Noto, 'Noto Naskh Arabic', 'Times New Roman', serif; -:lang(kn) { - --RS__baseFontFamily: "Kannada Sangam MN", "Nirmala UI", Tunga, Roboto, Noto, "Noto Sans Kannada", sans-serif; - --RS__lineHeightCompensation: 1.1; -} + --RS__chr-lineHeightCompensation:1.167; -:lang(ko) { - --RS__baseFontFamily: "Nanum Gothic", "Apple SD Gothic Neo", "Malgun Gothic", Roboto, Noto, "Noto Sans CJK KR", sans-serif; + --RS__chr-baseFontFamily:'Plantagenet Cherokee', Roboto, Noto, 'Noto Sans Cherokee'; - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; -} + --RS__bo-baseFontFamily:Kailasa, 'Microsoft Himalaya', Roboto, Noto, 'Noto Sans Tibetan', sans-serif; -:lang(lo) { - --RS__baseFontFamily: "Lao Sangam MN", "Leelawadee UI", "Lao UI", Roboto, Noto, "Noto Sans Lao", sans-serif; -} + --RS__bn-lineHeightCompensation:1.067; -:lang(ml) { - --RS__baseFontFamily: "Malayalam Sangam MN", "Nirmala UI", Kartika, Roboto, Noto, "Noto Sans Malayalam", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__bn-baseFontFamily:'Kohinoor Bangla', 'Bangla Sangam MN', Vrinda, Roboto, Noto, 'Noto Sans Bengali', sans-serif; -:lang(or) { - --RS__baseFontFamily: "Oriya Sangam MN", "Nirmala UI", Kalinga, Roboto, Noto, "Noto Sans Oriya", sans-serif; - --RS__lineHeightCompensation: 1.167; -} + --RS__ar-baseFontFamily:'Geeza Pro', 'Arabic Typesetting', Roboto, Noto, 'Noto Naskh Arabic', 'Times New Roman', serif; -:lang(pa) { - --RS__baseFontFamily: "Gurmukhi MN", "Nirmala UI", Kartika, Roboto, Noto, "Noto Sans Gurmukhi", sans-serif; - --RS__lineHeightCompensation: 1.1; -} + --RS__am-lineHeightCompensation:1.167; -:lang(si) { - --RS__baseFontFamily: "Sinhala Sangam MN", "Nirmala UI", "Iskoola Pota", Roboto, Noto, "Noto Sans Sinhala", sans-serif; - --RS__lineHeightCompensation: 1.167; -} + --RS__am-baseFontFamily:Kefa, Nyala, Roboto, Noto, 'Noto Sans Ethiopic', serif; -:lang(ta) { - --RS__baseFontFamily: "Tamil Sangam MN", "Nirmala UI", Latha, Roboto, Noto, "Noto Sans Tamil", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__latin-lineHeightCompensation:1; -:lang(te) { - --RS__baseFontFamily: "Kohinoor Telugu", "Telugu Sangam MN", "Nirmala UI", Gautami, Roboto, Noto, "Noto Sans Telugu", sans-serif; -} + --RS__latin-baseFontFamily:var(--RS__oldStyleTf); + --RS__baseFontFamily:var(--RS__latin-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__latin-lineHeightCompensation); + --RS__baseLineHeight:calc(1.5 * var(--RS__lineHeightCompensation)); -:lang(th) { - --RS__baseFontFamily: "Thonburi", "Leelawadee UI", "Cordia New", Roboto, Noto, "Noto Sans Thai", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__selectionTextColor:inherit; -/* The following will also work for zh-Hans */ + --RS__selectionBackgroundColor:#b4d8fe; -:lang(zh) { - --RS__baseFontFamily: "方体", "PingFang SC", "黑体", "Heiti SC", "Microsoft JhengHei UI", "Microsoft JhengHei", Roboto, Noto, "Noto Sans CJK SC", sans-serif; + --RS__visitedColor:#551A8B; - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; -} + --RS__linkColor:#0000EE; -:lang(zh-Hant), -:lang(zh-TW) { - --RS__baseFontFamily: "方體", "PingFang TC", "黑體", "Heiti TC", "Microsoft JhengHei UI", "Microsoft JhengHei", Roboto, Noto, "Noto Sans CJK TC", sans-serif; + --RS__textColor:#121212; - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; + --RS__backgroundColor:#FFFFFF; + color:var(--RS__textColor) !important; + + background-color:var(--RS__backgroundColor) !important; } -:lang(zh-HK) { - --RS__baseFontFamily: "方體", "PingFang HK", "方體", "PingFang TC", "黑體", "Heiti TC", "Microsoft JhengHei UI", "Microsoft JhengHei", Roboto, Noto, "Noto Sans CJK TC", sans-serif; +::-moz-selection{ + color:var(--RS__selectionTextColor); + background-color:var(--RS__selectionBackgroundColor); +} - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; +::selection{ + color:var(--RS__selectionTextColor); + background-color:var(--RS__selectionBackgroundColor); } -/* Readium CSS - Day/Default mode +html{ + font-family:var(--RS__baseFontFamily); + line-height:1.6; + line-height:var(--RS__baseLineHeight); + text-rendering:optimizelegibility; +} - A preset theme for day mode, which is the default +h1, h2, h3{ + line-height:normal; +} - Repo: https://github.com/readium/readium-css */ +:lang(ja), +:lang(zh), +:lang(ko){ + word-wrap:break-word; + -webkit-line-break:strict; + -epub-line-break:strict; + line-break:strict; +} -/* CONFIG */ +math{ + font-family:"Latin Modern Math", "STIX Two Math", "XITS Math", "STIX Math", "Libertinus Math", "TeX Gyre Termes Math", "TeX Gyre Bonum Math", "TeX Gyre Schola", "DejaVu Math TeX Gyre", "TeX Gyre Pagella Math", "Asana Math", "Cambria Math", "Lucida Bright Math", "Minion Math", STIXGeneral, STIXSizeOneSym, Symbol, "Times New Roman", serif; +} -:root { - --RS__backgroundColor: #FFFFFF; - --RS__textColor: #121212; +:lang(am){ + --RS__baseFontFamily:var(--RS__am-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__am-lineHeightCompensation); +} - /* This can be customized but initial will re-use default value of the browser */ - --RS__selectionBackgroundColor: #b4d8fe; - --RS__selectionTextColor: inherit; +:lang(ar){ + --RS__baseFontFamily:var(--RS__ar-baseFontFamily); } -:root { - color: var(--RS__textColor) !important; - background-color: var(--RS__backgroundColor) !important; +:lang(bn){ + --RS__baseFontFamily:var(--RS__bn-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__bn-lineHeightCompensation); } -/* Note: Though `::selection` was present in drafts of CSS Selectors Level 3, it was removed during the Candidate Recommendation phase because its behavior was under-specified (especially with nested elements) and interoperability wasn’t achieved. Source: https://developer.mozilla.org/en-US/docs/Web/CSS/::selection */ +:lang(bo){ + --RS__baseFontFamily:var(--RS__bo-baseFontFamily); +} -::-moz-selection { - color: var(--RS__selectionTextColor); - background-color: var(--RS__selectionBackgroundColor); +:lang(chr){ + --RS__baseFontFamily:var(--RS__chr-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__chr-lineHeightCompensation); } -::selection { - color: var(--RS__selectionTextColor); - background-color: var(--RS__selectionBackgroundColor); +:lang(fa){ + --RS__baseFontFamily:var(--RS__fa-baseFontFamily); } -/* @import "modules/ReadiumCSS-fonts.css"; */ +:lang(gu){ + --RS__baseFontFamily:var(--RS__gu-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__gu-lineHeightCompensation); +} -/* Readium CSS - HTML5 SR Patch stylesheet +:lang(he){ + --RS__baseFontFamily:var(--RS__he-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__he-lineHeightCompensation); +} - A set of style to adjust HTML5 Suggested Rendering to paginated content +:lang(hi){ + --RS__baseFontFamily:var(--RS__hi-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__hi-lineHeightCompensation); +} - Repo: https://github.com/readium/readium-css */ +:lang(hy){ + --RS__baseFontFamily:var(--RS__hy-baseFontFamily); +} -/* Fragmentation */ +:lang(iu){ + --RS__baseFontFamily:var(--RS__iu-baseFontFamily); +} -body { - widows: 2; - orphans: 2; +:lang(ja){ + --RS__baseFontFamily:var(--RS__ja-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__ja-lineHeightCompensation); } -figcaption, th, td { - widows: 1; - orphans: 1; +:lang(km){ + --RS__baseFontFamily:var(--RS__km-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__km-lineHeightCompensation); } -h2, -h3, -h4, -h5, -h6, -dt, -hr, -caption { - -webkit-column-break-after: avoid; - page-break-after: avoid; - break-after: avoid; +:lang(kn){ + --RS__baseFontFamily:var(--RS__kn-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__kn-lineHeightCompensation); } -h1, -h2, -h3, -h4, -h5, -h6, -dt, -figure, -tr { - -webkit-column-break-inside: avoid; - page-break-inside: avoid; - break-inside: avoid; +:lang(ko){ + --RS__baseFontFamily:var(--RS__ko-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__ko-lineHeightCompensation); } -/* Hyphenation */ +:lang(lo){ + --RS__baseFontFamily:var(--RS__lo-baseFontFamily); +} -body { - -webkit-hyphenate-character: "\002D"; - -moz-hyphenate-character: "\002D"; - -ms-hyphenate-character: "\002D"; - hyphenate-character: "\002D"; - -webkit-hyphenate-limit-lines: 3; - -ms-hyphenate-limit-lines: 3; - hyphenate-limit-lines: 3; +:lang(ml){ + --RS__baseFontFamily:var(--RS__ml-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__ml-lineHeightCompensation); } -h1, -h2, -h3, -h4, -h5, -h6, -dt, -figcaption, -pre, -caption, -address, -center, -code, -var { - -ms-hyphens: none; - -moz-hyphens: none; - -webkit-hyphens: none; - -epub-hyphens: none; - hyphens: none; +:lang(or){ + --RS__baseFontFamily:var(--RS__or-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__or-lineHeightCompensation); } -/* OTF */ +:lang(pa){ + --RS__baseFontFamily:var(--RS__pa-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__pa-lineHeightCompensation); +} -body { - font-variant-numeric: oldstyle-nums proportional-nums; +:lang(si){ + --RS__baseFontFamily:var(--RS__si-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__si-lineHeightCompensation); } -:lang(ja) body, -:lang(zh) body, -:lang(ko) body { - font-variant-numeric: lining-nums proportional-nums; +:lang(ta){ + --RS__baseFontFamily:var(--RS__ta-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__ta-lineHeightCompensation); } -h1, h2, h3, h4, h5, h6, dt { - font-variant-numeric: lining-nums proportional-nums; +:lang(te){ + --RS__baseFontFamily:var(--RS__te-baseFontFamily); } -table { - font-variant-numeric: lining-nums tabular-nums; +:lang(th){ + --RS__baseFontFamily:var(--RS__th-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__th-lineHeightCompensation); } -code, var { - font-variant-ligatures: none; - font-variant-numeric: lining-nums tabular-nums slashed-zero; +:lang(zh){ + --RS__baseFontFamily:var(--RS__zh-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__zh-lineHeightCompensation); } -rt { - font-variant-east-asian: ruby; +:lang(zh-Hant){ + --RS__baseFontFamily:var(--RS__zh-Hant-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__zh-Hant-lineHeightCompensation); } -:lang(ar) { - font-variant-ligatures: common-ligatures; +:lang(zh-TW){ + --RS__baseFontFamily:var(--RS__zh-TW-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__zh-TW-lineHeightCompensation); } -:lang(ko) { - font-kerning: normal; +:lang(zh-HK){ + --RS__baseFontFamily:var(--RS__zh-HK-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__zh-HK-lineHeightCompensation); } -/* Night mode */ +body{ + widows:2; + orphans:2; +} -hr { - color: inherit; - border-color: currentColor; +figcaption, th, td{ + widows:1; + orphans:1; } -table, th, td { - border-color: currentColor; +h2, h3, h4, h5, h6, dt, +hr, caption{ + -webkit-column-break-after:avoid; + page-break-after:avoid; + break-after:avoid; } -/* Horizontal Spacing */ +h1, h2, h3, h4, h5, h6, dt, +figure, tr{ + -webkit-column-break-inside:avoid; + page-break-inside:avoid; + break-inside:avoid; +} -figure, blockquote { - margin: 1em 5%; +body{ + -webkit-hyphenate-character:"\002D"; + -moz-hyphenate-character:"\002D"; + -ms-hyphenate-character:"\002D"; + hyphenate-character:"\002D"; + -webkit-hyphenate-limit-lines:3; + -ms-hyphenate-limit-lines:3; + hyphenate-limit-lines:3; } -/* +h1, h2, h3, h4, h5, h6, dt, +figcaption, pre, caption, address, +center, code, var{ + -ms-hyphens:none; + -moz-hyphens:none; + -webkit-hyphens:none; + -epub-hyphens:none; + hyphens:none; +} -:lang(ja) figure, :lang(ja) blockquote, -:lang(zh-Hant) figure, :lang(zh-Hant) blockquote, -:lang(zh-TW) figure, :lang(zh-TW) blockquote, -:lang(mn) figure, :lang(mn) blockquote { - margin: 5% 1em; +body{ + font-variant-numeric:oldstyle-nums proportional-nums; } -*/ +:lang(ja) body, +:lang(zh) body, +:lang(ko) body{ + font-variant-numeric:lining-nums proportional-nums; +} -ul, ol { - padding-left: 5%; +h1, h2, h3, h4, h5, h6, dt{ + font-variant-numeric:lining-nums proportional-nums; } -/* +table{ + font-variant-numeric:lining-nums tabular-nums; +} -:lang(ja) ul, :lang(ja) ol, -:lang(zh-Hant) ul, :lang(zh-Hant) ol, -:lang(zh-TW) ul, :lang(zh-TW) ol, -:lang(mn) ul, :lang(mn) ol { - padding-top: 5%; +code, var{ + font-variant-ligatures:none; + font-variant-numeric:lining-nums tabular-nums slashed-zero; } -*/ +rt{ + font-variant-east-asian:ruby; +} -dd { - margin-left: 5%; +:lang(ar){ + font-variant-ligatures:common-ligatures; } -/* +:lang(ko){ + font-kerning:normal; +} -:lang(ja) dd, -:lang(zh-Hant) dd, -:lang(zh-TW) dd, -:lang(mn) dd { - margin-top: 5%; +hr{ + color:inherit; + border-color:currentcolor; } -*/ +table, th, td{ + border-color:currentcolor; +} -pre { - white-space: pre-wrap; - -ms-tab-size: 2; - -moz-tab-size: 2; - -webkit-tab-size: 2; - tab-size: 2; +figure, blockquote{ + margin:1em 5%; } -/* Normalization */ +ul, ol{ + padding-left:5%; +} -abbr[title], acronym[title] { - text-decoration: dotted underline; +dd{ + margin-left:5%; } -nobr wbr { - white-space: normal; +pre{ + white-space:pre-wrap; + -ms-tab-size:2; + -moz-tab-size:2; + -webkit-tab-size:2; + tab-size:2; } -/* Make ruby text and parentheses non-selectable (TBC) */ +abbr[title], acronym[title]{ + text-decoration:dotted underline; +} -ruby > rt, ruby > rp { - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; +nobr wbr{ + white-space:normal; } -/* Internationalization */ +ruby > rt, ruby > rp{ + -webkit-user-select:none; + -moz-user-select:none; + -ms-user-select:none; + user-select:none; +} -*:lang(ja), -*:lang(zh), -*:lang(ko), -:lang(ja) cite, -:lang(ja) dfn, -:lang(ja) em, -:lang(ja) i, -:lang(zh) cite, -:lang(zh) dfn, -:lang(zh) em, -:lang(zh) i, -:lang(ko) cite, -:lang(ko) dfn, -:lang(ko) em, -:lang(ko) i { - font-style: normal; +*:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)), +*:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)), +*:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)), +:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)) cite, +:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)) dfn, +:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)) em, +:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)) i, +:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)) cite, +:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)) dfn, +:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)) em, +:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)) i, +:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)) cite, +:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)) dfn, +:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)) em, +:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)) i{ + font-style:normal; } :lang(ja) a, :lang(zh) a, -:lang(ko) a { - text-decoration: none; +:lang(ko) a{ + text-decoration:none; } -/* Readium CSS - Safeguards module - - A set of styles to prevent common issues in pagination - - Repo: https://github.com/readium/readium-css */ - -/* Config */ - -/* We’ll be using an "RS__" prefix so that we can prevent collisions with authors’ CSS */ - -:root { - /* max-width for media, you can override that via JS if not compiled to static */ - --RS__maxMediaWidth: 100%; - - /* max-height for media, you can override that via JS if not compiled to static - Please consider figures might have a figcaption, which is why 95vh in the first place */ - --RS__maxMediaHeight: 95vh; - - /* value for medias’ box-sizing */ - --RS__boxSizingMedia: border-box; - - /* value for table’s box-sizing */ - --RS__boxSizingTable: border-box; +:root{ + --RS__maxMediaWidth:100%; + --RS__maxMediaHeight:95vh; + --RS__boxSizingMedia:border-box; + --RS__boxSizingTable:border-box; } -/* Sanitize line-heights in webkit e.g. raised cap without a declared line-height - See effect by checking this demo in Safari: https://codepen.io/JayPanoz/pen/gRmzrE - Note: glyphs has to be reset to inline for CJK */ - -html { - -webkit-line-box-contain: block glyphs replaced; +a, a span, span a, h1, h2, h3, h4, h5, h6{ + word-wrap:break-word; } -:lang(ja) { - -webkit-line-box-contain: block inline replaced; +div{ + max-width:var(--RS__maxMediaWidth); } -/* Wrap long strings if larger than line-length */ - -a, h1, h2, h3, h4, h5, h6 { - word-wrap: break-word; -} +img, svg|svg, video{ + object-fit:contain; -div { - max-width: var(--RS__maxMediaWidth); + width:auto; + height:auto; + max-width:var(--RS__maxMediaWidth); + max-height:var(--RS__maxMediaHeight) !important; + box-sizing:var(--RS__boxSizingMedia); + -webkit-column-break-inside:avoid; + page-break-inside:avoid; + break-inside:avoid; } -/* Size medias */ - -/* You can override CSS variables by re-defining it for all elements or a specific one */ - -img, svg, audio, video { +@supports (zoom: 1) and (not ((-webkit-column-axis: horizontal) and (-webkit-column-progression: normal))){ - /* Object-fit allows us to keep the correct aspect-ratio */ - object-fit: contain; - - width: auto; - height: auto; - - /* Some files don’t have max-width */ - max-width: var(--RS__maxMediaWidth); - - /* We’re setting a max-height, especially for covers */ - max-height: var(--RS__maxMediaHeight) !important; - /* We probably don’t need to use modern box-sizing as auto behaves like it */ - box-sizing: var(--RS__boxSizingMedia); - - /* For page-break, we must use those 3 - We can’t use a variable there, webkit seems to no support them for those properties */ - -webkit-column-break-inside: avoid; - page-break-inside: avoid; - break-inside: avoid; + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] img, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] svg|svg, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] video{ + zoom:calc(100% / var(--USER__fontSize)); + } } -/* Try preventing border being cut-off, webkit + blink have content-box by default */ +audio{ + max-width:100%; + -webkit-column-break-inside:avoid; + page-break-inside:avoid; + break-inside:avoid; + } -table { - max-width: var(--RS__maxMediaWidth); - box-sizing: var(--RS__boxSizingTable); -} -/*# sourceMappingURL=ReadiumCSS-before.css.map */ \ No newline at end of file +table{ + max-width:var(--RS__maxMediaWidth); + box-sizing:var(--RS__boxSizingTable); +} \ No newline at end of file diff --git a/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-horizontal/ReadiumCSS-default.css b/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-horizontal/ReadiumCSS-default.css index 37530d830a..2cef48fd2e 100644 --- a/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-horizontal/ReadiumCSS-default.css +++ b/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-horizontal/ReadiumCSS-default.css @@ -1,207 +1,177 @@ -/* Readium CSS - Namespaces module - - Namespaces to import in all 3 dist stylesheets - - Repo: https://github.com/readium/readium-css */ +/*! + * Readium CSS v.2.0.5 + * Copyright (c) 2017–2026. 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 + */ @namespace url("http://www.w3.org/1999/xhtml"); @namespace epub url("http://www.idpf.org/2007/ops"); -@namespace m url("http://www.w3.org/1998/Math/MathML/"); +@namespace m url("http://www.w3.org/1998/Math/MathML"); @namespace svg url("http://www.w3.org/2000/svg"); -/* Readium CSS - Default module for CJK horizontal writing - - A stylesheet for unstyled ebooks based on HTML5 Suggested Rendering - Note: works in combination with Base module - - Repo: https://github.com/readium/readium-css */ +:root{ -/* CONFIG */ + --RS__compFontFamily:var(--RS__baseFontFamily); + --RS__codeFontFamily:var(--RS__monospaceTf); -:root { - /* Extra variables for Japanese font-stacks: - • --RS__serif-ja; - • --RS__sans-serif-ja. + --RS__typeScale:1.125; + --RS__baseFontSize:87.5%; - They can be used instead of --RS__baseFontFamily and --RS__compFontFamily */ + --RS__flowSpacing:1.5rem; + --RS__paraSpacing:0; + --RS__paraIndent:1em; - --RS__compFontFamily: var(--RS__baseFontFamily); - --RS__codeFontFamily: var(--RS__monospaceTf); + --RS__linkColor:#0000EE; + --RS__visitedColor:#551A8B; - --RS__typeScale: 1.125; /* 1.067 | 1.125 | 1.2 | 1.25 | 1.333 | 1.414 | 1.5 | 1.618 */ - --RS__baseFontSize: 87.5%; - - --RS__flowSpacing: 1.5rem; - --RS__paraSpacing: 0; - --RS__paraIndent: 1em; - - --RS__linkColor: #0000EE; - --RS__visitedColor: #551A8B; - - --RS__primaryColor: ; - --RS__secondaryColor: ; + --RS__primaryColor:; + --RS__secondaryColor:; } -:root:lang(zh) { - --RS__paraIndent: 2em; +:root:lang(zh){ + --RS__paraIndent:2em; } -/* STYLES */ - -/* Typo */ - -:root { - quotes: "\201c" "\201d" "\2018" "\2019"; +:root{ + quotes:"\201c" "\201d" "\2018" "\2019"; } -body { - font-size: var(--RS__baseFontSize); - text-align: justify; - text-justify: inter-character; +body{ + font-size:var(--RS__baseFontSize); + text-align:justify; + text-justify:inter-character; } -h1, h2, h3, h4, h5, h6 { - font-family: var(--RS__baseFontFamily); - text-align: left; - text-align: start; +h1, h2, h3, h4, h5, h6{ + font-family:var(--RS__baseFontFamily); + text-align:left; + text-align:start; } -/* Flow content */ - -blockquote, -figure, -p, -pre, -aside, -footer, -form, -hr { - margin-top: var(--RS__flowSpacing); - margin-bottom: var(--RS__flowSpacing); +blockquote, figure, p, pre, +aside, footer, form, hr{ + margin-top:var(--RS__flowSpacing); + margin-bottom:var(--RS__flowSpacing); } -p { - margin-top: var(--RS__paraSpacing); - margin-bottom: var(--RS__paraSpacing); - text-indent: var(--RS__paraIndent); +p{ + margin-top:var(--RS__paraSpacing); + margin-bottom:var(--RS__paraSpacing); + text-indent:var(--RS__paraIndent); } -pre { - font-family: var(--RS__codeFontFamily); +pre{ + font-family:var(--RS__codeFontFamily); } -/* Phrasing content */ - -code, kbd, samp, tt { - font-family: var(--RS__codeFontFamily); +code, kbd, samp, tt{ + font-family:var(--RS__codeFontFamily); } -sub, sup { - position: relative; - font-size: 67.5%; - line-height: 1; +sub, sup{ + position:relative; + font-size:67.5%; + line-height:1; } -sub { - bottom: -0.2ex; +sub{ + bottom:-0.2ex; } -sup { - bottom: 0; +sup{ + bottom:0; } -em { - -webkit-text-emphasis: dot; - -epub-text-emphasis: dot; - text-emphasis: dot; +em{ + -webkit-text-emphasis:dot; + -epub-text-emphasis:dot; + text-emphasis:dot; } -:link { - color: var(--RS__linkColor); +:link{ + color:var(--RS__linkColor); } -:visited { - color: var(--RS__visitedColor); +:visited{ + color:var(--RS__visitedColor); } -/* Headings */ - -h1 { - margin-top: calc(var(--RS__flowSpacing) * 2); - margin-bottom: calc(var(--RS__flowSpacing) * 2); - /* The following is base font size * typescale power of 3 */ - font-size: calc(((1em * var(--RS__typeScale)) * var(--RS__typeScale)) * var(--RS__typeScale)); - text-align: center; +h1{ + margin-top:calc(var(--RS__flowSpacing) * 2); + margin-bottom:calc(var(--RS__flowSpacing) * 2); + font-size:calc(((1em * var(--RS__typeScale)) * var(--RS__typeScale)) * var(--RS__typeScale)); + text-align:center; } -h2 { - margin-top: calc(var(--RS__flowSpacing) * 2); - margin-bottom: var(--RS__flowSpacing); - /* The following is base font size * typescale power of 2 */ - font-size: calc((1em * var(--RS__typeScale)) * var(--RS__typeScale)); - text-align: center; +h2{ + margin-top:calc(var(--RS__flowSpacing) * 2); + margin-bottom:var(--RS__flowSpacing); + font-size:calc((1em * var(--RS__typeScale)) * var(--RS__typeScale)); + text-align:center; } -h3 { - margin-top: var(--RS__flowSpacing); - margin-bottom: var(--RS__flowSpacing); - font-size: calc(1em * var(--RS__typeScale)); - text-align: center; +h3{ + margin-top:var(--RS__flowSpacing); + margin-bottom:var(--RS__flowSpacing); + font-size:calc(1em * var(--RS__typeScale)); + text-align:center; } -h4 { - margin-top: var(--RS__flowSpacing); - margin-bottom: var(--RS__flowSpacing); - font-family: var(--RS__compFontFamily); - font-size: 1em; +h4{ + margin-top:var(--RS__flowSpacing); + margin-bottom:var(--RS__flowSpacing); + font-family:var(--RS__compFontFamily); + font-size:1em; } -h5 { - margin-top: var(--RS__flowSpacing); - margin-bottom: var(--RS__flowSpacing); - font-family: var(--RS__compFontFamily); - font-size: smaller; +h5{ + margin-top:var(--RS__flowSpacing); + margin-bottom:var(--RS__flowSpacing); + font-family:var(--RS__compFontFamily); + font-size:smaller; } -h6 { - margin-top: var(--RS__flowSpacing); - margin-bottom: 0; - font-family: var(--RS__compFontFamily); - font-size: smaller; - font-weight: normal; +h6{ + margin-top:var(--RS__flowSpacing); + margin-bottom:0; + font-family:var(--RS__compFontFamily); + font-size:smaller; + font-weight:normal; } -/* Lists */ - -dl, ol, ul { - margin-top: var(--RS__flowSpacing); - margin-bottom: var(--RS__flowSpacing); +dl, ol, ul{ + margin-top:var(--RS__flowSpacing); + margin-bottom:var(--RS__flowSpacing); } -/* Table */ - -table { - margin: var(--RS__flowSpacing) 0; - border: 1px solid currentColor; - border-collapse: collapse; - empty-cells: show; +table{ + margin:var(--RS__flowSpacing) 0; + border:1px solid currentcolor; + border-collapse:collapse; + empty-cells:show; } -thead, tbody, tfoot, table > tr { - vertical-align: top; +thead, tbody, tfoot, table > tr{ + vertical-align:top; } -th { - text-align: left; +th{ + text-align:left; } -th, td { - padding: 4px; - border: 1px solid currentColor; -} -/*# sourceMappingURL=ReadiumCSS-default.css.map */ \ No newline at end of file +th, td{ + padding:4px; + border:1px solid currentcolor; +} \ No newline at end of file diff --git a/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-vertical/ReadiumCSS-after.css b/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-vertical/ReadiumCSS-after.css index d60d264dca..5b8d2e2749 100644 --- a/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-vertical/ReadiumCSS-after.css +++ b/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-vertical/ReadiumCSS-after.css @@ -1,680 +1,472 @@ -/* Readium CSS - Config module - - A file allowing implementers to customize flags for reading modes, - user settings, etc. - - Repo: https://github.com/readium/readium-css */ - -/* Custom medias - Syntax: @custom-media --variable (prop: value) */ - -/* Responsive columns - The minimum width for which responsive columns (2 -> 1 and vice versa, - depending on the current font-size) must be enabled */ - -/* Mobile columns - The minimum and maximum width for mobile devices. - We’re forcing the landscape orientation by default, - and must still investigate large tablets (iPad Pro, Surface Pro 3, etc.). */ - -/* Custom selectors - Syntax: @custom-selector :--variable selector - The selectors you will use for flags/switches - You can alternatively use classes or custom data-* attributes */ - -/* User view = paged | scrolled */ - -/* Font-family override */ - -/* Advanced settings */ - -/* Reading Modes */ - -/* Filters (images) */ - -/* Accessibility normalization */ - -/* Accessibility font. You can add selectors, using “, ” as a separator, if you have multiple fonts */ - -/* Direction i.e. ltr and rtl */ - -/* Readium CSS - Namespaces module - - Namespaces to import in all 3 dist stylesheets - - Repo: https://github.com/readium/readium-css */ +/*! + * Readium CSS v.2.0.5 + * Copyright (c) 2017–2026. 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 + */ @namespace url("http://www.w3.org/1999/xhtml"); @namespace epub url("http://www.idpf.org/2007/ops"); -@namespace m url("http://www.w3.org/1998/Math/MathML/"); +@namespace m url("http://www.w3.org/1998/Math/MathML"); @namespace svg url("http://www.w3.org/2000/svg"); -/* Readium CSS - Pagination module for vertical writing - - A set of styles to paginate ePublications in “writing-mode: vertical-*” - - Repo: https://github.com/readium/readium-css */ +:root{ -/* Config */ + --RS__viewportWidth:100%; -/* We must simplify the pagination model for vertical writing, and can’t fake spreads. */ + --RS__pageGutter:0; -/* Default for smartphone portrait (small screens) */ + --RS__defaultLineLength:100%; -:root { - /* The column will be the height of the web view/iframe */ - --RS__colWidth: 100vh; + --RS__colGap:0; - /* Since columns are laid out on the y-axis in vertical-*, we can only use 1 */ - --RS__colCount: 1; + --RS__colCount:1; - /* Gap between columns (in pixels so that it won’t resize with font-size) */ - --RS__colGap: 0; - - /* Optimal line-length (rem will take :root font-size into account, whatever the body’s font-size) */ - --RS__maxLineLength: 40rem; - - /* Default page vertical margins (in pixels so that it won’t resize with font-size) */ - --RS__pageGutter: 20px; /* See if colGap and pageGutter can be the same var */ + --RS__colWidth:100vw; } -/* Reset page margins for Forward compatibility */ - -@page { - margin: 0 !important; +@page{ + margin:0 !important; } -/* :root selector has same specificity as a class i.e. 0010 - We might have to change that to html / context - -> https://css-tricks.com/almanac/selectors/r/root/ */ - -:root { - - /* In case you use left position to scroll, can be removed if using transform: translateX() */ - position: relative; - - -webkit-column-width: var(--RS__colWidth); - -moz-column-width: var(--RS__colWidth); - column-width: var(--RS__colWidth); - - /* Init pagination */ - /* TODO: document columns’ logic cos it might feel weird at first */ - -webkit-column-count: var(--RS__colCount); - -moz-column-count: var(--RS__colCount); - column-count: var(--RS__colCount); - - -webkit-column-gap: var(--RS__colGap); - -moz-column-gap: var(--RS__colGap); - column-gap: var(--RS__colGap); - - /* Default is balance and we want columns to be filled entirely (100vh) */ - -moz-column-fill: auto; - column-fill: auto; - width: 100%; - height: 100vh; - max-width: 100%; - max-height: 100vh; - min-width: 100%; - min-height: 100vh; - padding: 0 var(--RS__pageGutter) !important; - margin: 0 !important; - - /* Column size will depend on this if we want to make it responsive */ - font-size: 100% !important; +:root{ + position:relative; - -webkit-text-size-adjust: 100%; + -webkit-column-width:var(--RS__colWidth); + -moz-column-width:var(--RS__colWidth); + column-width:var(--RS__colWidth); + -webkit-column-count:var(--RS__colCount); + -moz-column-count:var(--RS__colCount); + column-count:var(--RS__colCount); - /* Switch to newer box model (not inherited by authors’ styles) */ - box-sizing: border-box; + -webkit-column-gap:var(--RS__colGap); + -moz-column-gap:var(--RS__colGap); + column-gap:var(--RS__colGap); + -moz-column-fill:auto; + column-fill:auto; + width:100%; + height:100vh; + max-width:100%; + max-height:100vh; + min-width:100%; + min-height:100vh; + padding:0 !important; + margin:0 !important; + font-size:1rem !important; + box-sizing:border-box; - hanging-punctuation: last allow-end; - - /* Fix bug for older Chrome */ - -webkit-perspective: 1; - /* Prevents options pop-up when long tap in webkit */ - -webkit-touch-callout: none; - - /* The reason why we don’t force -webkit-column-axis is that it switches the column-box model to a paged overflow model. - In other words, columns become useless, the sizing of the :root itself will be used for pagination */ - - /* Ensure the correct writing-mode is used */ - -ms-writing-mode: tb-rl; - -webkit-writing-mode: vertical-rl; - writing-mode: vertical-rl; + hanging-punctuation:last allow-end; + -webkit-touch-callout:none; + -ms-writing-mode:tb-rl; + -webkit-writing-mode:vertical-rl; + writing-mode:vertical-rl; } -:root:lang(mn-Mong) { - /* Ensure the correct writing-mode is used for mongolian if vertical */ - -ms-writing-mode: tb; - -webkit-writing-mode: vertical-lr; - writing-mode: vertical-lr; +:root:lang(mn-Mong){ + -ms-writing-mode:tb; + -webkit-writing-mode:vertical-lr; + writing-mode:vertical-lr; } -body { - /* overflow: hidden; bugfix: contents won’t paginate in Firefox and one sample in Safari */ - width: 100%; - - /* Limit line-length but we have to reset when 2 columns and control the viewport. - By using max-width + margin auto, margins will shrink when font-size increases, - which is what would be expected in terms of typography. */ - max-height: var(--RS__maxLineLength) !important; - padding: var(--RS__pageGutter) 0 !important; - margin: auto 0 !important; +body{ + width:100%; + max-height:var(--RS__defaultLineLength) !important; + margin:auto 0 !important; + box-sizing:border-box; +} - /* We need a minimum padding on body so that descandants/ascendants in italic/script are not cut-off. - Drawback: we have to use border-box so that it doesn’t screw the box model, - which means it impacts colWidth and max-width */ - box-sizing: border-box; +:root:not([style*="readium-scroll-on"]) body{ + padding:var(--RS__pageGutter) 0 !important; } -/* We’ll now redefine margins and columns depending on the minimum width available - The goal is having the simplest model possible and avoid targeting devices */ +:root:not([style*="readium-noOverflow-on"]) body{ + overflow:hidden; +} -/* Smartphone landscape */ +@supports (overflow: clip){ -@media screen and (min-width: 35em) { - :root { - --RS__pageGutter: 30px; + :root:not([style*="readium-noOverflow-on"]){ + overflow:clip; } -} -/* Tablet portrait */ - -@media screen and (min-width: 45em) { - :root { - --RS__pageGutter: 40px; + :root:not([style*="readium-noOverflow-on"]) body{ + overflow:clip; + overflow-clip-margin:content-box; } } -/* Desktop small + phablet + tablet landscape */ +:root[style*="readium-scroll-on"], +:root[style*="readium-noVerticalPagination-on"]{ + -webkit-columns:auto auto !important; + -moz-columns:auto auto !important; + columns:auto auto !important; + width:auto !important; + max-width:none !important; + max-height:100vh !important; + min-width:0 !important; +} -@media screen and (min-width: 60em) { - :root { - --RS__pageGutter: 50px; - } +:root[style*="readium-scroll-on"] body, +:root[style*="readium-noVerticalPagination-on"] body{ + max-width:var(--RS__defaultLineLength) !important; + box-sizing:border-box !important; } -/* Desktop + tablet large */ +@supports (overflow: clip){ -/* We get the previous settings, we just change the margins */ + :root[style*="readium-scroll-on"]:not([style*="readium-noOverflow-on"]){ + overflow:auto; + } -@media screen and (min-width: 75em) { - :root { - --RS__pageGutter: 60px; + :root[style*="readium-scroll-on"]:not([style*="readium-noOverflow-on"]) body{ + overflow:clip; } } -/* At this point (80em or so), constraining line length must be done at the web view/iframe level, or by limiting the size of :root itself */ - -/* Readium CSS - Scroll module for vertical-writing - - A set of styles to scroll ePublications in “writing-mode: vertical-*” - This module overrides pagination - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-scroll-on"] { - - /* Reset columns, auto + auto = columns can’t be created */ - /* There is a weird gap in Safari/Webkit, as if overflow paged-x… */ - -webkit-columns: auto auto !important; - -moz-columns: auto auto !important; - columns: auto auto !important; - width: auto !important; - max-width: none !important; - max-height: 100vh !important; - /* Reset html size so that the user can scroll */ - min-width: 0 !important; +:root[style*="readium-scroll-on"][style*="--RS__scrollPaddingTop"] body{ + padding-top:var(--RS__scrollPaddingTop) !important; } -/* Make sure line-length is limited in all configs */ - -:root[style*="readium-scroll-on"] body { - --RS__maxLineLength: 40.01rem !important; /* Fixes fragmentation update issues in Webkit i.e. value must be slightly different than the one for pagination */ +:root[style*="readium-scroll-on"][style*="--RS__scrollPaddingBottom"] body{ + padding-bottom:var(--RS__scrollPaddingBottom) !important; } -/* Scroll mode horizontal */ - -/* Do we add a top/bottom margin for body in vertical scroll or not? */ - -/* Readium CSS - Night mode - - A preset theme for night mode - - Repo: https://github.com/readium/readium-css */ - -/* CONFIG */ - -/* [style*="--USER__appearance"] can be used to increase specificity but performance hit */ - -:root[style*="readium-night-on"] { - --RS__backgroundColor: #000000; - --RS__textColor: #FEFEFE; - - --RS__linkColor: #63caff; - --RS__visitedColor: #0099E5; - - /* This can be customized but initial will re-use default value of the browser */ - --RS__selectionBackgroundColor: #b4d8fe; - --RS__selectionTextColor: inherit; +:root[style*="readium-scroll-on"][style*="--RS__scrollPaddingLeft"] body{ + padding-left:var(--RS__scrollPaddingLeft) !important; } -/* we don’t need to redeclare bg-color and color for :root since we will inherit and update from day/default mode */ - -:root[style*="readium-night-on"] *:not(a) { - color: inherit !important; - background-color: transparent !important; - border-color: currentColor !important; +:root[style*="readium-scroll-on"][style*="--RS__scrollPaddingRight"] body{ + padding-right:var(--RS__scrollPaddingRight) !important; } -:root[style*="readium-night-on"] svg text { - fill: currentColor !important; - stroke: none !important; +:root[style*="--USER__backgroundColor"]{ + background-color:var(--USER__backgroundColor) !important; } -:root[style*="readium-night-on"] a:link, -:root[style*="readium-night-on"] a:link * { - color: var(--RS__linkColor) !important; +:root[style*="--USER__backgroundColor"] *{ + background-color:transparent !important; } -:root[style*="readium-night-on"] a:visited, -:root[style*="readium-night-on"] a:visited * { - color: var(--RS__visitedColor) !important; +:root[style*="--USER__textColor"]{ + color:var(--USER__textColor) !important; } -/* For epub:type, in case the contents are served as text/html, namespaces won’t work hence why we’re using both syntax */ - -:root[style*="readium-night-on"] img[class*="gaiji"], -:root[style*="readium-night-on"] *[epub\:type~="titlepage"] img:only-child, -:root[style*="readium-night-on"] *[epub|type~="titlepage"] img:only-child { - -webkit-filter: invert(100%); - filter: invert(100%); +:root[style*="--USER__textColor"] *:not(a){ + color:inherit !important; + background-color:transparent !important; + border-color:currentcolor !important; } -/* Darken all images on user’s demand */ - -:root[style*="readium-night-on"][style*="readium-darken-on"] img { - -webkit-filter: brightness(80%); - filter: brightness(80%); +:root[style*="--USER__textColor"] svg text{ + fill:currentcolor !important; + stroke:none !important; } -/* Invert all images on user’s demand */ - -:root[style*="readium-night-on"][style*="readium-invert-on"] img { - -webkit-filter: invert(100%); - filter: invert(100%); +:root[style*="--USER__linkColor"] a:link, +:root[style*="--USER__linkColor"] a:link *{ + color:var(--USER__linkColor) !important; } -/* Darken and invert on user’s demand */ - -:root[style*="readium-night-on"][style*="readium-darken-on"][style*="readium-invert-on"] img { - -webkit-filter: brightness(80%) invert(100%); - filter: brightness(80%) invert(100%); +:root[style*="--USER__visitedColor"] a:visited, +:root[style*="--USER__visitedColor"] a:visited *{ + color:var(--USER__visitedColor) !important; } -/* Readium CSS - Sepia mode - - A preset theme for sepia mode - - Repo: https://github.com/readium/readium-css */ - -/* CONFIG */ - -:root[style*="readium-sepia-on"] { - --RS__backgroundColor: #faf4e8; - --RS__textColor: #121212; - - --RS__linkColor: #0000EE; - --RS__visitedColor: #551A8B; - - /* This can be customized but initial will re-use default value of the browser */ - --RS__selectionBackgroundColor: #b4d8fe; - --RS__selectionTextColor: inherit; +:root[style*="--USER__selectionBackgroundColor"][style*="--USER__selectionTextColor"] ::-moz-selection{ + color:var(--USER__selectionTextColor) !important; + background-color:var(--USER__selectionBackgroundColor) !important; +} - --RS__maxLineLength: 40.01rem; /* Forcing a reflow in Blink/Webkit so that blend mode can work */ +:root[style*="--USER__selectionBackgroundColor"][style*="--USER__selectionTextColor"] ::selection{ + color:var(--USER__selectionTextColor) !important; + background-color:var(--USER__selectionBackgroundColor) !important; } -/* we don’t need to redeclare bg-color and color for :root since we will inherit and update from day/default mode */ +:root[style*="--USER__lineLength"] body{ + max-height:var(--USER__lineLength) !important; + } -:root[style*="readium-sepia-on"] *:not(a) { - color: inherit !important; - background-color: transparent !important; +:root[style*="--USER__fontFamily"]{ + font-family:var(--USER__fontFamily) !important; } -:root[style*="readium-sepia-on"] a:link, -:root[style*="readium-sepia-on"] a:link * { - color: var(--RS__linkColor); +:root[style*="--USER__fontFamily"] *{ + font-family:revert !important; } -:root[style*="readium-sepia-on"] a:visited, -:root[style*="readium-sepia-on"] a:visited * { - color: var(--RS__visitedColor); +:root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] body{ + zoom:var(--USER__fontSize) !important; } -:root[style*="readium-sepia-on"] svg, -:root[style*="readium-sepia-on"] img { - /* Make sure the proper bg-color is used for the blend mode */ - background-color: transparent !important; - mix-blend-mode: multiply; +:root:not([style*="readium-deprecatedFontSize-on"])[style*="readium-iOSPatch-on"][style*="--USER__fontSize"] body{ + -webkit-text-size-adjust:var(--USER__fontSize) !important; } -/* Readium CSS - OS Accessibility Modes - - A stylesheet to deal with OS accessibility settings +@supports selector(figure:has(> img)){ - Repo: https://github.com/readium/readium-css */ - -/* Windows high contrast colors are mapped to CSS system color keywords - See http://www.gwhitworth.com/blog/2017/04/how-to-use-ms-high-contrast */ - -@media screen and (-ms-high-contrast: active) { - :root { - color: windowText !important; - background-color: window !important; + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> img), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> video), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> svg), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> canvas), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> iframe), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> audio), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> img:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> video:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> svg:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> canvas:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> iframe:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> audio:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] table{ + zoom:calc(100% / var(--USER__fontSize)) !important; } - /* The following selectors are super funky but it makes sure everything is inherited, this is indeed critical for this mode */ - :root :not(#\#):not(#\#):not(#\#), - :root :not(#\#):not(#\#):not(#\#) :not(#\#):not(#\#):not(#\#) - :root :not(#\#):not(#\#):not(#\#) :not(#\#):not(#\#):not(#\#) :not(#\#):not(#\#):not(#\#) { - color: inherit !important; - background-color: inherit !important; - } - - .readiumCSS-mo-active-default { - color: highlightText !important; - background-color: highlight !important; - } - - /* For links, hyperlink keyword is automatically set */ - - /* Should we also set user highlights? */ -} - -@media screen and (-ms-high-contrast: white-on-black) { - :root[style*="readium-night-on"] img[class*="gaiji"], - :root[style*="readium-night-on"] *[epub\:type~="titlepage"] img:only-child, - :root[style*="readium-night-on"] *[epub|type~="titlepage"] img:only-child { - -webkit-filter: none !important; - filter: none !important; - } - :root[style*="readium-night-on"][style*="readium-invert-on"] img { - -webkit-filter: none !important; - filter: none !important; - } - :root[style*="readium-night-on"][style*="readium-darken-on"][style*="readium-invert-on"] img { - -webkit-filter: brightness(80%); - filter: brightness(80%); + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figcaption, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] caption, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] td, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] th{ + zoom:var(--USER__fontSize) !important; } } -/* Will be true on recent versions of iOS and MacOS if inverted setting enabled by the user */ +@supports not (zoom: 1){ -@media screen and (inverted-colors) { - :root[style*="readium-night-on"] img[class*="gaiji"], - :root[style*="readium-night-on"] *[epub\:type~="titlepage"] img:only-child, - :root[style*="readium-night-on"] *[epub|type~="titlepage"] img:only-child { - -webkit-filter: none !important; - filter: none !important; - } - :root[style*="readium-night-on"][style*="readium-invert-on"] img { - -webkit-filter: none !important; - filter: none !important; - } - :root[style*="readium-night-on"][style*="readium-darken-on"][style*="readium-invert-on"] img { - -webkit-filter: brightness(80%); - filter: brightness(80%); + :root[style*="--USER__fontSize"]{ + font-size:var(--USER__fontSize) !important; } } -@media screen and (monochrome) { - /* Grayscale (Implemented in Safari, what about eInk?) */ - /* Must deal with anything color (contrast) so must be managed at the night/sepia/theme level :( */ +:root[style*="readium-deprecatedFontSize-on"][style*="--USER__fontSize"]{ + font-size:var(--USER__fontSize) !important; } -@media screen and (prefers-reduced-motion) { - /* If reduced motion is set on MacOS, in case we have animation/transition */ +:root[style*="--USER__lineHeight"]{ + line-height:var(--USER__lineHeight) !important; } -/* Readium CSS - Page margins pref - - A submodule managing page margins for user settings - Part of “Chrome Advanced” class – no flag required. - - Repo: https://github.com/readium/readium-css */ - -/* Page Margins: the user margin is a factor of the page gutter e.g. 0.5, 0.75, 1, 1.25, 1.5, etc. */ - -:root[style*="--USER__pageMargins"] body { - padding: calc(var(--RS__pageGutter) * var(--USER__pageMargins)) 0 !important; +:root[style*="--USER__lineHeight"] body, +:root[style*="--USER__lineHeight"] p, +:root[style*="--USER__lineHeight"] li, +:root[style*="--USER__lineHeight"] div{ + line-height:var(--USER__lineHeight) !important; } -/* Readium CSS - Custom colors pref - - A submodule managing custom colors for user settings - Part of “Chrome Advanced” class – no flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="--USER__backgroundColor"] { - background-color: var(--USER__backgroundColor) !important; +:root[style*="--USER__paraSpacing"] p{ + margin-right:var(--USER__paraSpacing) !important; + margin-left:var(--USER__paraSpacing) !important; } -:root[style*="--USER__backgroundColor"] * { - background-color: transparent !important; +:root[style*="--USER__fontWeight"] body{ + font-weight:var(--USER__fontWeight) !important; } -:root[style*="--USER__textColor"] { - color: var(--USER__textColor) !important; +:root[style*="--USER__fontWeight"] b, +:root[style*="--USER__fontWeight"] strong{ + font-weight:bolder; } -:root[style*="--USER__textColor"] *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(pre) { - color: inherit !important; +:root[style*="--USER__fontWidth"] body{ + font-stretch:var(--USER__fontWidth) !important; } -/* Readium CSS - Font Family pref - - A submodule managing font-family for user settings - Part of “User Overrides” class – “font override” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-font-on"][style*="--USER__fontFamily"] { - font-family: var(--USER__fontFamily) !important; +:root[style*="--USER__fontOpticalSizing"] body{ + font-optical-sizing:var(--USER__fontOpticalSizing) !important; } -:root[style*="readium-font-on"][style*="--USER__fontFamily"] body, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] p, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] li, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] div, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] dt, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] dd { - font-family: inherit !important; +: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) !important; + font-variant:none !important; } -:root[style*="readium-font-on"][style*="--USER__fontFamily"] i:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] i:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] em:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] em:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] cite:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] cite:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] b:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] b:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] strong:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] strong:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] span:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] span:not([xml\:lang]) { - font-family: inherit !important; +:root[style*="readium-noRuby-on"] body rt, +:root[style*="readium-noRuby-on"] body rp{ + display:none; } -/* Readium CSS - Font size pref - - A submodule managing font-size for user settings - Part of “User Overrides” class – no flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="--USER__fontSize"] { - font-size: var(--USER__fontSize) !important; +:root[style*="readium-blend-on"] svg, +:root[style*="readium-blend-on"] img{ + background-color:transparent !important; + mix-blend-mode:multiply !important; } -/* Readium CSS - Line height pref - - A submodule managing line-height for user settings - Part of “User Overrides Advanced” class – “advanced settings” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] { - line-height: var(--USER__lineHeight) !important; +:root[style*="--USER__darkenImages"] img{ + -webkit-filter:brightness(var(--USER__darkenImages)) !important; + filter:brightness(var(--USER__darkenImages)) !important; } -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] body, -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] p, -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] li, -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] div { - line-height: inherit; +:root[style*="readium-darken-on"] img{ + -webkit-filter:brightness(80%) !important; + filter:brightness(80%) !important; } -/* Readium CSS - Para spacing pref - - A submodule managing paragraphs’ top and bottom margins for user settings - Part of “User Overrides Advanced” class – “advanced settings” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-advanced-on"][style*="--USER__paraSpacing"] p { - margin-right: var(--USER__paraSpacing) !important; - margin-left: var(--USER__paraSpacing) !important; +:root[style*="--USER__invertImages"] img{ + -webkit-filter:invert(var(--USER__invertImages)) !important; + filter:invert(var(--USER__invertImages)) !important; } -/* Readium CSS - Font size normalize - - A stylesheet to normalize font-size - - Repo: https://github.com/readium/readium-css */ - -/* STYLES */ - -/* :root is used so that you can quickly add a class or attribute if you prefer e.g. `:root[data-rs-normalize]` */ - -/* We create a default so that you don’t need to explicitly set one in the DOM. - Once the “Publisher’s styles” checkbox is unchecked, the normalize is applied automatically */ - -:root[style*="readium-advanced-on"] { - --USER__typeScale: 1.2; /* This is the default type scale you’ll find in most publications */ +:root[style*="readium-invert-on"] img{ + -webkit-filter:invert(100%) !important; + filter:invert(100%) !important; } -:root[style*="readium-advanced-on"] p, -:root[style*="readium-advanced-on"] li, -:root[style*="readium-advanced-on"] div, -:root[style*="readium-advanced-on"] pre, -:root[style*="readium-advanced-on"] dd { - font-size: 1rem !important; +:root[style*="--USER__darkenImages"][style*="--USER__invertImages"] img{ + -webkit-filter:brightness(var(--USER__darkenImages)) invert(var(--USER__invertImages)) !important; + filter:brightness(var(--USER__darkenImages)) invert(var(--USER__invertImages)) !important; } -:root[style*="readium-advanced-on"] h1 { - /* Fallback if browser doesn’t support vars */ - font-size: 1.75rem !important; - font-size: calc(((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) * var(--USER__typeScale)) !important; +:root[style*="readium-darken-on"][style*="--USER__invertImages"] img{ + -webkit-filter:brightness(80%) invert(var(--USER__invertImages)) !important; + filter:brightness(80%) invert(var(--USER__invertImages)) !important; } -:root[style*="readium-advanced-on"] h2 { - /* Fallback if browser doesn’t support vars */ - font-size: 1.5rem !important; - font-size: calc((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) !important; +:root[style*="--USER__darkenImages"][style*="readium-invert-on"] img{ + -webkit-filter:brightness(var(--USER__darkenImages)) invert(100%) !important; + filter:brightness(var(--USER__darkenImages)) invert(100%) !important; } -:root[style*="readium-advanced-on"] h3 { - /* Fallback if browser doesn’t support vars */ - font-size: 1.25rem !important; - font-size: calc(1rem * var(--USER__typeScale)) !important; +:root[style*="readium-darken-on"][style*="readium-invert-on"] img{ + -webkit-filter:brightness(80%) invert(100%) !important; + filter:brightness(80%) invert(100%) !important; } -:root[style*="readium-advanced-on"] h4, -:root[style*="readium-advanced-on"] h5, -:root[style*="readium-advanced-on"] h6 { - font-size: 1rem !important; +:root[style*="--USER__invertGaiji"] img[class*="gaiji"]{ + -webkit-filter:invert(var(--USER__invertGaiji)) !important; + filter:invert(var(--USER__invertGaiji)) !important; } -:root[style*="readium-advanced-on"] small { - font-size: smaller !important; +:root[style*="readium-invertGaiji-on"] img[class*="gaiji"]{ + -webkit-filter:invert(100%) !important; + filter:invert(100%) !important; } -:root[style*="readium-advanced-on"] sub, -:root[style*="readium-advanced-on"] sup { - font-size: 67.5% !important; +:root[style*="readium-normalize-on"]{ + --USER__typeScale:1.2; } -/* The following styles kick in if you define the typeScale variable in the DOM. - No need to repeat declarations which don’t make use of the variable */ - -:root[style*="readium-advanced-on"][style*="--USER__typeScale"] h1 { - font-size: calc(((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) * var(--USER__typeScale)) !important; +:root[style*="readium-normalize-on"] p, +:root[style*="readium-normalize-on"] li, +:root[style*="readium-normalize-on"] div, +:root[style*="readium-normalize-on"] pre, +:root[style*="readium-normalize-on"] dd{ + font-size:1rem !important; } -:root[style*="readium-advanced-on"][style*="--USER__typeScale"] h2 { - font-size: calc((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) !important; +:root[style*="readium-normalize-on"] h1{ + font-size:1.75rem !important; + font-size:calc(((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) * var(--USER__typeScale)) !important; } -:root[style*="readium-advanced-on"][style*="--USER__typeScale"] h3 { - font-size: calc(1rem * var(--USER__typeScale)) !important; +:root[style*="readium-normalize-on"] h2{ + font-size:1.5rem !important; + font-size:calc((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) !important; } -/* Readium CSS - Default highlights +:root[style*="readium-normalize-on"] h3{ + font-size:1.25rem !important; + font-size:calc(1rem * var(--USER__typeScale)) !important; +} - A stylesheet for user highlights +:root[style*="readium-normalize-on"] h4, +:root[style*="readium-normalize-on"] h5, +:root[style*="readium-normalize-on"] h6{ + font-size:1rem !important; +} - Repo: https://github.com/readium/readium-css */ +:root[style*="readium-normalize-on"] small{ + font-size:smaller !important; +} -/* User Highlights */ +:root[style*="readium-normalize-on"] sub, +:root[style*="readium-normalize-on"] sup{ + font-size:67.5% !important; +} -.readiumCSS-yellow-highlight, -:root[style*="readium-sepia-on"] .readiumCSS-yellow-highlight, -:root[style*="readium-night-on"] .readiumCSS-yellow-highlight { - background-color: rgba(255, 255, 0, 0.5) !important; +:root[style*="readium-normalize-on"][style*="--USER__typeScale"] h1{ + font-size:calc(((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) * var(--USER__typeScale)) !important; } -.readiumCSS-green-highlight, -:root[style*="readium-sepia-on"] .readiumCSS-green-highlight, -:root[style*="readium-night-on"] .readiumCSS-green-highlight { - background-color: rgba(0, 255, 0, 0.5) !important; +:root[style*="readium-normalize-on"][style*="--USER__typeScale"] h2{ + font-size:calc((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) !important; } -.readiumCSS-orange-highlight, -:root[style*="readium-sepia-on"] .readiumCSS-orange-highlight, -:root[style*="readium-night-on"] .readiumCSS-orange-highlight { - background-color: rgba(255, 165, 0, 0.5) !important; +:root[style*="readium-normalize-on"][style*="--USER__typeScale"] h3{ + font-size:calc(1rem * var(--USER__typeScale)) !important; } -.readiumCSS-pink-highlight, -:root[style*="readium-sepia-on"] .readiumCSS-pink-highlight, -:root[style*="readium-night-on"] .readiumCSS-pink-highlight { - background-color: rgba(255, 105, 180, 0.5) !important; +:root[style*="readium-iPadOSPatch-on"] body{ + -webkit-text-size-adjust:none; } -/* Media overlays */ +: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; +} -.readiumCSS-mo-active-default { - color: black !important; - background-color: yellow !important; +: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; } -/*# sourceMappingURL=ReadiumCSS-after.css.map */ \ No newline at end of file + +: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/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-vertical/ReadiumCSS-before.css b/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-vertical/ReadiumCSS-before.css index 2c8d03df4c..b6708f486b 100644 --- a/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-vertical/ReadiumCSS-before.css +++ b/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-vertical/ReadiumCSS-before.css @@ -1,614 +1,527 @@ -/* Readium CSS - Config module +/*! + * Readium CSS v.2.0.5 + * Copyright (c) 2017–2026. 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 + */ - A file allowing implementers to customize flags for reading modes, - user settings, etc. +@namespace url("http://www.w3.org/1999/xhtml"); - Repo: https://github.com/readium/readium-css */ +@namespace epub url("http://www.idpf.org/2007/ops"); -/* Custom medias - Syntax: @custom-media --variable (prop: value) */ +@namespace m url("http://www.w3.org/1998/Math/MathML"); -/* Responsive columns - The minimum width for which responsive columns (2 -> 1 and vice versa, - depending on the current font-size) must be enabled */ +@namespace svg url("http://www.w3.org/2000/svg"); -/* Mobile columns - The minimum and maximum width for mobile devices. - We’re forcing the landscape orientation by default, - and must still investigate large tablets (iPad Pro, Surface Pro 3, etc.). */ +@-ms-viewport{ + width:device-width; +} -/* Custom selectors - Syntax: @custom-selector :--variable selector - The selectors you will use for flags/switches - You can alternatively use classes or custom data-* attributes */ +@viewport{ + width:device-width; + zoom:1; +} -/* User view = paged | scrolled */ +:root{ -/* Font-family override */ + --RS__sans-serif-ja-v:'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ W3', 'YuGothic', 'Yu Gothic Medium', 'BIZ UDGothic', 'Yu Gothic', 'ＭＳゴシック', 'MS Gothic', sans-serif; -/* Advanced settings */ + --RS__serif-ja-v:'Hiragino Mincho ProN', 'Hiragino Mincho Pro', 'YuMincho', 'BIZ UDMincho', 'Yu Mincho', 'ＭＳ明朝', 'MS Mincho', serif; -/* Reading Modes */ + --RS__sans-serif-ja:'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ W3', 'YuGothic', 'Yu Gothic Medium', 'BIZ UDPGothic', 'Yu Gothic', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; -/* Filters (images) */ + --RS__serif-ja:'Hiragino Mincho ProN', 'Hiragino Mincho Pro', 'YuMincho', 'BIZ UDPMincho', 'Yu Mincho', 'ＭＳ Ｐ明朝', 'MS PMincho', serif; -/* Accessibility normalization */ + --RS__monospaceTf:ui-monospace, 'Andale Mono', 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; -/* Accessibility font. You can add selectors, using “, ” as a separator, if you have multiple fonts */ + --RS__humanistTf:Seravek, Calibri, 'Gill Sans Nova', Roboto, Ubuntu, 'DejaVu Sans', source-sans-pro, sans-serif; -/* Direction i.e. ltr and rtl */ + --RS__sansTf:-ui-sans-serif, -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI Variable', 'Segoe UI', Inter, Roboto, 'Helvetica Neue', 'Arial Nova', 'Liberation Sans', Arial, sans-serif; -/* Readium CSS - Namespaces module + --RS__modernTf:Athelas, Constantia, Charter, 'Bitstream Charter', Cambria, 'Georgia Pro', Georgia, serif; - Namespaces to import in all 3 dist stylesheets + --RS__oldStyleTf:'Iowan Old Style', Sitka, 'Sitka Text', Palatino, 'Book Antiqua', 'URW Palladio L', P052, serif; - Repo: https://github.com/readium/readium-css */ + --RS__zh-HK-lineHeightCompensation:1.167; -@namespace url("http://www.w3.org/1999/xhtml"); + --RS__zh-HK-baseFontFamily:'方體', 'PingFang HK', '方體', 'PingFang TC', '黑體', 'Heiti TC', 'Microsoft JhengHei UI', 'Microsoft JhengHei', Roboto, Noto, 'Noto Sans CJK TC', sans-serif; -@namespace epub url("http://www.idpf.org/2007/ops"); + --RS__zh-TW-lineHeightCompensation:1.167; -@namespace m url("http://www.w3.org/1998/Math/MathML/"); + --RS__zh-TW-baseFontFamily:'方體', 'PingFang TC', '黑體', 'Heiti TC', 'Microsoft JhengHei UI', 'Microsoft JhengHei', Roboto, Noto, 'Noto Sans CJK TC', sans-serif; -@namespace svg url("http://www.w3.org/2000/svg"); + --RS__zh-Hant-lineHeightCompensation:1.167; -/* Readium CSS - Base module + --RS__zh-Hant-baseFontFamily:'方體', 'PingFang TC', '黑體', 'Heiti TC', 'Microsoft JhengHei UI', 'Microsoft JhengHei', Roboto, Noto, 'Noto Sans CJK TC', sans-serif; - A minimal stylesheet for all ebooks + --RS__zh-lineHeightCompensation:1.167; - Repo: https://github.com/readium/readium-css */ + --RS__zh-baseFontFamily:'方体', 'PingFang SC', '黑体', 'Heiti SC', 'Microsoft JhengHei UI', 'Microsoft JhengHei', Roboto, Noto, 'Noto Sans CJK SC', sans-serif; -/* Define viewport, HTML5-style */ + --RS__th-lineHeightCompensation:1.067; -@-ms-viewport { - width: device-width; -} + --RS__th-baseFontFamily:Thonburi, 'Leelawadee UI', 'Cordia New', Roboto, Noto, 'Noto Sans Thai', sans-serif; -@viewport { - width: device-width; - zoom: 1; -} + --RS__te-baseFontFamily:'Kohinoor Telugu', 'Telugu Sangam MN', 'Nirmala UI', Gautami, Roboto, Noto, 'Noto Sans Telugu', sans-serif; -:root { - /* Default font-stacks */ - --RS__oldStyleTf: "Iowan Old Style", "Sitka Text", Palatino, "Book Antiqua", serif; - --RS__modernTf: Athelas, Constantia, Georgia, serif; - --RS__sansTf: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; - --RS__humanistTf: Seravek, Calibri, Roboto, Arial, sans-serif; - --RS__monospaceTf: "Andale Mono", Consolas, monospace; + --RS__ta-lineHeightCompensation:1.067; - /* Config */ - --RS__baseFontFamily: var(--RS__oldStyleTf); + --RS__ta-baseFontFamily:'Tamil Sangam MN', 'Nirmala UI', Latha, Roboto, Noto, 'Noto Sans Tamil', sans-serif; - /* For square-ish fonts (CJK, Indic, etc.), we must apply some compensation in dynamic leading. Default is 1 i.e. no compensation */ - --RS__lineHeightCompensation: 1; + --RS__si-lineHeightCompensation:1.167; - /* Dynamic leading based on typeface metrics + font-size setting */ - --RS__baseLineHeight: calc((1em + (2ex - 1ch) - ((1rem - 16px) * 0.1667)) * var(--RS__lineHeightCompensation)); -} + --RS__si-baseFontFamily:'Sinhala Sangam MN', 'Nirmala UI', 'Iskoola Pota', Roboto, Noto, 'Noto Sans Sinhala', sans-serif; -/* Set default font for the html doc, so that it can be overridden by the authors’s stylesheet */ + --RS__pa-lineHeightCompensation:1.1; -html { - font-family: var(--RS__baseFontFamily); - /* Fallback line-height */ - line-height: 1.6; /* Fits a little bit better for all languages than 1.5 */ - line-height: var(--RS__baseLineHeight); - text-rendering: optimizeLegibility; -} + --RS__pa-baseFontFamily:'Gurmukhi MN', 'Nirmala UI', Kartika, Roboto, Noto, 'Noto Sans Gurmukhi', sans-serif; -/* 1.5 being too loose with larger font-sizes, we reset headings to normal (which value is 1.125–1.375 for our font-stacks) */ + --RS__or-lineHeightCompensation:1.167; -h1, h2, h3 { - line-height: normal; -} + --RS__or-baseFontFamily:'Oriya Sangam MN', 'Nirmala UI', Kalinga, Roboto, Noto, 'Noto Sans Oriya', sans-serif; -:lang(ja), -:lang(zh), -:lang(ko) { - word-wrap: break-word; - -webkit-line-break: strict; - -epub-line-break: strict; - line-break: strict; -} + --RS__ml-lineHeightCompensation:1.067; -/* Set default font for Math */ + --RS__ml-baseFontFamily:'Malayalam Sangam MN', 'Nirmala UI', Kartika, Roboto, Noto, 'Noto Sans Malayalam', sans-serif; -math { - font-family: "Latin Modern Math", "STIX Two Math", "XITS Math", "STIX Math", "Libertinus Math", "TeX Gyre Termes Math", "TeX Gyre Bonum Math", "TeX Gyre Schola", "DejaVu Math TeX Gyre", "TeX Gyre Pagella Math", "Asana Math", "Cambria Math", "Lucida Bright Math", "Minion Math", STIXGeneral, STIXSizeOneSym, Symbol, "Times New Roman", serif; -} + --RS__lo-baseFontFamily:'Lao Sangam MN', 'Leelawadee UI', 'Lao UI', Roboto, Noto, 'Noto Sans Lao', sans-serif; -/* Language Overrides - That will only work if either html or body have a (xml:)lang attribute, not for inline overrides */ + --RS__ko-lineHeightCompensation:1.167; -:lang(am) { - --RS__baseFontFamily: Kefa, Nyala, Roboto, Noto, "Noto Sans Ethiopic", serif; - --RS__lineHeightCompensation: 1.167; -} + --RS__ko-baseFontFamily:'Nanum Gothic', 'Apple SD Gothic Neo', 'Malgun Gothic', Roboto, Noto, 'Noto Sans CJK KR', sans-serif; -:lang(ar) { - --RS__baseFontFamily: "Geeza Pro", "Arabic Typesetting", Roboto, Noto, "Noto Naskh Arabic", "Times New Roman", serif; -} + --RS__kn-lineHeightCompensation:1.1; -:lang(bn) { - --RS__baseFontFamily: "Kohinoor Bangla", "Bangla Sangam MN", Vrinda, Roboto, Noto, "Noto Sans Bengali", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__kn-baseFontFamily:'Kannada Sangam MN', 'Nirmala UI', Tunga, Roboto, Noto, 'Noto Sans Kannada', sans-serif; -:lang(bo) { - --RS__baseFontFamily: Kailasa, "Microsoft Himalaya", Roboto, Noto, "Noto Sans Tibetan", sans-serif; -} + --RS__km-lineHeightCompensation:1.067; -:lang(chr) { - --RS__baseFontFamily: "Plantagenet Cherokee", Roboto, Noto, "Noto Sans Cherokee"; - --RS__lineHeightCompensation: 1.167; -} + --RS__km-baseFontFamily:'Khmer Sangam MN', 'Leelawadee UI', 'Khmer UI', Roboto, Noto, 'Noto Sans Khmer', sans-serif; -:lang(fa) { - --RS__baseFontFamily: "Geeza Pro", "Arabic Typesetting", Roboto, Noto, "Noto Naskh Arabic", "Times New Roman", serif; -} + --RS__ja-lineHeightCompensation:1.167; -:lang(gu) { - --RS__baseFontFamily: "Gujarati Sangam MN", "Nirmala UI", Shruti, Roboto, Noto, "Noto Sans Gujarati", sans-serif; - --RS__lineHeightCompensation: 1.167; -} + --RS__ja-baseFontFamily:YuGothic, 'Hiragino Maru Gothic ProN', 'Hiragino Sans', 'Yu Gothic UI', 'Meiryo UI', 'MS Gothic', Roboto, Noto, 'Noto Sans CJK JP', sans-serif; -:lang(he) { - --RS__baseFontFamily: "New Peninim MT", "Arial Hebrew", Gisha, "Times New Roman", Roboto, Noto, "Noto Sans Hebrew" sans-serif; - --RS__lineHeightCompensation: 1.1; -} + --RS__iu-baseFontFamily:'Euphemia UCAS', Euphemia, Roboto, Noto, 'Noto Sans Canadian Aboriginal', sans-serif; -:lang(hi) { - --RS__baseFontFamily: "Kohinoor Devanagari", "Devanagari Sangam MN", Kokila, "Nirmala UI", Roboto, Noto, "Noto Sans Devanagari", sans-serif; + --RS__hy-baseFontFamily:Mshtakan, Sylfaen, Roboto, Noto, 'Noto Serif Armenian', serif; - --RS__lineHeightCompensation: 1.1; -} + --RS__hi-lineHeightCompensation:1.1; -:lang(hy) { - --RS__baseFontFamily: Mshtakan, Sylfaen, Roboto, Noto, "Noto Serif Armenian", serif; -} + --RS__hi-baseFontFamily:'Kohinoor Devanagari', 'Devanagari Sangam MN', Kokila, 'Nirmala UI', Roboto, Noto, 'Noto Sans Devanagari', sans-serif; -:lang(iu) { - --RS__baseFontFamily: "Euphemia UCAS", Euphemia, Roboto, Noto, "Noto Sans Canadian Aboriginal", sans-serif; -} + --RS__he-lineHeightCompensation:1.1; -:lang(ja) { - --RS__baseFontFamily: "游ゴシック体", YuGothic, "ヒラギノ丸ゴ", "Hiragino Sans", "Yu Gothic UI", "Meiryo UI", "MS Gothic", Roboto, Noto, "Noto Sans CJK JP", sans-serif; + --RS__he-baseFontFamily:'New Peninim MT', 'Arial Hebrew', Gisha, 'Times New Roman', Roboto, Noto, 'Noto Sans Hebrew', sans-serif; - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; + --RS__gu-lineHeightCompensation:1.167; - /* Extra variables for Japanese font-stacks as we may want to reuse them for user settings + default */ - --RS__serif-ja: "ＭＳ Ｐ明朝", "MS PMincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "游明朝", "YuMincho", "ＭＳ 明朝", "MS Mincho", "Hiragino Mincho ProN", serif; - --RS__sans-serif-ja: "ＭＳ Ｐゴシック", "MS PGothic", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", "Hiragino Sans GB", "ヒラギノ角ゴシック W3", "游ゴシック", "YuGothic", "ＭＳ ゴシック", "MS Gothic", "Hiragino Sans", sans-serif; - --RS__serif-ja-v: "ＭＳ 明朝", "MS Mincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho", "Hiragino Mincho ProN", serif; - --RS__sans-serif-ja-v: "ＭＳ ゴシック", "MS Gothic", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", "Hiragino Sans GB", "ヒラギノ角ゴシック W3", "游ゴシック", "YuGothic", "ＭＳ Ｐゴシック", "MS PGothic", "Hiragino Sans", sans-serif; -} + --RS__gu-baseFontFamily:'Gujarati Sangam MN', 'Nirmala UI', Shruti, Roboto, Noto, 'Noto Sans Gujarati', sans-serif; -:lang(km) { - --RS__baseFontFamily: "Khmer Sangam MN", "Leelawadee UI", "Khmer UI", Roboto, Noto, "Noto Sans Khmer", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__fa-baseFontFamily:'Geeza Pro', 'Arabic Typesetting', Roboto, Noto, 'Noto Naskh Arabic', 'Times New Roman', serif; -:lang(kn) { - --RS__baseFontFamily: "Kannada Sangam MN", "Nirmala UI", Tunga, Roboto, Noto, "Noto Sans Kannada", sans-serif; - --RS__lineHeightCompensation: 1.1; -} + --RS__chr-lineHeightCompensation:1.167; -:lang(ko) { - --RS__baseFontFamily: "Nanum Gothic", "Apple SD Gothic Neo", "Malgun Gothic", Roboto, Noto, "Noto Sans CJK KR", sans-serif; + --RS__chr-baseFontFamily:'Plantagenet Cherokee', Roboto, Noto, 'Noto Sans Cherokee'; - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; -} + --RS__bo-baseFontFamily:Kailasa, 'Microsoft Himalaya', Roboto, Noto, 'Noto Sans Tibetan', sans-serif; -:lang(lo) { - --RS__baseFontFamily: "Lao Sangam MN", "Leelawadee UI", "Lao UI", Roboto, Noto, "Noto Sans Lao", sans-serif; -} + --RS__bn-lineHeightCompensation:1.067; -:lang(ml) { - --RS__baseFontFamily: "Malayalam Sangam MN", "Nirmala UI", Kartika, Roboto, Noto, "Noto Sans Malayalam", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__bn-baseFontFamily:'Kohinoor Bangla', 'Bangla Sangam MN', Vrinda, Roboto, Noto, 'Noto Sans Bengali', sans-serif; -:lang(or) { - --RS__baseFontFamily: "Oriya Sangam MN", "Nirmala UI", Kalinga, Roboto, Noto, "Noto Sans Oriya", sans-serif; - --RS__lineHeightCompensation: 1.167; -} + --RS__ar-baseFontFamily:'Geeza Pro', 'Arabic Typesetting', Roboto, Noto, 'Noto Naskh Arabic', 'Times New Roman', serif; -:lang(pa) { - --RS__baseFontFamily: "Gurmukhi MN", "Nirmala UI", Kartika, Roboto, Noto, "Noto Sans Gurmukhi", sans-serif; - --RS__lineHeightCompensation: 1.1; -} + --RS__am-lineHeightCompensation:1.167; -:lang(si) { - --RS__baseFontFamily: "Sinhala Sangam MN", "Nirmala UI", "Iskoola Pota", Roboto, Noto, "Noto Sans Sinhala", sans-serif; - --RS__lineHeightCompensation: 1.167; -} + --RS__am-baseFontFamily:Kefa, Nyala, Roboto, Noto, 'Noto Sans Ethiopic', serif; -:lang(ta) { - --RS__baseFontFamily: "Tamil Sangam MN", "Nirmala UI", Latha, Roboto, Noto, "Noto Sans Tamil", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__latin-lineHeightCompensation:1; -:lang(te) { - --RS__baseFontFamily: "Kohinoor Telugu", "Telugu Sangam MN", "Nirmala UI", Gautami, Roboto, Noto, "Noto Sans Telugu", sans-serif; -} + --RS__latin-baseFontFamily:var(--RS__oldStyleTf); + --RS__baseFontFamily:var(--RS__latin-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__latin-lineHeightCompensation); + --RS__baseLineHeight:calc(1.5 * var(--RS__lineHeightCompensation)); -:lang(th) { - --RS__baseFontFamily: "Thonburi", "Leelawadee UI", "Cordia New", Roboto, Noto, "Noto Sans Thai", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__selectionTextColor:inherit; -/* The following will also work for zh-Hans */ + --RS__selectionBackgroundColor:#b4d8fe; -:lang(zh) { - --RS__baseFontFamily: "方体", "PingFang SC", "黑体", "Heiti SC", "Microsoft JhengHei UI", "Microsoft JhengHei", Roboto, Noto, "Noto Sans CJK SC", sans-serif; + --RS__visitedColor:#551A8B; - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; -} + --RS__linkColor:#0000EE; -:lang(zh-Hant), -:lang(zh-TW) { - --RS__baseFontFamily: "方體", "PingFang TC", "黑體", "Heiti TC", "Microsoft JhengHei UI", "Microsoft JhengHei", Roboto, Noto, "Noto Sans CJK TC", sans-serif; + --RS__textColor:#121212; - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; + --RS__backgroundColor:#FFFFFF; + color:var(--RS__textColor) !important; + + background-color:var(--RS__backgroundColor) !important; } -:lang(zh-HK) { - --RS__baseFontFamily: "方體", "PingFang HK", "方體", "PingFang TC", "黑體", "Heiti TC", "Microsoft JhengHei UI", "Microsoft JhengHei", Roboto, Noto, "Noto Sans CJK TC", sans-serif; +::-moz-selection{ + color:var(--RS__selectionTextColor); + background-color:var(--RS__selectionBackgroundColor); +} - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; +::selection{ + color:var(--RS__selectionTextColor); + background-color:var(--RS__selectionBackgroundColor); } -/* Readium CSS - Day/Default mode +html{ + font-family:var(--RS__baseFontFamily); + line-height:1.6; + line-height:var(--RS__baseLineHeight); + text-rendering:optimizelegibility; +} - A preset theme for day mode, which is the default +h1, h2, h3{ + line-height:normal; +} - Repo: https://github.com/readium/readium-css */ +:lang(ja), +:lang(zh), +:lang(ko){ + word-wrap:break-word; + -webkit-line-break:strict; + -epub-line-break:strict; + line-break:strict; +} -/* CONFIG */ +math{ + font-family:"Latin Modern Math", "STIX Two Math", "XITS Math", "STIX Math", "Libertinus Math", "TeX Gyre Termes Math", "TeX Gyre Bonum Math", "TeX Gyre Schola", "DejaVu Math TeX Gyre", "TeX Gyre Pagella Math", "Asana Math", "Cambria Math", "Lucida Bright Math", "Minion Math", STIXGeneral, STIXSizeOneSym, Symbol, "Times New Roman", serif; +} -:root { - --RS__backgroundColor: #FFFFFF; - --RS__textColor: #121212; +:lang(am){ + --RS__baseFontFamily:var(--RS__am-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__am-lineHeightCompensation); +} - /* This can be customized but initial will re-use default value of the browser */ - --RS__selectionBackgroundColor: #b4d8fe; - --RS__selectionTextColor: inherit; +:lang(ar){ + --RS__baseFontFamily:var(--RS__ar-baseFontFamily); } -:root { - color: var(--RS__textColor) !important; - background-color: var(--RS__backgroundColor) !important; +:lang(bn){ + --RS__baseFontFamily:var(--RS__bn-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__bn-lineHeightCompensation); } -/* Note: Though `::selection` was present in drafts of CSS Selectors Level 3, it was removed during the Candidate Recommendation phase because its behavior was under-specified (especially with nested elements) and interoperability wasn’t achieved. Source: https://developer.mozilla.org/en-US/docs/Web/CSS/::selection */ +:lang(bo){ + --RS__baseFontFamily:var(--RS__bo-baseFontFamily); +} -::-moz-selection { - color: var(--RS__selectionTextColor); - background-color: var(--RS__selectionBackgroundColor); +:lang(chr){ + --RS__baseFontFamily:var(--RS__chr-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__chr-lineHeightCompensation); } -::selection { - color: var(--RS__selectionTextColor); - background-color: var(--RS__selectionBackgroundColor); +:lang(fa){ + --RS__baseFontFamily:var(--RS__fa-baseFontFamily); } -/* @import "modules/ReadiumCSS-fonts.css"; */ +:lang(gu){ + --RS__baseFontFamily:var(--RS__gu-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__gu-lineHeightCompensation); +} -/* Readium CSS - HTML5 SR Patch stylesheet +:lang(he){ + --RS__baseFontFamily:var(--RS__he-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__he-lineHeightCompensation); +} - A set of style to adjust HTML5 Suggested Rendering to paginated content +:lang(hi){ + --RS__baseFontFamily:var(--RS__hi-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__hi-lineHeightCompensation); +} - Repo: https://github.com/readium/readium-css */ +:lang(hy){ + --RS__baseFontFamily:var(--RS__hy-baseFontFamily); +} -/* Fragmentation */ +:lang(iu){ + --RS__baseFontFamily:var(--RS__iu-baseFontFamily); +} -body { - widows: 2; - orphans: 2; +:lang(ja){ + --RS__baseFontFamily:var(--RS__ja-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__ja-lineHeightCompensation); } -figcaption, th, td { - widows: 1; - orphans: 1; +:lang(km){ + --RS__baseFontFamily:var(--RS__km-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__km-lineHeightCompensation); } -h2, -h3, -h4, -h5, -h6, -dt, -hr, -caption { - -webkit-column-break-after: avoid; - page-break-after: avoid; - break-after: avoid; +:lang(kn){ + --RS__baseFontFamily:var(--RS__kn-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__kn-lineHeightCompensation); } -h1, -h2, -h3, -h4, -h5, -h6, -dt, -figure, -tr { - -webkit-column-break-inside: avoid; - page-break-inside: avoid; - break-inside: avoid; +:lang(ko){ + --RS__baseFontFamily:var(--RS__ko-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__ko-lineHeightCompensation); } -/* Hyphenation */ +:lang(lo){ + --RS__baseFontFamily:var(--RS__lo-baseFontFamily); +} -body { - -webkit-hyphenate-character: "\002D"; - -moz-hyphenate-character: "\002D"; - -ms-hyphenate-character: "\002D"; - hyphenate-character: "\002D"; - -webkit-hyphenate-limit-lines: 3; - -ms-hyphenate-limit-lines: 3; - hyphenate-limit-lines: 3; +:lang(ml){ + --RS__baseFontFamily:var(--RS__ml-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__ml-lineHeightCompensation); } -h1, -h2, -h3, -h4, -h5, -h6, -dt, -figcaption, -pre, -caption, -address, -center, -code, -var { - -ms-hyphens: none; - -moz-hyphens: none; - -webkit-hyphens: none; - -epub-hyphens: none; - hyphens: none; +:lang(or){ + --RS__baseFontFamily:var(--RS__or-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__or-lineHeightCompensation); } -/* OTF */ +:lang(pa){ + --RS__baseFontFamily:var(--RS__pa-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__pa-lineHeightCompensation); +} -body { - font-variant-numeric: oldstyle-nums proportional-nums; +:lang(si){ + --RS__baseFontFamily:var(--RS__si-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__si-lineHeightCompensation); } -:lang(ja) body, -:lang(zh) body, -:lang(ko) body { - font-variant-numeric: lining-nums proportional-nums; +:lang(ta){ + --RS__baseFontFamily:var(--RS__ta-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__ta-lineHeightCompensation); } -h1, h2, h3, h4, h5, h6, dt { - font-variant-numeric: lining-nums proportional-nums; +:lang(te){ + --RS__baseFontFamily:var(--RS__te-baseFontFamily); } -table { - font-variant-numeric: lining-nums tabular-nums; +:lang(th){ + --RS__baseFontFamily:var(--RS__th-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__th-lineHeightCompensation); } -code, var { - font-variant-ligatures: none; - font-variant-numeric: lining-nums tabular-nums slashed-zero; +:lang(zh){ + --RS__baseFontFamily:var(--RS__zh-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__zh-lineHeightCompensation); } -rt { - font-variant-east-asian: ruby; +:lang(zh-Hant){ + --RS__baseFontFamily:var(--RS__zh-Hant-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__zh-Hant-lineHeightCompensation); } -:lang(ar) { - font-variant-ligatures: common-ligatures; +:lang(zh-TW){ + --RS__baseFontFamily:var(--RS__zh-TW-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__zh-TW-lineHeightCompensation); } -:lang(ko) { - font-kerning: normal; +:lang(zh-HK){ + --RS__baseFontFamily:var(--RS__zh-HK-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__zh-HK-lineHeightCompensation); } -/* Night mode */ +body{ + widows:2; + orphans:2; +} -hr { - color: inherit; - border-color: currentColor; +figcaption, th, td{ + widows:1; + orphans:1; } -table, th, td { - border-color: currentColor; +h2, h3, h4, h5, h6, dt, +hr, caption{ + -webkit-column-break-after:avoid; + page-break-after:avoid; + break-after:avoid; } -/* Horizontal Spacing */ +h1, h2, h3, h4, h5, h6, dt, +figure, tr{ + -webkit-column-break-inside:avoid; + page-break-inside:avoid; + break-inside:avoid; +} -figure, blockquote { - margin: 1em 5%; +body{ + -webkit-hyphenate-character:"\002D"; + -moz-hyphenate-character:"\002D"; + -ms-hyphenate-character:"\002D"; + hyphenate-character:"\002D"; + -webkit-hyphenate-limit-lines:3; + -ms-hyphenate-limit-lines:3; + hyphenate-limit-lines:3; } -/* +h1, h2, h3, h4, h5, h6, dt, +figcaption, pre, caption, address, +center, code, var{ + -ms-hyphens:none; + -moz-hyphens:none; + -webkit-hyphens:none; + -epub-hyphens:none; + hyphens:none; +} -:lang(ja) figure, :lang(ja) blockquote, -:lang(zh-Hant) figure, :lang(zh-Hant) blockquote, -:lang(zh-TW) figure, :lang(zh-TW) blockquote, -:lang(mn) figure, :lang(mn) blockquote { - margin: 5% 1em; +body{ + font-variant-numeric:oldstyle-nums proportional-nums; } -*/ +:lang(ja) body, +:lang(zh) body, +:lang(ko) body{ + font-variant-numeric:lining-nums proportional-nums; +} -ul, ol { - padding-left: 5%; +h1, h2, h3, h4, h5, h6, dt{ + font-variant-numeric:lining-nums proportional-nums; } -/* +table{ + font-variant-numeric:lining-nums tabular-nums; +} -:lang(ja) ul, :lang(ja) ol, -:lang(zh-Hant) ul, :lang(zh-Hant) ol, -:lang(zh-TW) ul, :lang(zh-TW) ol, -:lang(mn) ul, :lang(mn) ol { - padding-top: 5%; +code, var{ + font-variant-ligatures:none; + font-variant-numeric:lining-nums tabular-nums slashed-zero; } -*/ +rt{ + font-variant-east-asian:ruby; +} -dd { - margin-left: 5%; +:lang(ar){ + font-variant-ligatures:common-ligatures; } -/* +:lang(ko){ + font-kerning:normal; +} -:lang(ja) dd, -:lang(zh-Hant) dd, -:lang(zh-TW) dd, -:lang(mn) dd { - margin-top: 5%; +hr{ + color:inherit; + border-color:currentcolor; } -*/ +table, th, td{ + border-color:currentcolor; +} -pre { - white-space: pre-wrap; - -ms-tab-size: 2; - -moz-tab-size: 2; - -webkit-tab-size: 2; - tab-size: 2; +figure, blockquote{ + margin:1em 5%; } -/* Normalization */ +ul, ol{ + padding-left:5%; +} -abbr[title], acronym[title] { - text-decoration: dotted underline; +dd{ + margin-left:5%; } -nobr wbr { - white-space: normal; +pre{ + white-space:pre-wrap; + -ms-tab-size:2; + -moz-tab-size:2; + -webkit-tab-size:2; + tab-size:2; } -/* Make ruby text and parentheses non-selectable (TBC) */ +abbr[title], acronym[title]{ + text-decoration:dotted underline; +} -ruby > rt, ruby > rp { - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; +nobr wbr{ + white-space:normal; } -/* Internationalization */ +ruby > rt, ruby > rp{ + -webkit-user-select:none; + -moz-user-select:none; + -ms-user-select:none; + user-select:none; +} -*:lang(ja), -*:lang(zh), -*:lang(ko), -:lang(ja) cite, -:lang(ja) dfn, -:lang(ja) em, -:lang(ja) i, -:lang(zh) cite, -:lang(zh) dfn, -:lang(zh) em, -:lang(zh) i, -:lang(ko) cite, -:lang(ko) dfn, -:lang(ko) em, -:lang(ko) i { - font-style: normal; +*:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)), +*:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)), +*:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)), +:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)) cite, +:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)) dfn, +:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)) em, +:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)) i, +:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)) cite, +:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)) dfn, +:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)) em, +:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)) i, +:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)) cite, +:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)) dfn, +:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)) em, +:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)) i{ + font-style:normal; } :lang(ja) a, :lang(zh) a, -:lang(ko) a { - text-decoration: none; +:lang(ko) a{ + text-decoration:none; } -/* Readium CSS - Safeguards module for vertical writing - - A set of styles to prevent common issues in pagination - - Repo: https://github.com/readium/readium-css */ - -/* Config */ - -/* We’ll be using an "RS__" prefix so that we can prevent collisions with authors’ CSS */ - -:root { - /* max-width for media, you can override that via JS if not compiled to static */ - --RS__maxMediaWidth: 100%; - - /* max-height for media, you can override that via JS if not compiled to static */ - --RS__maxMediaHeight: 100vw; - - /* value for medias’ box-sizing */ - --RS__boxSizingMedia: border-box; - - /* value for table’s box-sizing */ - --RS__boxSizingTable: border-box; +:root{ + --RS__maxMediaWidth:100%; + --RS__maxMediaHeight:100vw; + --RS__boxSizingMedia:border-box; + --RS__boxSizingTable:border-box; } -/* Sanitize line-heights in webkit e.g. raised cap without a declared line-height - See effect by checking this demo in Safari: https://codepen.io/JayPanoz/pen/gRmzrE - Note: glyphs has to be reset to inline for CJK */ - -html { - -webkit-line-box-contain: block glyphs replaced; +a, a span, span a, h1, h2, h3, h4, h5, h6{ + word-wrap:break-word; } -:lang(ja) { - -webkit-line-box-contain: block inline replaced; +div{ + max-width:var(--RS__maxMediaHeight); } -/* Wrap long strings if larger than line-length */ - -a, h1, h2, h3, h4, h5, h6 { - word-wrap: break-word; -} +img, svg|svg, video{ + object-fit:contain; -div { - max-width: var(--RS__maxMediaHeight); + width:auto; + height:auto; + max-width:var(--RS__maxMediaHeight); + max-height:var(--RS__maxMediaWidth) !important; + box-sizing:var(--RS__boxSizingMedia); + -webkit-column-break-inside:avoid; + page-break-inside:avoid; + break-inside:avoid; } -/* Size medias */ - -/* You can override CSS variables by re-defining it for all elements or a specific one */ - -img, svg, audio, video { - - /* Object-fit allows us to keep the correct aspect-ratio */ - object-fit: contain; +@supports (zoom: 1) and (not ((-webkit-column-axis: horizontal) and (-webkit-column-progression: normal))){ - width: auto; - height: auto; - - /* We’re setting a max-height, especially for covers */ - max-width: var(--RS__maxMediaHeight); - - /* Some files don’t have max-width */ - max-height: var(--RS__maxMediaWidth) !important; - /* We probably don’t need to use modern box-sizing as auto behaves like it */ - box-sizing: var(--RS__boxSizingMedia); - - /* For page-break, we must use those 3 - We can’t use a variable there, webkit seems to no support them for those properties */ - -webkit-column-break-inside: avoid; - page-break-inside: avoid; - break-inside: avoid; + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] img, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] svg|svg, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] video, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div{ + zoom:calc(100% / var(--USER__fontSize)); + } } -/* Try preventing border being cut-off, webkit + blink have content-box by default */ - -table { - max-height: var(--RS__maxMediaWidth); - box-sizing: var(--RS__boxSizingTable) +audio{ + max-width:100%; + -webkit-column-break-inside:avoid; + page-break-inside:avoid; + break-inside:avoid; } -/*# sourceMappingURL=ReadiumCSS-before.css.map */ \ No newline at end of file + +table{ + max-height:var(--RS__maxMediaWidth); + box-sizing:var(--RS__boxSizingTable); +} \ No newline at end of file diff --git a/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-vertical/ReadiumCSS-default.css b/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-vertical/ReadiumCSS-default.css index 7122cfa6cc..d2fe289cc5 100644 --- a/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-vertical/ReadiumCSS-default.css +++ b/Sources/Navigator/EPUB/Assets/Static/readium-css/cjk-vertical/ReadiumCSS-default.css @@ -1,210 +1,180 @@ -/* Readium CSS - Namespaces module - - Namespaces to import in all 3 dist stylesheets - - Repo: https://github.com/readium/readium-css */ +/*! + * Readium CSS v.2.0.5 + * Copyright (c) 2017–2026. 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 + */ @namespace url("http://www.w3.org/1999/xhtml"); @namespace epub url("http://www.idpf.org/2007/ops"); -@namespace m url("http://www.w3.org/1998/Math/MathML/"); +@namespace m url("http://www.w3.org/1998/Math/MathML"); @namespace svg url("http://www.w3.org/2000/svg"); -/* Readium CSS - Default module for CJK vertical writing - - A stylesheet for unstyled ebooks based on HTML5 Suggested Rendering - Note: works in combination with Base module - - Repo: https://github.com/readium/readium-css */ +:root{ -/* CONFIG */ + --RS__compFontFamily:var(--RS__baseFontFamily); + --RS__codeFontFamily:var(--RS__monospaceTf); -:root { - /* Extra variables for Japanese font-stacks: - • --RS__serif-ja-v; - • --RS__sans-serif-ja-v. + --RS__typeScale:1.125; + --RS__baseFontSize:87.5%; - They can be used instead of --RS__baseFontFamily and --RS__compFontFamily */ + --RS__flowSpacing:1.5rem; + --RS__paraSpacing:0; + --RS__paraIndent:1em; - --RS__compFontFamily: var(--RS__baseFontFamily); - --RS__codeFontFamily: var(--RS__monospaceTf); + --RS__linkColor:#0000EE; + --RS__visitedColor:#551A8B; - --RS__typeScale: 1.125; /* 1.067 | 1.125 | 1.2 | 1.25 | 1.333 | 1.414 | 1.5 | 1.618 */ - --RS__baseFontSize: 87.5%; - - --RS__flowSpacing: 1.5rem; - --RS__paraSpacing: 0; - --RS__paraIndent: 1em; - - --RS__linkColor: #0000EE; - --RS__visitedColor: #551A8B; - - --RS__primaryColor: ; - --RS__secondaryColor: ; + --RS__primaryColor:; + --RS__secondaryColor:; } -:root:lang(zh) { - --RS__paraIndent: 2em; +:root:lang(zh){ + --RS__paraIndent:2em; } -:lang("mn-Mong") { - --RS__baseFontSize: 100%; +:lang("mn-Mong"){ + --RS__baseFontSize:100%; } -/* STYLES */ - -/* Typo */ - -body { - font-size: var(--RS__baseFontSize); - text-align: justify; - text-justify: inter-character; +body{ + font-size:var(--RS__baseFontSize); + text-align:justify; + text-justify:inter-character; } -h1, h2, h3, h4, h5, h6 { - font-family: var(--RS__baseFontFamily); - text-align: left; - text-align: start; +h1, h2, h3, h4, h5, h6{ + font-family:var(--RS__baseFontFamily); + text-align:left; + text-align:start; } -/* Flow content */ - -blockquote, -figure, -p, -pre, -aside, -footer, -form, -hr { - margin-right: var(--RS__flowSpacing); - margin-left: var(--RS__flowSpacing); +blockquote, figure, p, pre, +aside, footer, form, hr{ + margin-right:var(--RS__flowSpacing); + margin-left:var(--RS__flowSpacing); } -p { - margin-right: var(--RS__paraSpacing); - margin-left: var(--RS__paraSpacing); - text-indent: var(--RS__paraIndent); +p{ + margin-right:var(--RS__paraSpacing); + margin-left:var(--RS__paraSpacing); + text-indent:var(--RS__paraIndent); } -pre { - font-family: var(--RS__codeFontFamily); +pre{ + font-family:var(--RS__codeFontFamily); } -/* Phrasing content */ - -code, kbd, samp, tt { - font-family: var(--RS__codeFontFamily); +code, kbd, samp, tt{ + font-family:var(--RS__codeFontFamily); } -sub, sup { - position: relative; - font-size: 67.5%; - line-height: 1; +sub, sup{ + position:relative; + font-size:67.5%; + line-height:1; } -sub { - left: -0.2ex; +sub{ + left:-0.2ex; } -sup { - right: 0; +sup{ + right:0; } -em { - -webkit-text-emphasis: sesame; - -epub-text-emphasis: sesame; - text-emphasis: sesame; +em{ + -webkit-text-emphasis:sesame; + -epub-text-emphasis:sesame; + text-emphasis:sesame; } -:link { - color: var(--RS__linkColor); +:link{ + color:var(--RS__linkColor); } -:visited { - color: var(--RS__visitedColor); +:visited{ + color:var(--RS__visitedColor); } -/* Headings */ - -h1 { - margin-right: calc(var(--RS__flowSpacing) * 2); - margin-left: calc(var(--RS__flowSpacing) * 2); - /* The following is base font size * typescale power of 3 */ - font-size: calc(((1em * var(--RS__typeScale)) * var(--RS__typeScale)) * var(--RS__typeScale)); - text-indent: 2rem; +h1{ + margin-right:calc(var(--RS__flowSpacing) * 2); + margin-left:calc(var(--RS__flowSpacing) * 2); + font-size:calc(((1em * var(--RS__typeScale)) * var(--RS__typeScale)) * var(--RS__typeScale)); + text-indent:2rem; } -h2 { - margin-right: calc(var(--RS__flowSpacing) * 2); - margin-left: var(--RS__flowSpacing); - /* The following is base font size * typescale power of 2 */ - font-size: calc((1em * var(--RS__typeScale)) * var(--RS__typeScale)); - text-indent: 3rem; +h2{ + margin-right:calc(var(--RS__flowSpacing) * 2); + margin-left:var(--RS__flowSpacing); + font-size:calc((1em * var(--RS__typeScale)) * var(--RS__typeScale)); + text-indent:3rem; } -h3 { - margin-right: var(--RS__flowSpacing); - margin-left: var(--RS__flowSpacing); - font-size: calc(1em * var(--RS__typeScale)); - text-indent: 4rem; +h3{ + margin-right:var(--RS__flowSpacing); + margin-left:var(--RS__flowSpacing); + font-size:calc(1em * var(--RS__typeScale)); + text-indent:4rem; } -h4 { - margin-right: var(--RS__flowSpacing); - margin-left: var(--RS__flowSpacing); - font-family: var(--RS__compFontFamily); - font-size: 1em; - text-indent: 4rem; +h4{ + margin-right:var(--RS__flowSpacing); + margin-left:var(--RS__flowSpacing); + font-family:var(--RS__compFontFamily); + font-size:1em; + text-indent:4rem; } -h5 { - margin-right: var(--RS__flowSpacing); - margin-left: var(--RS__flowSpacing); - font-family: var(--RS__compFontFamily); - font-size: smaller; - text-indent: 4rem; +h5{ + margin-right:var(--RS__flowSpacing); + margin-left:var(--RS__flowSpacing); + font-family:var(--RS__compFontFamily); + font-size:smaller; + text-indent:4rem; } -h6 { - margin-right: var(--RS__flowSpacing); - margin-left: 0; - font-family: var(--RS__compFontFamily); - font-size: smaller; - font-weight: normal; - text-indent: 4rem; +h6{ + margin-right:var(--RS__flowSpacing); + margin-left:0; + font-family:var(--RS__compFontFamily); + font-size:smaller; + font-weight:normal; + text-indent:4rem; } -/* Lists */ - -dl, ol, ul { - margin-right: var(--RS__flowSpacing); - margin-left: var(--RS__flowSpacing); +dl, ol, ul{ + margin-right:var(--RS__flowSpacing); + margin-left:var(--RS__flowSpacing); } -/* Table */ - -table { - margin: 0 var(--RS__flowSpacing); - border: 1px solid currentColor; - border-collapse: collapse; - empty-cells: show; +table{ + margin:0 var(--RS__flowSpacing); + border:1px solid currentcolor; + border-collapse:collapse; + empty-cells:show; } -thead, tbody, tfoot, table > tr { - vertical-align: top; +thead, tbody, tfoot, table > tr{ + vertical-align:top; } -th { - text-align: left; +th{ + text-align:left; } -th, td { - padding: 4px; - border: 1px solid currentColor; -} -/*# sourceMappingURL=ReadiumCSS-default.css.map */ \ No newline at end of file +th, td{ + padding:4px; + border:1px solid currentcolor; +} \ No newline at end of file diff --git a/Sources/Navigator/EPUB/Assets/Static/readium-css/rtl/ReadiumCSS-after.css b/Sources/Navigator/EPUB/Assets/Static/readium-css/rtl/ReadiumCSS-after.css index 92ea61f138..3d6a5eb03d 100644 --- a/Sources/Navigator/EPUB/Assets/Static/readium-css/rtl/ReadiumCSS-after.css +++ b/Sources/Navigator/EPUB/Assets/Static/readium-css/rtl/ReadiumCSS-after.css @@ -1,776 +1,527 @@ -/* Readium CSS - Config module - - A file allowing implementers to customize flags for reading modes, - user settings, etc. - - Repo: https://github.com/readium/readium-css */ - -/* Custom medias - Syntax: @custom-media --variable (prop: value) */ - -/* Responsive columns - The minimum width for which responsive columns (2 -> 1 and vice versa, - depending on the current font-size) must be enabled */ - -/* Mobile columns - The minimum and maximum width for mobile devices. - We’re forcing the landscape orientation by default, - and must still investigate large tablets (iPad Pro, Surface Pro 3, etc.). */ - -/* Custom selectors - Syntax: @custom-selector :--variable selector - The selectors you will use for flags/switches - You can alternatively use classes or custom data-* attributes */ - -/* User view = paged | scrolled */ - -/* Font-family override */ - -/* Advanced settings */ - -/* Reading Modes */ - -/* Filters (images) */ - -/* Accessibility normalization */ - -/* Accessibility font. You can add selectors, using “, ” as a separator, if you have multiple fonts */ - -/* Direction i.e. ltr and rtl */ - -/* Readium CSS - Namespaces module - - Namespaces to import in all 3 dist stylesheets - - Repo: https://github.com/readium/readium-css */ +/*! + * Readium CSS v.2.0.5 + * Copyright (c) 2017–2026. 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 + */ @namespace url("http://www.w3.org/1999/xhtml"); @namespace epub url("http://www.idpf.org/2007/ops"); -@namespace m url("http://www.w3.org/1998/Math/MathML/"); +@namespace m url("http://www.w3.org/1998/Math/MathML"); @namespace svg url("http://www.w3.org/2000/svg"); -/* Readium CSS - Pagination module +:root{ - A set of styles to paginate ePublications + --RS__viewportWidth:100%; - Repo: https://github.com/readium/readium-css */ + --RS__pageGutter:0; -/* Config */ + --RS__defaultLineLength:100%; -/* Columns are responsive by default, even if column-width is set in pixels, - which means two-page spread will switch to single page depending on current font-size. - If you want more control, I’m afraid you’ll have to update colWidth/colGap dynamically, - which is how a significant amount of RS do at the moment. */ + --RS__colGap:0; -/* Default for smartphone portrait (small screens) */ + --RS__colCount:1; -:root { - /* Your columns’ width floor */ - --RS__colWidth: 45em; /* The width at which we’ll switch to 2 columns by default. PS: you can’t set it in rem */ - - /* Ideal number of columns (depending on columns’ width floor) */ - --RS__colCount: 1; - - /* Gap between columns (in pixels so that it won’t resize with font-size) */ - --RS__colGap: 0; - - /* Optimal line-length (rem will take :root font-size into account, whatever the body’s font-size) */ - --RS__maxLineLength: 40rem; - - /* Default page horizontal margins (in pixels so that it won’t resize with font-size) */ - --RS__pageGutter: 20px; /* See if colGap and pageGutter can be the same var */ + --RS__colWidth:100vw; } -/* Reset page margins for Forward compatibility */ - -@page { - margin: 0 !important; +@page{ + margin:0 !important; } -/* :root selector has same specificity as a class i.e. 0010 - We might have to change that to html / context - -> https://css-tricks.com/almanac/selectors/r/root/ */ - -:root { - - /* In case you use left position to scroll, can be removed if using transform: translateX() */ - position: relative; - - -webkit-column-width: var(--RS__colWidth); - -moz-column-width: var(--RS__colWidth); - column-width: var(--RS__colWidth); +:root{ + position:relative; - /* Init pagination */ - /* TODO: document columns’ logic cos it might feel weird at first */ - -webkit-column-count: var(--RS__colCount); - -moz-column-count: var(--RS__colCount); - column-count: var(--RS__colCount); + -webkit-column-width:var(--RS__colWidth); + -moz-column-width:var(--RS__colWidth); + column-width:var(--RS__colWidth); + -webkit-column-count:var(--RS__colCount); + -moz-column-count:var(--RS__colCount); + column-count:var(--RS__colCount); - -webkit-column-gap: var(--RS__colGap); - -moz-column-gap: var(--RS__colGap); - column-gap: var(--RS__colGap); - - /* Default is balance and we want columns to be filled entirely (100vh) */ - -moz-column-fill: auto; - column-fill: auto; - width: 100%; - height: 100vh; - max-width: 100%; - max-height: 100vh; - min-width: 100%; - min-height: 100vh; - padding: 0 !important; - margin: 0 !important; - - /* Column size will depend on this if we want to make it responsive */ - font-size: 100% !important; - - -webkit-text-size-adjust: 100%; - - /* Switch to newer box model (not inherited by authors’ styles) */ - box-sizing: border-box; - - /* Fix bug for older Chrome */ - -webkit-perspective: 1; - /* Prevents options pop-up when long tap in webkit */ - -webkit-touch-callout: none; + -webkit-column-gap:var(--RS__colGap); + -moz-column-gap:var(--RS__colGap); + column-gap:var(--RS__colGap); + -moz-column-fill:auto; + column-fill:auto; + width:var(--RS__viewportWidth); + height:100vh; + max-width:var(--RS__viewportWidth); + max-height:100vh; + min-width:var(--RS__viewportWidth); + min-height:100vh; + padding:0 !important; + margin:0 !important; + font-size:1rem !important; + box-sizing:border-box; + -webkit-touch-callout:none; } -body { - /* overflow: hidden; bugfix: contents won’t paginate in Firefox and one sample in Safari */ - width: 100%; - - /* Limit line-length but we have to reset when 2 columns and control the viewport. - By using max-width + margin auto, margins will shrink when font-size increases, - which is what would be expected in terms of typography. */ - max-width: var(--RS__maxLineLength) !important; - padding: 0 var(--RS__pageGutter) !important; - margin: 0 auto !important; - - /* We need a minimum padding on body so that descandants/ascendants in italic/script are not cut-off. - Drawback: we have to use border-box so that it doesn’t screw the box model, - which means it impacts colWidth and max-width */ - box-sizing: border-box; +body{ + width:100%; + max-width:var(--RS__defaultLineLength) !important; + margin:0 auto !important; + box-sizing:border-box; } -/* We’ll now redefine margins and columns depending on the minimum width available - The goal is having the simplest model possible and avoid targeting devices */ - -/* Smartphone landscape */ - -@media screen and (min-width: 35em) { - :root { - --RS__pageGutter: 30px; - } +:root:not([style*="readium-scroll-on"]) body{ + padding:0 var(--RS__pageGutter) !important; } -/* Tablet portrait */ - -@media screen and (min-width: 45em) { - :root { - --RS__pageGutter: 40px; - } +:root:not([style*="readium-noOverflow-on"]) body{ + overflow:hidden; } -/* Desktop + tablet large */ +@supports (overflow: clip){ -/* We get the previous settings, we just change the margins */ + :root:not([style*="readium-noOverflow-on"]){ + overflow:clip; + } -@media screen and (min-width: 75em) { - :root { - --RS__pageGutter: 50px; - } + :root:not([style*="readium-noOverflow-on"]) body{ + overflow:clip; + overflow-clip-margin:content-box; + } } -/* At this point (80em or so), constraining line length must be done at the web view/iframe level, or by limiting the size of :root itself */ - -/* Responsive columns */ - -@media screen and (min-width: 60em), screen and (min-device-width: 36em) and (max-device-width: 47em) and (orientation: landscape) { - :root { - /* The size at which we want 2 columns to switch to 1 (depending on font-size) */ - --RS__colWidth: 20em; /* 20 * 16 = 320px but 20 * 28 = 560px so it will switch to 1 col @ 175% font-size (user-setting) on an iPad */ - /* We constrain to 2 columns so that we can never get 3 or 4, etc. */ - --RS__colCount: 2; - --RS__maxLineLength: 39.99rem; /* If we don’t use this, colNumber user setting won’t work in Safari… */ - } +:root[style*="readium-scroll-on"]{ + -webkit-columns:auto auto !important; + -moz-columns:auto auto !important; + columns:auto auto !important; + width:auto !important; + height:auto !important; + max-width:none !important; + max-height:none !important; + min-width:0 !important; + min-height:0 !important; } -/* Readium CSS - Scroll module - - A set of styles to scroll ePublications - This module overrides pagination - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-scroll-on"] { - - /* Reset columns, auto + auto = columns can’t be created */ - -webkit-columns: auto auto !important; - -moz-columns: auto auto !important; - columns: auto auto !important; - width: auto !important; - height: auto !important; - max-width: none !important; - max-height: none !important; - /* Reset html size so that the user can scroll */ - min-width: 0 !important; - min-height: 0 !important; +:root[style*="readium-scroll-on"] body{ + max-width:var(--RS__defaultLineLength) !important; + box-sizing:border-box !important; } -/* Make sure line-length is limited in all configs */ - -:root[style*="readium-scroll-on"] body { - --RS__maxLineLength: 40rem !important; +:root[style*="readium-scroll-on"]:not([style*="readium-noOverflow-on"]) body{ + overflow:auto; } -/* Readium CSS - Night mode - - A preset theme for night mode - - Repo: https://github.com/readium/readium-css */ - -/* CONFIG */ - -/* [style*="--USER__appearance"] can be used to increase specificity but performance hit */ +@supports (overflow: clip){ -:root[style*="readium-night-on"] { - --RS__backgroundColor: #000000; - --RS__textColor: #FEFEFE; - - --RS__linkColor: #63caff; - --RS__visitedColor: #0099E5; + :root[style*="readium-scroll-on"]:not([style*="readium-noOverflow-on"]){ + overflow:auto; + } - /* This can be customized but initial will re-use default value of the browser */ - --RS__selectionBackgroundColor: #b4d8fe; - --RS__selectionTextColor: inherit; + :root[style*="readium-scroll-on"]:not([style*="readium-noOverflow-on"]) body{ + overflow:clip; + } } -/* we don’t need to redeclare bg-color and color for :root since we will inherit and update from day/default mode */ - -:root[style*="readium-night-on"] *:not(a) { - color: inherit !important; - background-color: transparent !important; - border-color: currentColor !important; +:root[style*="readium-scroll-on"][style*="--RS__scrollPaddingTop"] body{ + padding-top:var(--RS__scrollPaddingTop) !important; } -:root[style*="readium-night-on"] svg text { - fill: currentColor !important; - stroke: none !important; +:root[style*="readium-scroll-on"][style*="--RS__scrollPaddingBottom"] body{ + padding-bottom:var(--RS__scrollPaddingBottom) !important; } -:root[style*="readium-night-on"] a:link, -:root[style*="readium-night-on"] a:link * { - color: var(--RS__linkColor) !important; +:root[style*="readium-scroll-on"][style*="--RS__scrollPaddingLeft"] body{ + padding-left:var(--RS__scrollPaddingLeft) !important; } -:root[style*="readium-night-on"] a:visited, -:root[style*="readium-night-on"] a:visited * { - color: var(--RS__visitedColor) !important; +:root[style*="readium-scroll-on"][style*="--RS__scrollPaddingRight"] body{ + padding-right:var(--RS__scrollPaddingRight) !important; } -/* For epub:type, in case the contents are served as text/html, namespaces won’t work hence why we’re using both syntax */ - -:root[style*="readium-night-on"] img[class*="gaiji"], -:root[style*="readium-night-on"] *[epub\:type~="titlepage"] img:only-child, -:root[style*="readium-night-on"] *[epub|type~="titlepage"] img:only-child { - -webkit-filter: invert(100%); - filter: invert(100%); +:root[style*="--USER__backgroundColor"]{ + background-color:var(--USER__backgroundColor) !important; } -/* Darken all images on user’s demand */ - -:root[style*="readium-night-on"][style*="readium-darken-on"] img { - -webkit-filter: brightness(80%); - filter: brightness(80%); +:root[style*="--USER__backgroundColor"] *{ + background-color:transparent !important; } -/* Invert all images on user’s demand */ - -:root[style*="readium-night-on"][style*="readium-invert-on"] img { - -webkit-filter: invert(100%); - filter: invert(100%); +:root[style*="--USER__textColor"]{ + color:var(--USER__textColor) !important; } -/* Darken and invert on user’s demand */ - -:root[style*="readium-night-on"][style*="readium-darken-on"][style*="readium-invert-on"] img { - -webkit-filter: brightness(80%) invert(100%); - filter: brightness(80%) invert(100%); +:root[style*="--USER__textColor"] *:not(a){ + color:inherit !important; + background-color:transparent !important; + border-color:currentcolor !important; } -/* Readium CSS - Sepia mode - - A preset theme for sepia mode - - Repo: https://github.com/readium/readium-css */ - -/* CONFIG */ - -:root[style*="readium-sepia-on"] { - --RS__backgroundColor: #faf4e8; - --RS__textColor: #121212; - - --RS__linkColor: #0000EE; - --RS__visitedColor: #551A8B; - - /* This can be customized but initial will re-use default value of the browser */ - --RS__selectionBackgroundColor: #b4d8fe; - --RS__selectionTextColor: inherit; - - --RS__maxLineLength: 40.01rem; /* Forcing a reflow in Blink/Webkit so that blend mode can work */ +:root[style*="--USER__textColor"] svg text{ + fill:currentcolor !important; + stroke:none !important; } -/* we don’t need to redeclare bg-color and color for :root since we will inherit and update from day/default mode */ - -:root[style*="readium-sepia-on"] *:not(a) { - color: inherit !important; - background-color: transparent !important; +:root[style*="--USER__linkColor"] a:link, +:root[style*="--USER__linkColor"] a:link *{ + color:var(--USER__linkColor) !important; } -:root[style*="readium-sepia-on"] a:link, -:root[style*="readium-sepia-on"] a:link * { - color: var(--RS__linkColor); +:root[style*="--USER__visitedColor"] a:visited, +:root[style*="--USER__visitedColor"] a:visited *{ + color:var(--USER__visitedColor) !important; } -:root[style*="readium-sepia-on"] a:visited, -:root[style*="readium-sepia-on"] a:visited * { - color: var(--RS__visitedColor); +:root[style*="--USER__selectionBackgroundColor"][style*="--USER__selectionTextColor"] ::-moz-selection{ + color:var(--USER__selectionTextColor) !important; + background-color:var(--USER__selectionBackgroundColor) !important; } -:root[style*="readium-sepia-on"] svg, -:root[style*="readium-sepia-on"] img { - /* Make sure the proper bg-color is used for the blend mode */ - background-color: transparent !important; - mix-blend-mode: multiply; +:root[style*="--USER__selectionBackgroundColor"][style*="--USER__selectionTextColor"] ::selection{ + color:var(--USER__selectionTextColor) !important; + background-color:var(--USER__selectionBackgroundColor) !important; } -/* Readium CSS - OS Accessibility Modes +:root[style*="--USER__colCount"]{ + -webkit-column-count:var(--USER__colCount); + -moz-column-count:var(--USER__colCount); + column-count:var(--USER__colCount); - A stylesheet to deal with OS accessibility settings - - Repo: https://github.com/readium/readium-css */ - -/* Windows high contrast colors are mapped to CSS system color keywords - See http://www.gwhitworth.com/blog/2017/04/how-to-use-ms-high-contrast */ + --RS__colWidth:auto; +} -@media screen and (-ms-high-contrast: active) { - :root { - color: windowText !important; - background-color: window !important; - } +:root[style*="--USER__colCount: 0"], +:root[style*="--USER__colCount:0"]{ + -webkit-column-count:1; + -moz-column-count:1; + column-count:1; +} - /* The following selectors are super funky but it makes sure everything is inherited, this is indeed critical for this mode */ - :root :not(#\#):not(#\#):not(#\#), - :root :not(#\#):not(#\#):not(#\#) :not(#\#):not(#\#):not(#\#) - :root :not(#\#):not(#\#):not(#\#) :not(#\#):not(#\#):not(#\#) :not(#\#):not(#\#):not(#\#) { - color: inherit !important; - background-color: inherit !important; - } +:root[style*="--USER__colCount: 0"], +:root[style*="--USER__colCount:0"], +:root[style*="--USER__colCount: 1"], +:root[style*="--USER__colCount:1"]{ + --RS__colWidth:100vw; +} - .readiumCSS-mo-active-default { - color: highlightText !important; - background-color: highlight !important; +:root[style*="--USER__lineLength"] body{ + max-width:var(--USER__lineLength) !important; } - /* For links, hyperlink keyword is automatically set */ - - /* Should we also set user highlights? */ +:root[style*="--USER__textAlign"]{ + text-align:var(--USER__textAlign); } -@media screen and (-ms-high-contrast: white-on-black) { - :root[style*="readium-night-on"] img[class*="gaiji"], - :root[style*="readium-night-on"] *[epub\:type~="titlepage"] img:only-child, - :root[style*="readium-night-on"] *[epub|type~="titlepage"] img:only-child { - -webkit-filter: none !important; - filter: none !important; - } - :root[style*="readium-night-on"][style*="readium-invert-on"] img { - -webkit-filter: none !important; - filter: none !important; - } - :root[style*="readium-night-on"][style*="readium-darken-on"][style*="readium-invert-on"] img { - -webkit-filter: brightness(80%); - filter: brightness(80%); - } +:root[style*="--USER__textAlign"] body, +:root[style*="--USER__textAlign"] p:not( + blockquote p, + figcaption p, + header p, + hgroup p, + :root[style*="readium-experimentalHeaderFiltering-on"] p[class*="title"], + :root[style*="readium-experimentalHeaderFiltering-on"] div:has(+ *) > h1 + p, + :root[style*="readium-experimentalHeaderFiltering-on"] 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; } -/* Will be true on recent versions of iOS and MacOS if inverted setting enabled by the user */ - -@media screen and (inverted-colors) { - :root[style*="readium-night-on"] img[class*="gaiji"], - :root[style*="readium-night-on"] *[epub\:type~="titlepage"] img:only-child, - :root[style*="readium-night-on"] *[epub|type~="titlepage"] img:only-child { - -webkit-filter: none !important; - filter: none !important; - } - :root[style*="readium-night-on"][style*="readium-invert-on"] img { - -webkit-filter: none !important; - filter: none !important; - } - :root[style*="readium-night-on"][style*="readium-darken-on"][style*="readium-invert-on"] img { - -webkit-filter: brightness(80%); - filter: brightness(80%); - } +:root[style*="--USER__fontFamily"]{ + font-family:var(--USER__fontFamily) !important; } -@media screen and (monochrome) { - /* Grayscale (Implemented in Safari, what about eInk?) */ - /* Must deal with anything color (contrast) so must be managed at the night/sepia/theme level :( */ +:root[style*="--USER__fontFamily"] *{ + font-family:revert !important; } -@media screen and (prefers-reduced-motion) { - /* If reduced motion is set on MacOS, in case we have animation/transition */ +:root:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] body{ + zoom:var(--USER__fontSize) !important; } -/* Readium CSS - Columns number pref - - A submodule managing columns number for user settings - Part of “Chrome Advanced” class – no flag required. - - Repo: https://github.com/readium/readium-css */ - -/* Number of columns = 1 | 2 */ - -/* We still need to see if we allow users to force number of columns for all configs, currently it behaves as an "auto" setting */ - -/* apply col setting except for mobile portrait */ +:root:not([style*="readium-deprecatedFontSize-on"])[style*="readium-iOSPatch-on"][style*="--USER__fontSize"] body{ + -webkit-text-size-adjust:var(--USER__fontSize) !important; +} -@media screen and (min-width: 60em), screen and (min-device-width: 36em) and (max-device-width: 47em) and (orientation: landscape) { - :root[style*="--USER__colCount: 1"], - :root[style*="--USER__colCount:1"], - :root[style*="--USER__colCount: 2"], - :root[style*="--USER__colCount:2"] { - -webkit-column-count: var(--USER__colCount); - -moz-column-count: var(--USER__colCount); - column-count: var(--USER__colCount); - } +@supports selector(figure:has(> img)){ - /* If one column, make sure we limit line-length */ - :root[style*="--USER__colCount: 1"], - :root[style*="--USER__colCount:1"] { - --RS__maxLineLength: 40rem !important; /* This is the only way for the user setting to work in webkit… */ - --RS__colWidth: 100vw; + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> img), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> video), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> svg), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> canvas), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> iframe), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figure:has(> audio), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> img:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> video:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> svg:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> canvas:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> iframe:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] div:has(> audio:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] table{ + zoom:calc(100% / var(--USER__fontSize)) !important; } - /* If smartphone landscape, and 2 columns, col width the same as iPad landscape + desktop */ - :root[style*="--USER__colCount: 2"], - :root[style*="--USER__colCount:2"] { - --RS__colWidth: auto; /* User explicitely tells he/she wants 2 columns, we reset floor value */ + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] figcaption, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] caption, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] td, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] th{ + zoom:var(--USER__fontSize) !important; } } -/* Readium CSS - Page margins pref - - A submodule managing page margins for user settings - Part of “Chrome Advanced” class – no flag required. - - Repo: https://github.com/readium/readium-css */ - -/* Page Margins: the user margin is a factor of the page gutter e.g. 0.5, 0.75, 1, 1.25, 1.5, etc. */ +@supports not (zoom: 1){ -:root[style*="--USER__pageMargins"] body { - padding: 0 calc(var(--RS__pageGutter) * var(--USER__pageMargins)) !important; + :root[style*="--USER__fontSize"]{ + font-size:var(--USER__fontSize) !important; + } } -/* Readium CSS - Custom colors pref - - A submodule managing custom colors for user settings - Part of “Chrome Advanced” class – no flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="--USER__backgroundColor"] { - background-color: var(--USER__backgroundColor) !important; +:root[style*="readium-deprecatedFontSize-on"][style*="--USER__fontSize"]{ + font-size:var(--USER__fontSize) !important; } -:root[style*="--USER__backgroundColor"] * { - background-color: transparent !important; +:root[style*="--USER__lineHeight"]{ + line-height:var(--USER__lineHeight) !important; } -:root[style*="--USER__textColor"] { - color: var(--USER__textColor) !important; +:root[style*="--USER__lineHeight"] body, +:root[style*="--USER__lineHeight"] p, +:root[style*="--USER__lineHeight"] li, +:root[style*="--USER__lineHeight"] div{ + line-height:var(--USER__lineHeight) !important; } -:root[style*="--USER__textColor"] *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(pre) { - color: inherit !important; +:root[style*="--USER__paraSpacing"] p{ + margin-top:var(--USER__paraSpacing) !important; + margin-bottom:var(--USER__paraSpacing) !important; } -/* Readium CSS - Text align pref - - A submodule managing text-align for user settings - Part of “User Overrides Advanced” class – “advanced settings” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-advanced-on"][style*="--USER__textAlign"] { - text-align: var(--USER__textAlign); +:root[style*="--USER__paraIndent"] p:not( + blockquote p, + figcaption p, + header p, + hgroup p, + :root[style*="readium-experimentalHeaderFiltering-on"] p[class*="title"], + :root[style*="readium-experimentalHeaderFiltering-on"] div:has(+ *) > h1 + p, + :root[style*="readium-experimentalHeaderFiltering-on"] div:has(+ *) > p:has(+ h1) +){ + text-indent:var(--USER__paraIndent) !important; } -:root[style*="readium-advanced-on"][style*="--USER__textAlign"] body, -:root[style*="readium-advanced-on"][style*="--USER__textAlign"] *:not(blockquote):not(figcaption) p, -:root[style*="readium-advanced-on"][style*="--USER__textAlign"] li { - text-align: inherit !important; - -moz-text-align-last: auto !important; - -epub-text-align-last: auto !important; - text-align-last: auto !important; +:root[style*="--USER__paraIndent"] p *{ + text-indent:0 !important; } -/* In case something goes wrong at the programmatic level + rtl for body + rtl in ltr */ - -:root[style*="readium-advanced-on"][dir="rtl"][style*="--USER__textAlign: left"], -:root[style*="readium-advanced-on"][dir="rtl"][style*="--USER__textAlign:left"], -:root[style*="readium-advanced-on"][style*="--USER__textAlign: left"] *[dir="rtl"], -:root[style*="readium-advanced-on"][style*="--USER__textAlign:left"] *[dir="rtl"] { - text-align: right; +: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) !important; } -/* Edge, if logical value is used, think of it as a polyfill. For LTR, it will fall back to the default, which is left */ - -:root[style*="readium-advanced-on"][dir="rtl"][style*="--USER__textAlign: start"], -:root[style*="readium-advanced-on"][dir="rtl"][style*="--USER__textAlign:start"] { - text-align: right; +:root[style*="--USER__ligatures"]{ + font-variant-ligatures:var(--USER__ligatures) !important; } -/* Readium CSS - Font Family pref - - A submodule managing font-family for user settings - Part of “User Overrides” class – “font override” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-font-on"][style*="--USER__fontFamily"] { - font-family: var(--USER__fontFamily) !important; +:root[style*="--USER__ligatures"] *{ + font-variant-ligatures:inherit !important; } -:root[style*="readium-font-on"][style*="--USER__fontFamily"] body, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] p, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] li, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] div, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] dt, -:root[style*="readium-font-on"][style*="--USER__fontFamily"] dd { - font-family: inherit !important; +:root[style*="--USER__fontWeight"] body{ + font-weight:var(--USER__fontWeight) !important; } -:root[style*="readium-font-on"][style*="--USER__fontFamily"] i:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] i:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] em:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] em:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] cite:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] cite:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] b:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] b:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] strong:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] strong:not([xml\:lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] span:not([lang]), -:root[style*="readium-font-on"][style*="--USER__fontFamily"] span:not([xml\:lang]) { - font-family: inherit !important; +:root[style*="--USER__fontWeight"] b, +:root[style*="--USER__fontWeight"] strong{ + font-weight:bolder; } -/* Readium CSS - Font size pref - - A submodule managing font-size for user settings - Part of “User Overrides” class – no flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="--USER__fontSize"] { - font-size: var(--USER__fontSize) !important; +:root[style*="--USER__fontWidth"] body{ + font-stretch:var(--USER__fontWidth) !important; } -/* Readium CSS - Line height pref - - A submodule managing line-height for user settings - Part of “User Overrides Advanced” class – “advanced settings” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] { - line-height: var(--USER__lineHeight) !important; +:root[style*="--USER__fontOpticalSizing"] body{ + font-optical-sizing:var(--USER__fontOpticalSizing) !important; } -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] body, -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] p, -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] li, -:root[style*="readium-advanced-on"][style*="--USER__lineHeight"] div { - line-height: inherit; +:root[style*="readium-blend-on"] svg, +:root[style*="readium-blend-on"] img{ + background-color:transparent !important; + mix-blend-mode:multiply !important; } -/* Readium CSS - Para spacing pref - - A submodule managing paragraphs’ top and bottom margins for user settings - Part of “User Overrides Advanced” class – “advanced settings” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-advanced-on"][style*="--USER__paraSpacing"] p { - margin-top: var(--USER__paraSpacing) !important; - margin-bottom: var(--USER__paraSpacing) !important; +:root[style*="--USER__darkenImages"] img{ + -webkit-filter:brightness(var(--USER__darkenImages)) !important; + filter:brightness(var(--USER__darkenImages)) !important; } -/* Readium CSS - Para indent pref - - A submodule managing paragraphs’ text-indent for user settings - Part of “User Overrides Advanced” class – “advanced settings” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-advanced-on"][style*="--USER__paraIndent"] p { - text-indent: var(--USER__paraIndent) !important; +:root[style*="readium-darken-on"] img{ + -webkit-filter:brightness(80%) !important; + filter:brightness(80%) !important; } -/* If there are inline-block elements in paragraphs, text-indent will inherit so we must reset it */ - -:root[style*="readium-advanced-on"][style*="--USER__paraIndent"] p * { - text-indent: 0 !important; +:root[style*="--USER__invertImages"] img{ + -webkit-filter:invert(var(--USER__invertImages)) !important; + filter:invert(var(--USER__invertImages)) !important; } -/* Readium CSS - Ligatures pref - - A submodule managing ligatures for user settings in the Arabic Script (can help with a11y) - Part of “User Overrides Advanced” class – “advanced settings” flag required. - - Repo: https://github.com/readium/readium-css */ - -:root[style*="readium-advanced-on"][style*="--USER__arabicLigatures"] { - font-variant-ligatures: var(--USER__ligatures) !important; +:root[style*="readium-invert-on"] img{ + -webkit-filter:invert(100%) !important; + filter:invert(100%) !important; } -:root[style*="readium-advanced-on"][style*="--USER__arabicLigatures"] * { - font-variant-ligatures: inherit !important; +:root[style*="--USER__darkenImages"][style*="--USER__invertImages"] img{ + -webkit-filter:brightness(var(--USER__darkenImages)) invert(var(--USER__invertImages)) !important; + filter:brightness(var(--USER__darkenImages)) invert(var(--USER__invertImages)) !important; } -/* Readium CSS - Font size normalize - - A stylesheet to normalize font-size - - Repo: https://github.com/readium/readium-css */ - -/* STYLES */ - -/* :root is used so that you can quickly add a class or attribute if you prefer e.g. `:root[data-rs-normalize]` */ - -/* We create a default so that you don’t need to explicitly set one in the DOM. - Once the “Publisher’s styles” checkbox is unchecked, the normalize is applied automatically */ - -:root[style*="readium-advanced-on"] { - --USER__typeScale: 1.2; /* This is the default type scale you’ll find in most publications */ +:root[style*="readium-darken-on"][style*="--USER__invertImages"] img{ + -webkit-filter:brightness(80%) invert(var(--USER__invertImages)) !important; + filter:brightness(80%) invert(var(--USER__invertImages)) !important; } -:root[style*="readium-advanced-on"] p, -:root[style*="readium-advanced-on"] li, -:root[style*="readium-advanced-on"] div, -:root[style*="readium-advanced-on"] pre, -:root[style*="readium-advanced-on"] dd { - font-size: 1rem !important; +:root[style*="--USER__darkenImages"][style*="readium-invert-on"] img{ + -webkit-filter:brightness(var(--USER__darkenImages)) invert(100%) !important; + filter:brightness(var(--USER__darkenImages)) invert(100%) !important; } -:root[style*="readium-advanced-on"] h1 { - /* Fallback if browser doesn’t support vars */ - font-size: 1.75rem !important; - font-size: calc(((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) * var(--USER__typeScale)) !important; +:root[style*="readium-darken-on"][style*="readium-invert-on"] img{ + -webkit-filter:brightness(80%) invert(100%) !important; + filter:brightness(80%) invert(100%) !important; } -:root[style*="readium-advanced-on"] h2 { - /* Fallback if browser doesn’t support vars */ - font-size: 1.5rem !important; - font-size: calc((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) !important; +:root[style*="--USER__invertGaiji"] img[class*="gaiji"]{ + -webkit-filter:invert(var(--USER__invertGaiji)) !important; + filter:invert(var(--USER__invertGaiji)) !important; } -:root[style*="readium-advanced-on"] h3 { - /* Fallback if browser doesn’t support vars */ - font-size: 1.25rem !important; - font-size: calc(1rem * var(--USER__typeScale)) !important; +:root[style*="readium-invertGaiji-on"] img[class*="gaiji"]{ + -webkit-filter:invert(100%) !important; + filter:invert(100%) !important; } -:root[style*="readium-advanced-on"] h4, -:root[style*="readium-advanced-on"] h5, -:root[style*="readium-advanced-on"] h6 { - font-size: 1rem !important; +:root[style*="readium-normalize-on"]{ + --USER__typeScale:1.2; } -:root[style*="readium-advanced-on"] small { - font-size: smaller !important; +:root[style*="readium-normalize-on"] p, +:root[style*="readium-normalize-on"] li, +:root[style*="readium-normalize-on"] div, +:root[style*="readium-normalize-on"] pre, +:root[style*="readium-normalize-on"] dd{ + font-size:1rem !important; } -:root[style*="readium-advanced-on"] sub, -:root[style*="readium-advanced-on"] sup { - font-size: 67.5% !important; +:root[style*="readium-normalize-on"] h1{ + font-size:1.75rem !important; + font-size:calc(((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) * var(--USER__typeScale)) !important; } -/* The following styles kick in if you define the typeScale variable in the DOM. - No need to repeat declarations which don’t make use of the variable */ - -:root[style*="readium-advanced-on"][style*="--USER__typeScale"] h1 { - font-size: calc(((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) * var(--USER__typeScale)) !important; +:root[style*="readium-normalize-on"] h2{ + font-size:1.5rem !important; + font-size:calc((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) !important; } -:root[style*="readium-advanced-on"][style*="--USER__typeScale"] h2 { - font-size: calc((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) !important; +:root[style*="readium-normalize-on"] h3{ + font-size:1.25rem !important; + font-size:calc(1rem * var(--USER__typeScale)) !important; } -:root[style*="readium-advanced-on"][style*="--USER__typeScale"] h3 { - font-size: calc(1rem * var(--USER__typeScale)) !important; +:root[style*="readium-normalize-on"] h4, +:root[style*="readium-normalize-on"] h5, +:root[style*="readium-normalize-on"] h6{ + font-size:1rem !important; } -/* Readium CSS - Default highlights - - A stylesheet for user highlights - - Repo: https://github.com/readium/readium-css */ +:root[style*="readium-normalize-on"] small{ + font-size:smaller !important; +} -/* User Highlights */ +:root[style*="readium-normalize-on"] sub, +:root[style*="readium-normalize-on"] sup{ + font-size:67.5% !important; +} -.readiumCSS-yellow-highlight, -:root[style*="readium-sepia-on"] .readiumCSS-yellow-highlight, -:root[style*="readium-night-on"] .readiumCSS-yellow-highlight { - background-color: rgba(255, 255, 0, 0.5) !important; +:root[style*="readium-normalize-on"][style*="--USER__typeScale"] h1{ + font-size:calc(((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) * var(--USER__typeScale)) !important; } -.readiumCSS-green-highlight, -:root[style*="readium-sepia-on"] .readiumCSS-green-highlight, -:root[style*="readium-night-on"] .readiumCSS-green-highlight { - background-color: rgba(0, 255, 0, 0.5) !important; +:root[style*="readium-normalize-on"][style*="--USER__typeScale"] h2{ + font-size:calc((1rem * var(--USER__typeScale)) * var(--USER__typeScale)) !important; } -.readiumCSS-orange-highlight, -:root[style*="readium-sepia-on"] .readiumCSS-orange-highlight, -:root[style*="readium-night-on"] .readiumCSS-orange-highlight { - background-color: rgba(255, 165, 0, 0.5) !important; +:root[style*="readium-normalize-on"][style*="--USER__typeScale"] h3{ + font-size:calc(1rem * var(--USER__typeScale)) !important; } -.readiumCSS-pink-highlight, -:root[style*="readium-sepia-on"] .readiumCSS-pink-highlight, -:root[style*="readium-night-on"] .readiumCSS-pink-highlight { - background-color: rgba(255, 105, 180, 0.5) !important; +:root[style*="readium-iPadOSPatch-on"] body{ + -webkit-text-size-adjust:none; } -/* Media overlays */ +: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; +} -.readiumCSS-mo-active-default { - color: black !important; - background-color: yellow !important; +: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; } -/*# sourceMappingURL=ReadiumCSS-after.css.map */ + +: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/Sources/Navigator/EPUB/Assets/Static/readium-css/rtl/ReadiumCSS-before.css b/Sources/Navigator/EPUB/Assets/Static/readium-css/rtl/ReadiumCSS-before.css index dcb79fffdd..4271373511 100644 --- a/Sources/Navigator/EPUB/Assets/Static/readium-css/rtl/ReadiumCSS-before.css +++ b/Sources/Navigator/EPUB/Assets/Static/readium-css/rtl/ReadiumCSS-before.css @@ -1,615 +1,526 @@ -/* Readium CSS - Config module +/*! + * Readium CSS v.2.0.5 + * Copyright (c) 2017–2026. 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 + */ - A file allowing implementers to customize flags for reading modes, - user settings, etc. +@namespace url("http://www.w3.org/1999/xhtml"); - Repo: https://github.com/readium/readium-css */ +@namespace epub url("http://www.idpf.org/2007/ops"); -/* Custom medias - Syntax: @custom-media --variable (prop: value) */ +@namespace m url("http://www.w3.org/1998/Math/MathML"); -/* Responsive columns - The minimum width for which responsive columns (2 -> 1 and vice versa, - depending on the current font-size) must be enabled */ +@namespace svg url("http://www.w3.org/2000/svg"); -/* Mobile columns - The minimum and maximum width for mobile devices. - We’re forcing the landscape orientation by default, - and must still investigate large tablets (iPad Pro, Surface Pro 3, etc.). */ +@-ms-viewport{ + width:device-width; +} -/* Custom selectors - Syntax: @custom-selector :--variable selector - The selectors you will use for flags/switches - You can alternatively use classes or custom data-* attributes */ +@viewport{ + width:device-width; + zoom:1; +} -/* User view = paged | scrolled */ +:root{ -/* Font-family override */ + --RS__sans-serif-ja-v:'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ W3', 'YuGothic', 'Yu Gothic Medium', 'BIZ UDGothic', 'Yu Gothic', 'ＭＳゴシック', 'MS Gothic', sans-serif; -/* Advanced settings */ + --RS__serif-ja-v:'Hiragino Mincho ProN', 'Hiragino Mincho Pro', 'YuMincho', 'BIZ UDMincho', 'Yu Mincho', 'ＭＳ明朝', 'MS Mincho', serif; -/* Reading Modes */ + --RS__sans-serif-ja:'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ W3', 'YuGothic', 'Yu Gothic Medium', 'BIZ UDPGothic', 'Yu Gothic', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; -/* Filters (images) */ + --RS__serif-ja:'Hiragino Mincho ProN', 'Hiragino Mincho Pro', 'YuMincho', 'BIZ UDPMincho', 'Yu Mincho', 'ＭＳ Ｐ明朝', 'MS PMincho', serif; -/* Accessibility normalization */ + --RS__monospaceTf:ui-monospace, 'Andale Mono', 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; -/* Accessibility font. You can add selectors, using “, ” as a separator, if you have multiple fonts */ + --RS__humanistTf:Seravek, Calibri, 'Gill Sans Nova', Roboto, Ubuntu, 'DejaVu Sans', source-sans-pro, sans-serif; -/* Direction i.e. ltr and rtl */ + --RS__sansTf:-ui-sans-serif, -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI Variable', 'Segoe UI', Inter, Roboto, 'Helvetica Neue', 'Arial Nova', 'Liberation Sans', Arial, sans-serif; -/* Readium CSS - Namespaces module + --RS__modernTf:Athelas, Constantia, Charter, 'Bitstream Charter', Cambria, 'Georgia Pro', Georgia, serif; - Namespaces to import in all 3 dist stylesheets + --RS__oldStyleTf:'Iowan Old Style', Sitka, 'Sitka Text', Palatino, 'Book Antiqua', 'URW Palladio L', P052, serif; - Repo: https://github.com/readium/readium-css */ + --RS__zh-HK-lineHeightCompensation:1.167; -@namespace url("http://www.w3.org/1999/xhtml"); + --RS__zh-HK-baseFontFamily:'方體', 'PingFang HK', '方體', 'PingFang TC', '黑體', 'Heiti TC', 'Microsoft JhengHei UI', 'Microsoft JhengHei', Roboto, Noto, 'Noto Sans CJK TC', sans-serif; -@namespace epub url("http://www.idpf.org/2007/ops"); + --RS__zh-TW-lineHeightCompensation:1.167; -@namespace m url("http://www.w3.org/1998/Math/MathML/"); + --RS__zh-TW-baseFontFamily:'方體', 'PingFang TC', '黑體', 'Heiti TC', 'Microsoft JhengHei UI', 'Microsoft JhengHei', Roboto, Noto, 'Noto Sans CJK TC', sans-serif; -@namespace svg url("http://www.w3.org/2000/svg"); + --RS__zh-Hant-lineHeightCompensation:1.167; -/* Readium CSS - Base module + --RS__zh-Hant-baseFontFamily:'方體', 'PingFang TC', '黑體', 'Heiti TC', 'Microsoft JhengHei UI', 'Microsoft JhengHei', Roboto, Noto, 'Noto Sans CJK TC', sans-serif; - A minimal stylesheet for all ebooks + --RS__zh-lineHeightCompensation:1.167; - Repo: https://github.com/readium/readium-css */ + --RS__zh-baseFontFamily:'方体', 'PingFang SC', '黑体', 'Heiti SC', 'Microsoft JhengHei UI', 'Microsoft JhengHei', Roboto, Noto, 'Noto Sans CJK SC', sans-serif; -/* Define viewport, HTML5-style */ + --RS__th-lineHeightCompensation:1.067; -@-ms-viewport { - width: device-width; -} + --RS__th-baseFontFamily:Thonburi, 'Leelawadee UI', 'Cordia New', Roboto, Noto, 'Noto Sans Thai', sans-serif; -@viewport { - width: device-width; - zoom: 1; -} + --RS__te-baseFontFamily:'Kohinoor Telugu', 'Telugu Sangam MN', 'Nirmala UI', Gautami, Roboto, Noto, 'Noto Sans Telugu', sans-serif; -:root { - /* Default font-stacks */ - --RS__oldStyleTf: "Iowan Old Style", "Sitka Text", Palatino, "Book Antiqua", serif; - --RS__modernTf: Athelas, Constantia, Georgia, serif; - --RS__sansTf: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; - --RS__humanistTf: Seravek, Calibri, Roboto, Arial, sans-serif; - --RS__monospaceTf: "Andale Mono", Consolas, monospace; + --RS__ta-lineHeightCompensation:1.067; - /* Config */ - --RS__baseFontFamily: var(--RS__oldStyleTf); + --RS__ta-baseFontFamily:'Tamil Sangam MN', 'Nirmala UI', Latha, Roboto, Noto, 'Noto Sans Tamil', sans-serif; - /* For square-ish fonts (CJK, Indic, etc.), we must apply some compensation in dynamic leading. Default is 1 i.e. no compensation */ - --RS__lineHeightCompensation: 1; + --RS__si-lineHeightCompensation:1.167; - /* Dynamic leading based on typeface metrics + font-size setting */ - --RS__baseLineHeight: calc((1em + (2ex - 1ch) - ((1rem - 16px) * 0.1667)) * var(--RS__lineHeightCompensation)); -} + --RS__si-baseFontFamily:'Sinhala Sangam MN', 'Nirmala UI', 'Iskoola Pota', Roboto, Noto, 'Noto Sans Sinhala', sans-serif; -/* Set default font for the html doc, so that it can be overridden by the authors’s stylesheet */ + --RS__pa-lineHeightCompensation:1.1; -html { - font-family: var(--RS__baseFontFamily); - /* Fallback line-height */ - line-height: 1.6; /* Fits a little bit better for all languages than 1.5 */ - line-height: var(--RS__baseLineHeight); - text-rendering: optimizeLegibility; -} + --RS__pa-baseFontFamily:'Gurmukhi MN', 'Nirmala UI', Kartika, Roboto, Noto, 'Noto Sans Gurmukhi', sans-serif; -/* 1.5 being too loose with larger font-sizes, we reset headings to normal (which value is 1.125–1.375 for our font-stacks) */ + --RS__or-lineHeightCompensation:1.167; -h1, h2, h3 { - line-height: normal; -} + --RS__or-baseFontFamily:'Oriya Sangam MN', 'Nirmala UI', Kalinga, Roboto, Noto, 'Noto Sans Oriya', sans-serif; -:lang(ja), -:lang(zh), -:lang(ko) { - word-wrap: break-word; - -webkit-line-break: strict; - -epub-line-break: strict; - line-break: strict; -} + --RS__ml-lineHeightCompensation:1.067; -/* Set default font for Math */ + --RS__ml-baseFontFamily:'Malayalam Sangam MN', 'Nirmala UI', Kartika, Roboto, Noto, 'Noto Sans Malayalam', sans-serif; -math { - font-family: "Latin Modern Math", "STIX Two Math", "XITS Math", "STIX Math", "Libertinus Math", "TeX Gyre Termes Math", "TeX Gyre Bonum Math", "TeX Gyre Schola", "DejaVu Math TeX Gyre", "TeX Gyre Pagella Math", "Asana Math", "Cambria Math", "Lucida Bright Math", "Minion Math", STIXGeneral, STIXSizeOneSym, Symbol, "Times New Roman", serif; -} + --RS__lo-baseFontFamily:'Lao Sangam MN', 'Leelawadee UI', 'Lao UI', Roboto, Noto, 'Noto Sans Lao', sans-serif; -/* Language Overrides - That will only work if either html or body have a (xml:)lang attribute, not for inline overrides */ + --RS__ko-lineHeightCompensation:1.167; -:lang(am) { - --RS__baseFontFamily: Kefa, Nyala, Roboto, Noto, "Noto Sans Ethiopic", serif; - --RS__lineHeightCompensation: 1.167; -} + --RS__ko-baseFontFamily:'Nanum Gothic', 'Apple SD Gothic Neo', 'Malgun Gothic', Roboto, Noto, 'Noto Sans CJK KR', sans-serif; -:lang(ar) { - --RS__baseFontFamily: "Geeza Pro", "Arabic Typesetting", Roboto, Noto, "Noto Naskh Arabic", "Times New Roman", serif; -} + --RS__kn-lineHeightCompensation:1.1; -:lang(bn) { - --RS__baseFontFamily: "Kohinoor Bangla", "Bangla Sangam MN", Vrinda, Roboto, Noto, "Noto Sans Bengali", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__kn-baseFontFamily:'Kannada Sangam MN', 'Nirmala UI', Tunga, Roboto, Noto, 'Noto Sans Kannada', sans-serif; -:lang(bo) { - --RS__baseFontFamily: Kailasa, "Microsoft Himalaya", Roboto, Noto, "Noto Sans Tibetan", sans-serif; -} + --RS__km-lineHeightCompensation:1.067; -:lang(chr) { - --RS__baseFontFamily: "Plantagenet Cherokee", Roboto, Noto, "Noto Sans Cherokee"; - --RS__lineHeightCompensation: 1.167; -} + --RS__km-baseFontFamily:'Khmer Sangam MN', 'Leelawadee UI', 'Khmer UI', Roboto, Noto, 'Noto Sans Khmer', sans-serif; -:lang(fa) { - --RS__baseFontFamily: "Geeza Pro", "Arabic Typesetting", Roboto, Noto, "Noto Naskh Arabic", "Times New Roman", serif; -} + --RS__ja-lineHeightCompensation:1.167; -:lang(gu) { - --RS__baseFontFamily: "Gujarati Sangam MN", "Nirmala UI", Shruti, Roboto, Noto, "Noto Sans Gujarati", sans-serif; - --RS__lineHeightCompensation: 1.167; -} + --RS__ja-baseFontFamily:YuGothic, 'Hiragino Maru Gothic ProN', 'Hiragino Sans', 'Yu Gothic UI', 'Meiryo UI', 'MS Gothic', Roboto, Noto, 'Noto Sans CJK JP', sans-serif; -:lang(he) { - --RS__baseFontFamily: "New Peninim MT", "Arial Hebrew", Gisha, "Times New Roman", Roboto, Noto, "Noto Sans Hebrew" sans-serif; - --RS__lineHeightCompensation: 1.1; -} + --RS__iu-baseFontFamily:'Euphemia UCAS', Euphemia, Roboto, Noto, 'Noto Sans Canadian Aboriginal', sans-serif; -:lang(hi) { - --RS__baseFontFamily: "Kohinoor Devanagari", "Devanagari Sangam MN", Kokila, "Nirmala UI", Roboto, Noto, "Noto Sans Devanagari", sans-serif; + --RS__hy-baseFontFamily:Mshtakan, Sylfaen, Roboto, Noto, 'Noto Serif Armenian', serif; - --RS__lineHeightCompensation: 1.1; -} + --RS__hi-lineHeightCompensation:1.1; -:lang(hy) { - --RS__baseFontFamily: Mshtakan, Sylfaen, Roboto, Noto, "Noto Serif Armenian", serif; -} + --RS__hi-baseFontFamily:'Kohinoor Devanagari', 'Devanagari Sangam MN', Kokila, 'Nirmala UI', Roboto, Noto, 'Noto Sans Devanagari', sans-serif; -:lang(iu) { - --RS__baseFontFamily: "Euphemia UCAS", Euphemia, Roboto, Noto, "Noto Sans Canadian Aboriginal", sans-serif; -} + --RS__he-lineHeightCompensation:1.1; -:lang(ja) { - --RS__baseFontFamily: "游ゴシック体", YuGothic, "ヒラギノ丸ゴ", "Hiragino Sans", "Yu Gothic UI", "Meiryo UI", "MS Gothic", Roboto, Noto, "Noto Sans CJK JP", sans-serif; + --RS__he-baseFontFamily:'New Peninim MT', 'Arial Hebrew', Gisha, 'Times New Roman', Roboto, Noto, 'Noto Sans Hebrew', sans-serif; - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; + --RS__gu-lineHeightCompensation:1.167; - /* Extra variables for Japanese font-stacks as we may want to reuse them for user settings + default */ - --RS__serif-ja: "ＭＳ Ｐ明朝", "MS PMincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "游明朝", "YuMincho", "ＭＳ 明朝", "MS Mincho", "Hiragino Mincho ProN", serif; - --RS__sans-serif-ja: "ＭＳ Ｐゴシック", "MS PGothic", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", "Hiragino Sans GB", "ヒラギノ角ゴシック W3", "游ゴシック", "YuGothic", "ＭＳ ゴシック", "MS Gothic", "Hiragino Sans", sans-serif; - --RS__serif-ja-v: "ＭＳ 明朝", "MS Mincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho", "Hiragino Mincho ProN", serif; - --RS__sans-serif-ja-v: "ＭＳ ゴシック", "MS Gothic", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", "Hiragino Sans GB", "ヒラギノ角ゴシック W3", "游ゴシック", "YuGothic", "ＭＳ Ｐゴシック", "MS PGothic", "Hiragino Sans", sans-serif; -} + --RS__gu-baseFontFamily:'Gujarati Sangam MN', 'Nirmala UI', Shruti, Roboto, Noto, 'Noto Sans Gujarati', sans-serif; -:lang(km) { - --RS__baseFontFamily: "Khmer Sangam MN", "Leelawadee UI", "Khmer UI", Roboto, Noto, "Noto Sans Khmer", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__fa-baseFontFamily:'Geeza Pro', 'Arabic Typesetting', Roboto, Noto, 'Noto Naskh Arabic', 'Times New Roman', serif; -:lang(kn) { - --RS__baseFontFamily: "Kannada Sangam MN", "Nirmala UI", Tunga, Roboto, Noto, "Noto Sans Kannada", sans-serif; - --RS__lineHeightCompensation: 1.1; -} + --RS__chr-lineHeightCompensation:1.167; -:lang(ko) { - --RS__baseFontFamily: "Nanum Gothic", "Apple SD Gothic Neo", "Malgun Gothic", Roboto, Noto, "Noto Sans CJK KR", sans-serif; + --RS__chr-baseFontFamily:'Plantagenet Cherokee', Roboto, Noto, 'Noto Sans Cherokee'; - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; -} + --RS__bo-baseFontFamily:Kailasa, 'Microsoft Himalaya', Roboto, Noto, 'Noto Sans Tibetan', sans-serif; -:lang(lo) { - --RS__baseFontFamily: "Lao Sangam MN", "Leelawadee UI", "Lao UI", Roboto, Noto, "Noto Sans Lao", sans-serif; -} + --RS__bn-lineHeightCompensation:1.067; -:lang(ml) { - --RS__baseFontFamily: "Malayalam Sangam MN", "Nirmala UI", Kartika, Roboto, Noto, "Noto Sans Malayalam", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__bn-baseFontFamily:'Kohinoor Bangla', 'Bangla Sangam MN', Vrinda, Roboto, Noto, 'Noto Sans Bengali', sans-serif; -:lang(or) { - --RS__baseFontFamily: "Oriya Sangam MN", "Nirmala UI", Kalinga, Roboto, Noto, "Noto Sans Oriya", sans-serif; - --RS__lineHeightCompensation: 1.167; -} + --RS__ar-baseFontFamily:'Geeza Pro', 'Arabic Typesetting', Roboto, Noto, 'Noto Naskh Arabic', 'Times New Roman', serif; -:lang(pa) { - --RS__baseFontFamily: "Gurmukhi MN", "Nirmala UI", Kartika, Roboto, Noto, "Noto Sans Gurmukhi", sans-serif; - --RS__lineHeightCompensation: 1.1; -} + --RS__am-lineHeightCompensation:1.167; -:lang(si) { - --RS__baseFontFamily: "Sinhala Sangam MN", "Nirmala UI", "Iskoola Pota", Roboto, Noto, "Noto Sans Sinhala", sans-serif; - --RS__lineHeightCompensation: 1.167; -} + --RS__am-baseFontFamily:Kefa, Nyala, Roboto, Noto, 'Noto Sans Ethiopic', serif; -:lang(ta) { - --RS__baseFontFamily: "Tamil Sangam MN", "Nirmala UI", Latha, Roboto, Noto, "Noto Sans Tamil", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__latin-lineHeightCompensation:1; -:lang(te) { - --RS__baseFontFamily: "Kohinoor Telugu", "Telugu Sangam MN", "Nirmala UI", Gautami, Roboto, Noto, "Noto Sans Telugu", sans-serif; -} + --RS__latin-baseFontFamily:var(--RS__oldStyleTf); + --RS__baseFontFamily:var(--RS__latin-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__latin-lineHeightCompensation); + --RS__baseLineHeight:calc(1.5 * var(--RS__lineHeightCompensation)); -:lang(th) { - --RS__baseFontFamily: "Thonburi", "Leelawadee UI", "Cordia New", Roboto, Noto, "Noto Sans Thai", sans-serif; - --RS__lineHeightCompensation: 1.067; -} + --RS__selectionTextColor:inherit; -/* The following will also work for zh-Hans */ + --RS__selectionBackgroundColor:#b4d8fe; -:lang(zh) { - --RS__baseFontFamily: "方体", "PingFang SC", "黑体", "Heiti SC", "Microsoft JhengHei UI", "Microsoft JhengHei", Roboto, Noto, "Noto Sans CJK SC", sans-serif; + --RS__visitedColor:#551A8B; - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; -} + --RS__linkColor:#0000EE; -:lang(zh-Hant), -:lang(zh-TW) { - --RS__baseFontFamily: "方體", "PingFang TC", "黑體", "Heiti TC", "Microsoft JhengHei UI", "Microsoft JhengHei", Roboto, Noto, "Noto Sans CJK TC", sans-serif; + --RS__textColor:#121212; - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; + --RS__backgroundColor:#FFFFFF; + color:var(--RS__textColor) !important; + + background-color:var(--RS__backgroundColor) !important; } -:lang(zh-HK) { - --RS__baseFontFamily: "方體", "PingFang HK", "方體", "PingFang TC", "黑體", "Heiti TC", "Microsoft JhengHei UI", "Microsoft JhengHei", Roboto, Noto, "Noto Sans CJK TC", sans-serif; +::-moz-selection{ + color:var(--RS__selectionTextColor); + background-color:var(--RS__selectionBackgroundColor); +} - /* For CJK, the line-height is usually 15–20% more than for Latin */ - --RS__lineHeightCompensation: 1.167; +::selection{ + color:var(--RS__selectionTextColor); + background-color:var(--RS__selectionBackgroundColor); } -/* Readium CSS - Day/Default mode +html{ + font-family:var(--RS__baseFontFamily); + line-height:1.6; + line-height:var(--RS__baseLineHeight); + text-rendering:optimizelegibility; +} - A preset theme for day mode, which is the default +h1, h2, h3{ + line-height:normal; +} - Repo: https://github.com/readium/readium-css */ +:lang(ja), +:lang(zh), +:lang(ko){ + word-wrap:break-word; + -webkit-line-break:strict; + -epub-line-break:strict; + line-break:strict; +} -/* CONFIG */ +math{ + font-family:"Latin Modern Math", "STIX Two Math", "XITS Math", "STIX Math", "Libertinus Math", "TeX Gyre Termes Math", "TeX Gyre Bonum Math", "TeX Gyre Schola", "DejaVu Math TeX Gyre", "TeX Gyre Pagella Math", "Asana Math", "Cambria Math", "Lucida Bright Math", "Minion Math", STIXGeneral, STIXSizeOneSym, Symbol, "Times New Roman", serif; +} -:root { - --RS__backgroundColor: #FFFFFF; - --RS__textColor: #121212; +:lang(am){ + --RS__baseFontFamily:var(--RS__am-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__am-lineHeightCompensation); +} - /* This can be customized but initial will re-use default value of the browser */ - --RS__selectionBackgroundColor: #b4d8fe; - --RS__selectionTextColor: inherit; +:lang(ar){ + --RS__baseFontFamily:var(--RS__ar-baseFontFamily); } -:root { - color: var(--RS__textColor) !important; - background-color: var(--RS__backgroundColor) !important; +:lang(bn){ + --RS__baseFontFamily:var(--RS__bn-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__bn-lineHeightCompensation); } -/* Note: Though `::selection` was present in drafts of CSS Selectors Level 3, it was removed during the Candidate Recommendation phase because its behavior was under-specified (especially with nested elements) and interoperability wasn’t achieved. Source: https://developer.mozilla.org/en-US/docs/Web/CSS/::selection */ +:lang(bo){ + --RS__baseFontFamily:var(--RS__bo-baseFontFamily); +} -::-moz-selection { - color: var(--RS__selectionTextColor); - background-color: var(--RS__selectionBackgroundColor); +:lang(chr){ + --RS__baseFontFamily:var(--RS__chr-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__chr-lineHeightCompensation); } -::selection { - color: var(--RS__selectionTextColor); - background-color: var(--RS__selectionBackgroundColor); +:lang(fa){ + --RS__baseFontFamily:var(--RS__fa-baseFontFamily); } -/* @import "modules/ReadiumCSS-fonts.css"; */ +:lang(gu){ + --RS__baseFontFamily:var(--RS__gu-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__gu-lineHeightCompensation); +} -/* Readium CSS - HTML5 SR Patch stylesheet +:lang(he){ + --RS__baseFontFamily:var(--RS__he-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__he-lineHeightCompensation); +} - A set of style to adjust HTML5 Suggested Rendering to paginated content +:lang(hi){ + --RS__baseFontFamily:var(--RS__hi-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__hi-lineHeightCompensation); +} - Repo: https://github.com/readium/readium-css */ +:lang(hy){ + --RS__baseFontFamily:var(--RS__hy-baseFontFamily); +} -/* Fragmentation */ +:lang(iu){ + --RS__baseFontFamily:var(--RS__iu-baseFontFamily); +} -body { - widows: 2; - orphans: 2; +:lang(ja){ + --RS__baseFontFamily:var(--RS__ja-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__ja-lineHeightCompensation); } -figcaption, th, td { - widows: 1; - orphans: 1; +:lang(km){ + --RS__baseFontFamily:var(--RS__km-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__km-lineHeightCompensation); } -h2, -h3, -h4, -h5, -h6, -dt, -hr, -caption { - -webkit-column-break-after: avoid; - page-break-after: avoid; - break-after: avoid; +:lang(kn){ + --RS__baseFontFamily:var(--RS__kn-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__kn-lineHeightCompensation); } -h1, -h2, -h3, -h4, -h5, -h6, -dt, -figure, -tr { - -webkit-column-break-inside: avoid; - page-break-inside: avoid; - break-inside: avoid; +:lang(ko){ + --RS__baseFontFamily:var(--RS__ko-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__ko-lineHeightCompensation); } -/* Hyphenation */ +:lang(lo){ + --RS__baseFontFamily:var(--RS__lo-baseFontFamily); +} -body { - -webkit-hyphenate-character: "\002D"; - -moz-hyphenate-character: "\002D"; - -ms-hyphenate-character: "\002D"; - hyphenate-character: "\002D"; - -webkit-hyphenate-limit-lines: 3; - -ms-hyphenate-limit-lines: 3; - hyphenate-limit-lines: 3; +:lang(ml){ + --RS__baseFontFamily:var(--RS__ml-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__ml-lineHeightCompensation); } -h1, -h2, -h3, -h4, -h5, -h6, -dt, -figcaption, -pre, -caption, -address, -center, -code, -var { - -ms-hyphens: none; - -moz-hyphens: none; - -webkit-hyphens: none; - -epub-hyphens: none; - hyphens: none; +:lang(or){ + --RS__baseFontFamily:var(--RS__or-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__or-lineHeightCompensation); } -/* OTF */ +:lang(pa){ + --RS__baseFontFamily:var(--RS__pa-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__pa-lineHeightCompensation); +} -body { - font-variant-numeric: oldstyle-nums proportional-nums; +:lang(si){ + --RS__baseFontFamily:var(--RS__si-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__si-lineHeightCompensation); } -:lang(ja) body, -:lang(zh) body, -:lang(ko) body { - font-variant-numeric: lining-nums proportional-nums; +:lang(ta){ + --RS__baseFontFamily:var(--RS__ta-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__ta-lineHeightCompensation); } -h1, h2, h3, h4, h5, h6, dt { - font-variant-numeric: lining-nums proportional-nums; +:lang(te){ + --RS__baseFontFamily:var(--RS__te-baseFontFamily); } -table { - font-variant-numeric: lining-nums tabular-nums; +:lang(th){ + --RS__baseFontFamily:var(--RS__th-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__th-lineHeightCompensation); } -code, var { - font-variant-ligatures: none; - font-variant-numeric: lining-nums tabular-nums slashed-zero; +:lang(zh){ + --RS__baseFontFamily:var(--RS__zh-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__zh-lineHeightCompensation); } -rt { - font-variant-east-asian: ruby; +:lang(zh-Hant){ + --RS__baseFontFamily:var(--RS__zh-Hant-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__zh-Hant-lineHeightCompensation); } -:lang(ar) { - font-variant-ligatures: common-ligatures; +:lang(zh-TW){ + --RS__baseFontFamily:var(--RS__zh-TW-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__zh-TW-lineHeightCompensation); } -:lang(ko) { - font-kerning: normal; +:lang(zh-HK){ + --RS__baseFontFamily:var(--RS__zh-HK-baseFontFamily); + --RS__lineHeightCompensation:var(--RS__zh-HK-lineHeightCompensation); } -/* Night mode */ +body{ + widows:2; + orphans:2; +} -hr { - color: inherit; - border-color: currentColor; +figcaption, th, td{ + widows:1; + orphans:1; } -table, th, td { - border-color: currentColor; +h2, h3, h4, h5, h6, dt, +hr, caption{ + -webkit-column-break-after:avoid; + page-break-after:avoid; + break-after:avoid; } -/* Horizontal Spacing */ +h1, h2, h3, h4, h5, h6, dt, +figure, tr{ + -webkit-column-break-inside:avoid; + page-break-inside:avoid; + break-inside:avoid; +} -figure, blockquote { - margin: 1em 5%; +body{ + -webkit-hyphenate-character:"\002D"; + -moz-hyphenate-character:"\002D"; + -ms-hyphenate-character:"\002D"; + hyphenate-character:"\002D"; + -webkit-hyphenate-limit-lines:3; + -ms-hyphenate-limit-lines:3; + hyphenate-limit-lines:3; } -/* +h1, h2, h3, h4, h5, h6, dt, +figcaption, pre, caption, address, +center, code, var{ + -ms-hyphens:none; + -moz-hyphens:none; + -webkit-hyphens:none; + -epub-hyphens:none; + hyphens:none; +} -:lang(ja) figure, :lang(ja) blockquote, -:lang(zh-Hant) figure, :lang(zh-Hant) blockquote, -:lang(zh-TW) figure, :lang(zh-TW) blockquote, -:lang(mn) figure, :lang(mn) blockquote { - margin: 5% 1em; +body{ + font-variant-numeric:oldstyle-nums proportional-nums; } -*/ +:lang(ja) body, +:lang(zh) body, +:lang(ko) body{ + font-variant-numeric:lining-nums proportional-nums; +} -ul, ol { - padding-left: 5%; +h1, h2, h3, h4, h5, h6, dt{ + font-variant-numeric:lining-nums proportional-nums; } -/* +table{ + font-variant-numeric:lining-nums tabular-nums; +} -:lang(ja) ul, :lang(ja) ol, -:lang(zh-Hant) ul, :lang(zh-Hant) ol, -:lang(zh-TW) ul, :lang(zh-TW) ol, -:lang(mn) ul, :lang(mn) ol { - padding-top: 5%; +code, var{ + font-variant-ligatures:none; + font-variant-numeric:lining-nums tabular-nums slashed-zero; } -*/ +rt{ + font-variant-east-asian:ruby; +} -dd { - margin-left: 5%; +:lang(ar){ + font-variant-ligatures:common-ligatures; } -/* +:lang(ko){ + font-kerning:normal; +} -:lang(ja) dd, -:lang(zh-Hant) dd, -:lang(zh-TW) dd, -:lang(mn) dd { - margin-top: 5%; +hr{ + color:inherit; + border-color:currentcolor; } -*/ +table, th, td{ + border-color:currentcolor; +} -pre { - white-space: pre-wrap; - -ms-tab-size: 2; - -moz-tab-size: 2; - -webkit-tab-size: 2; - tab-size: 2; +figure, blockquote{ + margin:1em 5%; } -/* Normalization */ +ul, ol{ + padding-left:5%; +} -abbr[title], acronym[title] { - text-decoration: dotted underline; +dd{ + margin-left:5%; } -nobr wbr { - white-space: normal; +pre{ + white-space:pre-wrap; + -ms-tab-size:2; + -moz-tab-size:2; + -webkit-tab-size:2; + tab-size:2; } -/* Make ruby text and parentheses non-selectable (TBC) */ +abbr[title], acronym[title]{ + text-decoration:dotted underline; +} -ruby > rt, ruby > rp { - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; +nobr wbr{ + white-space:normal; } -/* Internationalization */ +ruby > rt, ruby > rp{ + -webkit-user-select:none; + -moz-user-select:none; + -ms-user-select:none; + user-select:none; +} -*:lang(ja), -*:lang(zh), -*:lang(ko), -:lang(ja) cite, -:lang(ja) dfn, -:lang(ja) em, -:lang(ja) i, -:lang(zh) cite, -:lang(zh) dfn, -:lang(zh) em, -:lang(zh) i, -:lang(ko) cite, -:lang(ko) dfn, -:lang(ko) em, -:lang(ko) i { - font-style: normal; +*:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)), +*:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)), +*:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)), +:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)) cite, +:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)) dfn, +:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)) em, +:lang(ja):not(:lang(ja-Latn)):not(:lang(ja-Cyrl)) i, +:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)) cite, +:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)) dfn, +:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)) em, +:lang(zh):not(:lang(zh-Latn)):not(:lang(zh-Cyrl)) i, +:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)) cite, +:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)) dfn, +:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)) em, +:lang(ko):not(:lang(ko-Latn)):not(:lang(ko-Cyrl)) i{ + font-style:normal; } :lang(ja) a, :lang(zh) a, -:lang(ko) a { - text-decoration: none; +:lang(ko) a{ + text-decoration:none; } -/* Readium CSS - Safeguards module - - A set of styles to prevent common issues in pagination - - Repo: https://github.com/readium/readium-css */ - -/* Config */ - -/* We’ll be using an "RS__" prefix so that we can prevent collisions with authors’ CSS */ - -:root { - /* max-width for media, you can override that via JS if not compiled to static */ - --RS__maxMediaWidth: 100%; - - /* max-height for media, you can override that via JS if not compiled to static - Please consider figures might have a figcaption, which is why 95vh in the first place */ - --RS__maxMediaHeight: 95vh; - - /* value for medias’ box-sizing */ - --RS__boxSizingMedia: border-box; - - /* value for table’s box-sizing */ - --RS__boxSizingTable: border-box; +:root{ + --RS__maxMediaWidth:100%; + --RS__maxMediaHeight:95vh; + --RS__boxSizingMedia:border-box; + --RS__boxSizingTable:border-box; } -/* Sanitize line-heights in webkit e.g. raised cap without a declared line-height - See effect by checking this demo in Safari: https://codepen.io/JayPanoz/pen/gRmzrE - Note: glyphs has to be reset to inline for CJK */ - -html { - -webkit-line-box-contain: block glyphs replaced; +a, a span, span a, h1, h2, h3, h4, h5, h6{ + word-wrap:break-word; } -:lang(ja) { - -webkit-line-box-contain: block inline replaced; +div{ + max-width:var(--RS__maxMediaWidth); } -/* Wrap long strings if larger than line-length */ - -a, h1, h2, h3, h4, h5, h6 { - word-wrap: break-word; -} +img, svg|svg, video{ + object-fit:contain; -div { - max-width: var(--RS__maxMediaWidth); + width:auto; + height:auto; + max-width:var(--RS__maxMediaWidth); + max-height:var(--RS__maxMediaHeight) !important; + box-sizing:var(--RS__boxSizingMedia); + -webkit-column-break-inside:avoid; + page-break-inside:avoid; + break-inside:avoid; } -/* Size medias */ - -/* You can override CSS variables by re-defining it for all elements or a specific one */ - -img, svg, audio, video { +@supports (zoom: 1) and (not ((-webkit-column-axis: horizontal) and (-webkit-column-progression: normal))){ - /* Object-fit allows us to keep the correct aspect-ratio */ - object-fit: contain; - - width: auto; - height: auto; - - /* Some files don’t have max-width */ - max-width: var(--RS__maxMediaWidth); - - /* We’re setting a max-height, especially for covers */ - max-height: var(--RS__maxMediaHeight) !important; - /* We probably don’t need to use modern box-sizing as auto behaves like it */ - box-sizing: var(--RS__boxSizingMedia); - - /* For page-break, we must use those 3 - We can’t use a variable there, webkit seems to no support them for those properties */ - -webkit-column-break-inside: avoid; - page-break-inside: avoid; - break-inside: avoid; + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] img, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] svg|svg, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-deprecatedFontSize-on"]):not([style*="readium-iOSPatch-on"])[style*="--USER__fontSize"] video{ + zoom:calc(100% / var(--USER__fontSize)); + } } -/* Try preventing border being cut-off, webkit + blink have content-box by default */ +audio{ + max-width:100%; + -webkit-column-break-inside:avoid; + page-break-inside:avoid; + break-inside:avoid; + } -table { - max-width: var(--RS__maxMediaWidth); - box-sizing: var(--RS__boxSizingTable); -} -/*# sourceMappingURL=ReadiumCSS-before.css.map */ \ No newline at end of file +table{ + max-width:var(--RS__maxMediaWidth); + box-sizing:var(--RS__boxSizingTable); +} \ No newline at end of file diff --git a/Sources/Navigator/EPUB/Assets/Static/readium-css/rtl/ReadiumCSS-default.css b/Sources/Navigator/EPUB/Assets/Static/readium-css/rtl/ReadiumCSS-default.css index 18bb89311d..bf36c4669a 100644 --- a/Sources/Navigator/EPUB/Assets/Static/readium-css/rtl/ReadiumCSS-default.css +++ b/Sources/Navigator/EPUB/Assets/Static/readium-css/rtl/ReadiumCSS-default.css @@ -1,189 +1,159 @@ -/* Readium CSS - Namespaces module - - Namespaces to import in all 3 dist stylesheets - - Repo: https://github.com/readium/readium-css */ +/*! + * Readium CSS v.2.0.5 + * Copyright (c) 2017–2026. 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 + */ @namespace url("http://www.w3.org/1999/xhtml"); @namespace epub url("http://www.idpf.org/2007/ops"); -@namespace m url("http://www.w3.org/1998/Math/MathML/"); +@namespace m url("http://www.w3.org/1998/Math/MathML"); @namespace svg url("http://www.w3.org/2000/svg"); -/* Readium CSS - Default module for RTL scripts - - A stylesheet for unstyled ebooks based on HTML5 Suggested Rendering - Note: works in combination with Base module - - Repo: https://github.com/readium/readium-css */ +:root{ + --RS__compFontFamily:var(--RS__baseFontFamily); + --RS__codeFontFamily:var(--RS__monospaceTf); -/* CONFIG */ + --RS__typeScale:1.125; + --RS__baseFontSize:100%; -:root { - --RS__compFontFamily: var(--RS__baseFontFamily); - --RS__codeFontFamily: var(--RS__monospaceTf); + --RS__flowSpacing:1.5rem; + --RS__paraSpacing:0; + --RS__paraIndent:1em; - --RS__typeScale: 1.125; /* 1.067 | 1.125 | 1.2 | 1.25 | 1.333 | 1.414 | 1.5 | 1.618 */ - --RS__baseFontSize: 100%; + --RS__linkColor:#0000EE; + --RS__visitedColor:#551A8B; - --RS__flowSpacing: 1.5rem; - --RS__paraSpacing: 0; - --RS__paraIndent: 1em; - - --RS__linkColor: #0000EE; - --RS__visitedColor: #551A8B; - - --RS__primaryColor: ; - --RS__secondaryColor: ; + --RS__primaryColor:; + --RS__secondaryColor:; } -/* STYLES */ - -/* Typo */ - -body { - font-size: var(--RS__baseFontSize); - text-align: justify; +body{ + font-size:var(--RS__baseFontSize); + text-align:justify; } -h1, h2, h3, h4, h5, h6 { - font-family: var(--RS__compFontFamily); - text-align: right; +h1, h2, h3, h4, h5, h6{ + font-family:var(--RS__compFontFamily); + text-align:right; } -/* Flow content */ - -blockquote, -figure, -p, -pre, -aside, -footer, -form, -hr { - margin-top: var(--RS__flowSpacing); - margin-bottom: var(--RS__flowSpacing); +blockquote, figure, p, pre, +aside, footer, form, hr{ + margin-top:var(--RS__flowSpacing); + margin-bottom:var(--RS__flowSpacing); } -p { - margin-top: var(--RS__paraSpacing); - margin-bottom: var(--RS__paraSpacing); - text-indent: var(--RS__paraIndent); +p{ + margin-top:var(--RS__paraSpacing); + margin-bottom:var(--RS__paraSpacing); + text-indent:var(--RS__paraIndent); } -h1 + p, -h2 + p, -h3 + p, -h4 + p, -h5 + p, -h6 + p, -hr + p { - text-indent: 0; +h1 + p, h2 + p, h3 + p, h4 + p, h5 + p, h6 + p, +hr + p{ + text-indent:0; } -pre { - font-family: var(--RS__codeFontFamily); +pre{ + font-family:var(--RS__codeFontFamily); } -/* Phrasing content */ - -code, kbd, samp, tt { - font-family: var(--RS__codeFontFamily); +code, kbd, samp, tt{ + font-family:var(--RS__codeFontFamily); } -sub, sup { - position: relative; - font-size: 67.5%; - line-height: 1; +sub, sup{ + position:relative; + font-size:67.5%; + line-height:1; } -sub { - bottom: -0.2ex; +sub{ + bottom:-0.2ex; } -sup { - bottom: 0; +sup{ + bottom:0; } -:link { - color: var(--RS__linkColor); +:link{ + color:var(--RS__linkColor); } -:visited { - color: var(--RS__visitedColor); +:visited{ + color:var(--RS__visitedColor); } -/* Headings */ - -h1 { - margin-top: calc(var(--RS__flowSpacing) * 2); - margin-bottom: calc(var(--RS__flowSpacing) * 2); - /* The following is base font size * typescale power of 3 */ - font-size: calc(((1em * var(--RS__typeScale)) * var(--RS__typeScale)) * var(--RS__typeScale)); +h1{ + margin-top:calc(var(--RS__flowSpacing) * 2); + margin-bottom:calc(var(--RS__flowSpacing) * 2); + font-size:calc(((1em * var(--RS__typeScale)) * var(--RS__typeScale)) * var(--RS__typeScale)); } -h2 { - margin-top: calc(var(--RS__flowSpacing) * 2); - margin-bottom: var(--RS__flowSpacing); - /* The following is base font size * typescale power of 2 */ - font-size: calc((1em * var(--RS__typeScale)) * var(--RS__typeScale)); +h2{ + margin-top:calc(var(--RS__flowSpacing) * 2); + margin-bottom:var(--RS__flowSpacing); + font-size:calc((1em * var(--RS__typeScale)) * var(--RS__typeScale)); } -h3 { - margin-top: var(--RS__flowSpacing); - margin-bottom: var(--RS__flowSpacing); - font-size: calc(1em * var(--RS__typeScale)); +h3{ + margin-top:var(--RS__flowSpacing); + margin-bottom:var(--RS__flowSpacing); + font-size:calc(1em * var(--RS__typeScale)); } -h4 { - margin-top: var(--RS__flowSpacing); - margin-bottom: var(--RS__flowSpacing); - font-size: 1em; +h4{ + margin-top:var(--RS__flowSpacing); + margin-bottom:var(--RS__flowSpacing); + font-size:1em; } -h5 { - margin-top: var(--RS__flowSpacing); - margin-bottom: var(--RS__flowSpacing); - font-size: smaller; +h5{ + margin-top:var(--RS__flowSpacing); + margin-bottom:var(--RS__flowSpacing); + font-size:smaller; } -h6 { - margin-top: var(--RS__flowSpacing); - margin-bottom: 0; - font-size: smaller; - font-weight: normal; +h6{ + margin-top:var(--RS__flowSpacing); + margin-bottom:0; + font-size:smaller; + font-weight:normal; } -/* Lists */ - -dl, ol, ul { - margin-top: var(--RS__flowSpacing); - margin-bottom: var(--RS__flowSpacing); +dl, ol, ul{ + margin-top:var(--RS__flowSpacing); + margin-bottom:var(--RS__flowSpacing); } -/* Table */ - -table { - margin: var(--RS__flowSpacing) 0; - border: 1px solid currentColor; - border-collapse: collapse; - empty-cells: show; +table{ + margin:var(--RS__flowSpacing) 0; + border:1px solid currentcolor; + border-collapse:collapse; + empty-cells:show; } -thead, tbody, tfoot, table > tr { - vertical-align: top; +thead, tbody, tfoot, table > tr{ + vertical-align:top; } -th { - text-align: initial; +th{ + text-align:initial; } -th, td { - padding: 4px; - border: 1px solid currentColor; -} -/*# sourceMappingURL=ReadiumCSS-default.css.map */ \ No newline at end of file +th, td{ + padding:4px; + border:1px solid currentcolor; +} \ No newline at end of file diff --git a/Sources/Navigator/EPUB/Assets/Static/readium-css/webPub/ReadiumCSS-webPub.css b/Sources/Navigator/EPUB/Assets/Static/readium-css/webPub/ReadiumCSS-webPub.css new file mode 100644 index 0000000000..e2cf6277b3 --- /dev/null +++ b/Sources/Navigator/EPUB/Assets/Static/readium-css/webPub/ReadiumCSS-webPub.css @@ -0,0 +1,274 @@ +/*! + * Readium CSS v.2.0.5 + * Copyright (c) 2017–2026. 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( + blockquote p, + figcaption p, + header p, + hgroup p, + :root[style*="readium-experimentalHeaderFiltering-on"] p[class*="title"], + :root[style*="readium-experimentalHeaderFiltering-on"] div:has(+ *) > h1 + p, + :root[style*="readium-experimentalHeaderFiltering-on"] 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: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__fontFamily"]{ + font-family:var(--USER__fontFamily) !important; +} + +:root[style*="--USER__fontFamily"] *{ + font-family:revert !important; +} + +:root[style*="readium-a11y-on"]{ + font-style:normal !important; + font-weight:normal !important; +} + +: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*="readium-a11y-on"] body *:not(a){ + text-decoration:none !important; +} + +:root[style*="readium-a11y-on"] body *{ + font-variant-caps:normal !important; + font-variant-numeric:normal !important; + font-variant-position:normal !important; +} + +:root[style*="readium-a11y-on"] sup, +: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[style*="readium-experimentalZoom-on"]:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] figure:has(> img), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] figure:has(> video), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] figure:has(> svg), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] figure:has(> canvas), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] figure:has(> iframe), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] figure:has(> audio), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] div:has(> img:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] div:has(> video:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] div:has(> svg:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] div:has(> canvas:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] div:has(> iframe:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] div:has(> audio:only-child), + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] table{ + zoom:calc(100% / var(--USER__zoom)) !important; + } + + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] figcaption, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] caption, + :root[style*="readium-experimentalZoom-on"]:not([style*="readium-iOSPatch-on"])[style*="--USER__zoom"] td, + :root[style*="readium-experimentalZoom-on"]: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:var(--USER__lineHeight) !important; +} + +:root[style*="--USER__paraSpacing"] p{ + margin-top:var(--USER__paraSpacing) !important; + margin-bottom:var(--USER__paraSpacing) !important; +} + +:root[style*="--USER__paraIndent"] p:not( + blockquote p, + figcaption p, + header p, + hgroup p, + :root[style*="readium-experimentalHeaderFiltering-on"] p[class*="title"], + :root[style*="readium-experimentalHeaderFiltering-on"] div:has(+ *) > h1 + p, + :root[style*="readium-experimentalHeaderFiltering-on"] div:has(+ *) > p:has(+ h1) +){ + text-indent:var(--USER__paraIndent) !important; +} + +:root[style*="--USER__paraIndent"] p *{ + 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) !important; +} + +: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) !important; + font-variant:none !important; +} + +: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 From 5186009e1fc236cde496d67038d588c58100f9b8 Mon Sep 17 00:00:00 2001 From: Steven Zeck <8315038+stevenzeck@users.noreply.github.com> Date: Mon, 17 Aug 2026 18:12:49 -0500 Subject: [PATCH 03/21] Add noRuby property --- Sources/Navigator/EPUB/CSS/CSSProperties.swift | 6 ++++++ Sources/Navigator/EPUB/CSS/ReadiumCSS.swift | 1 + .../EPUB/Preferences/EPUBPreferences.swift | 6 ++++++ .../EPUB/Preferences/EPUBPreferencesEditor.swift | 16 ++++++++++++++++ .../EPUB/Preferences/EPUBSettings.swift | 9 +++++++++ .../Common/Preferences/UserPreferences.swift | 12 +++++++++++- .../EPUB/CSS/CSSUserPropertiesTests.swift | 9 +++++++-- 7 files changed, 56 insertions(+), 3 deletions(-) diff --git a/Sources/Navigator/EPUB/CSS/CSSProperties.swift b/Sources/Navigator/EPUB/CSS/CSSProperties.swift index a4765a5d83..c963829665 100644 --- a/Sources/Navigator/EPUB/CSS/CSSProperties.swift +++ b/Sources/Navigator/EPUB/CSS/CSSProperties.swift @@ -162,6 +162,9 @@ public struct CSSUserProperties: CSSProperties, Sendable { /// Requires: fontOverride public var a11yNormalize: Bool? + /// Hiding/disabling ruby (furigana) annotations. + public var noRuby: Bool? + /// Additional overrides for extensions and adjustments. public var overrides: [String: String?] @@ -188,6 +191,7 @@ public struct CSSUserProperties: CSSProperties, Sendable { bodyHyphens: CSSHyphens? = nil, ligatures: CSSLigatures? = nil, a11yNormalize: Bool? = nil, + noRuby: Bool? = nil, overrides: [String: String?] = [:] ) { self.view = view @@ -212,6 +216,7 @@ public struct CSSUserProperties: CSSProperties, Sendable { self.bodyHyphens = bodyHyphens self.ligatures = ligatures self.a11yNormalize = a11yNormalize + self.noRuby = noRuby self.overrides = overrides } @@ -252,6 +257,7 @@ public struct CSSUserProperties: CSSProperties, Sendable { // Accessibility props.putCSS(name: "--USER__a11yNormalize", value: CSSFlag(name: "a11y", isEnabled: a11yNormalize)) + props.putCSS(name: "--USER__noRuby", value: CSSFlag(name: "noRuby", isEnabled: noRuby)) props.merge(overrides, uniquingKeysWith: { _, n in n }) return props diff --git a/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift b/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift index b2cc55b060..e80d06e7ce 100644 --- a/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift +++ b/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift @@ -69,6 +69,7 @@ extension ReadiumCSS { .map { String(format: "%.0f", (Double(CSSStandardFontWeight.normal.rawValue) * $0).clamped(to: 1 ... 1000)) } ?? "", ] + noRuby: settings.noRuby, ) } diff --git a/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift b/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift index 248620fd53..d635b672cb 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift @@ -52,6 +52,9 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { /// Leading line height. public var lineHeight: Double? + /// Hiding/disabling ruby (furigana) annotations. + public var noRuby: Bool? + /// Indicates whether the first page should be displayed alone and centered /// instead of alongside the second page. /// @@ -120,6 +123,7 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { letterSpacing: Double? = nil, ligatures: Bool? = nil, lineHeight: Double? = nil, + noRuby: Bool? = nil, offsetFirstPage: Bool? = nil, pageMargins: Double? = nil, paragraphIndent: Double? = nil, @@ -148,6 +152,7 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { self.letterSpacing = letterSpacing.map { max($0, 0) } self.ligatures = ligatures self.lineHeight = lineHeight + self.noRuby = noRuby self.offsetFirstPage = offsetFirstPage self.pageMargins = pageMargins.map { max($0, 0) } self.paragraphIndent = paragraphIndent @@ -179,6 +184,7 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { letterSpacing: other.letterSpacing ?? letterSpacing, ligatures: other.ligatures ?? ligatures, lineHeight: other.lineHeight ?? lineHeight, + noRuby: other.noRuby ?? noRuby, offsetFirstPage: other.offsetFirstPage ?? offsetFirstPage, pageMargins: other.pageMargins ?? pageMargins, paragraphIndent: other.paragraphIndent ?? paragraphIndent, diff --git a/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift b/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift index 986a05af65..c2debfcf44 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift @@ -227,6 +227,22 @@ public final class EPUBPreferencesEditor: StatefulPreferencesEditor = + preference( + preference: \.noRuby, + setting: \.noRuby, + defaultEffectiveValue: defaults.noRuby ?? false, + isEffective: { [layout] in + layout == .reflowable + && [.cjkHorizontal, .cjkVertical].contains($0.settings.cssLayout.stylesheets) + } + ) + /// Indicates whether the first page should be displayed alone and centered /// instead of alongside the second page. /// diff --git a/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift b/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift index 53210b232e..05c0f815ee 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift @@ -23,6 +23,7 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { public var letterSpacing: Double? public var ligatures: Bool? public var lineHeight: Double? + public var noRuby: Bool public var offsetFirstPage: Bool? public var pageMargins: Double public var paragraphIndent: Double? @@ -58,6 +59,7 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { letterSpacing: Double?, ligatures: Bool?, lineHeight: Double?, + noRuby: Bool = false, offsetFirstPage: Bool?, pageMargins: Double, paragraphIndent: Double?, @@ -86,6 +88,7 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { self.letterSpacing = letterSpacing self.ligatures = ligatures self.lineHeight = lineHeight + self.noRuby = noRuby self.offsetFirstPage = offsetFirstPage self.pageMargins = pageMargins self.paragraphIndent = paragraphIndent @@ -165,6 +168,9 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { ?? defaults.ligatures, lineHeight: preferences.lineHeight ?? defaults.lineHeight, + noRuby: preferences.noRuby + ?? defaults.noRuby + ?? false, offsetFirstPage: preferences.offsetFirstPage ?? defaults.offsetFirstPage, pageMargins: preferences.pageMargins @@ -216,6 +222,7 @@ public struct EPUBDefaults: Sendable { public var letterSpacing: Double? public var ligatures: Bool? public var lineHeight: Double? + public var noRuby: Bool? public var offsetFirstPage: Bool? public var pageMargins: Double? public var paragraphIndent: Double? @@ -240,6 +247,7 @@ public struct EPUBDefaults: Sendable { letterSpacing: Double? = nil, ligatures: Bool? = nil, lineHeight: Double? = nil, + noRuby: Bool? = nil, offsetFirstPage: Bool? = nil, pageMargins: Double? = nil, paragraphIndent: Double? = nil, @@ -263,6 +271,7 @@ public struct EPUBDefaults: Sendable { self.letterSpacing = letterSpacing self.ligatures = ligatures self.lineHeight = lineHeight + self.noRuby = noRuby self.offsetFirstPage = offsetFirstPage self.pageMargins = pageMargins self.paragraphIndent = paragraphIndent diff --git a/TestApp/Sources/Reader/Common/Preferences/UserPreferences.swift b/TestApp/Sources/Reader/Common/Preferences/UserPreferences.swift index 01b91297e3..0ba52e8b1e 100644 --- a/TestApp/Sources/Reader/Common/Preferences/UserPreferences.swift +++ b/TestApp/Sources/Reader/Common/Preferences/UserPreferences.swift @@ -115,6 +115,7 @@ struct UserPreferences< letterSpacing: editor.letterSpacing, ligatures: editor.ligatures, lineHeight: editor.lineHeight, + noRuby: editor.noRuby, pageMargins: editor.pageMargins, paragraphIndent: editor.paragraphIndent, paragraphSpacing: editor.paragraphSpacing, @@ -330,6 +331,7 @@ struct UserPreferences< letterSpacing: AnyRangePreference? = nil, ligatures: AnyPreference? = nil, lineHeight: AnyRangePreference? = nil, + noRuby: AnyPreference? = nil, pageMargins: AnyRangePreference? = nil, paragraphIndent: AnyRangePreference? = nil, paragraphSpacing: AnyRangePreference? = nil, @@ -344,7 +346,7 @@ struct UserPreferences< verticalText: AnyPreference? = nil, wordSpacing: AnyRangePreference? = nil ) -> some View { - if language != nil || readingProgression != nil || verticalText != nil { + if language != nil || readingProgression != nil || verticalText != nil || noRuby != nil { Section { if let language = language { languageRow( @@ -375,6 +377,14 @@ struct UserPreferences< commit: commit ) } + + if let noRuby = noRuby { + toggleRow( + title: "Hide ruby annotations", + preference: noRuby, + commit: commit + ) + } } } diff --git a/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift b/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift index 61cdc151b1..f7207635fa 100644 --- a/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift +++ b/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift @@ -35,6 +35,7 @@ class CSSUserPropertiesTests: XCTestCase { "--USER__bodyHyphens": nil, "--USER__ligatures": nil, "--USER__a11yNormalize": nil, + "--USER__noRuby": nil, ] ) } @@ -63,7 +64,8 @@ class CSSUserPropertiesTests: XCTestCase { letterSpacing: CSSRemLength(8.9), bodyHyphens: .auto, ligatures: .common, - a11yNormalize: true + a11yNormalize: true, + noRuby: true ).cssProperties(), [ "--USER__view": "readium-scroll-on", @@ -88,6 +90,7 @@ class CSSUserPropertiesTests: XCTestCase { "--USER__bodyHyphens": "auto", "--USER__ligatures": "common-ligatures", "--USER__a11yNormalize": "readium-a11y-on", + "--USER__noRuby": "readium-noRuby-on", ] ) } @@ -147,7 +150,8 @@ class CSSUserPropertiesTests: XCTestCase { letterSpacing: CSSRemLength(8.9), bodyHyphens: .auto, ligatures: .common, - a11yNormalize: true + a11yNormalize: true, + noRuby: true ).css(), """ --USER__a11yNormalize: readium-a11y-on !important; @@ -164,6 +168,7 @@ class CSSUserPropertiesTests: XCTestCase { --USER__letterSpacing: 8.90000rem !important; --USER__ligatures: common-ligatures !important; --USER__lineHeight: 4.50000pt !important; + --USER__noRuby: readium-noRuby-on !important; --USER__pageMargins: 1.20000 !important; --USER__paraIndent: 6.70000rem !important; --USER__paraSpacing: 5.60000pt !important; From dd488cd8da36317420a692bc5aaca5a653613598 Mon Sep 17 00:00:00 2001 From: Steven Zeck <8315038+stevenzeck@users.noreply.github.com> Date: Mon, 17 Aug 2026 18:14:19 -0500 Subject: [PATCH 04/21] Replace maxLineLength with defaultLineLength --- .../Navigator/EPUB/CSS/CSSProperties.swift | 98 ++++++++++++++++++- .../EPUB/CSS/CSSRSPropertiesTests.swift | 16 ++- 2 files changed, 106 insertions(+), 8 deletions(-) diff --git a/Sources/Navigator/EPUB/CSS/CSSProperties.swift b/Sources/Navigator/EPUB/CSS/CSSProperties.swift index c963829665..23770c9606 100644 --- a/Sources/Navigator/EPUB/CSS/CSSProperties.swift +++ b/Sources/Navigator/EPUB/CSS/CSSProperties.swift @@ -296,9 +296,15 @@ public struct CSSRSProperties: CSSProperties, Sendable { // Safeguards - /// @param maxLineLength The optimal line-length. It must be set in rem in order to take :root’s + /// @param defaultLineLength The optimal line-length. 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. - public var maxLineLength: CSSRemLength? + public var defaultLineLength: CSSRemLength? + + @available(*, deprecated, renamed: "defaultLineLength") + public var maxLineLength: CSSRemLength? { + get { defaultLineLength } + set { defaultLineLength = newValue } + } /// @param maxMediaWidth The max-width for media elements i.e. img, svg, audio and video. public var maxMediaWidth: CSSLength? @@ -411,7 +417,7 @@ public struct CSSRSProperties: CSSProperties, Sendable { flowSpacing: CSSLength? = nil, paraSpacing: CSSLength? = nil, paraIndent: CSSLength? = nil, - maxLineLength: CSSRemLength? = nil, + defaultLineLength: CSSRemLength? = nil, maxMediaWidth: CSSLength? = nil, maxMediaHeight: CSSLength? = nil, boxSizingMedia: CSSBoxSizing? = nil, @@ -447,7 +453,7 @@ public struct CSSRSProperties: CSSProperties, Sendable { self.flowSpacing = flowSpacing self.paraSpacing = paraSpacing self.paraIndent = paraIndent - self.maxLineLength = maxLineLength + self.defaultLineLength = defaultLineLength self.maxMediaWidth = maxMediaWidth self.maxMediaHeight = maxMediaHeight self.boxSizingMedia = boxSizingMedia @@ -477,6 +483,88 @@ public struct CSSRSProperties: CSSProperties, Sendable { self.overrides = overrides } + @available(*, deprecated, message: "Use init with defaultLineLength instead") + public init( + colWidth: CSSLength? = nil, + colCount: CSSColCount? = nil, + colGap: CSSAbsoluteLength? = nil, + pageGutter: CSSAbsoluteLength? = nil, + flowSpacing: CSSLength? = nil, + paraSpacing: CSSLength? = nil, + paraIndent: CSSLength? = nil, + maxLineLength: CSSRemLength?, + maxMediaWidth: CSSLength? = nil, + maxMediaHeight: CSSLength? = nil, + boxSizingMedia: CSSBoxSizing? = nil, + boxSizingTable: CSSBoxSizing? = nil, + textColor: CSSColor? = nil, + backgroundColor: CSSColor? = nil, + selectionTextColor: CSSColor? = nil, + selectionBackgroundColor: CSSColor? = nil, + linkColor: CSSColor? = nil, + visitedColor: CSSColor? = nil, + primaryColor: CSSColor? = nil, + secondaryColor: CSSColor? = nil, + typeScale: Double? = nil, + baseFontFamily: [String]? = nil, + baseLineHeight: CSSLineHeight? = nil, + oldStyleTf: [String]? = nil, + modernTf: [String]? = nil, + sansTf: [String]? = nil, + humanistTf: [String]? = nil, + monospaceTf: [String]? = nil, + serifJa: [String]? = nil, + sansSerifJa: [String]? = nil, + serifJaV: [String]? = nil, + sansSerifJaV: [String]? = nil, + compFontFamily: [String]? = nil, + codeFontFamily: [String]? = nil, + overrides: [String: String?] = [:] + ) { + self.init( + viewportWidth: nil, + colWidth: colWidth, + colCount: colCount, + colGap: colGap, + pageGutter: pageGutter, + scrollPaddingTop: nil, + scrollPaddingBottom: nil, + scrollPaddingLeft: nil, + scrollPaddingRight: nil, + flowSpacing: flowSpacing, + paraSpacing: paraSpacing, + paraIndent: paraIndent, + defaultLineLength: maxLineLength, + maxMediaWidth: maxMediaWidth, + maxMediaHeight: maxMediaHeight, + boxSizingMedia: boxSizingMedia, + boxSizingTable: boxSizingTable, + textColor: textColor, + backgroundColor: backgroundColor, + selectionTextColor: selectionTextColor, + selectionBackgroundColor: selectionBackgroundColor, + linkColor: linkColor, + visitedColor: visitedColor, + primaryColor: primaryColor, + secondaryColor: secondaryColor, + typeScale: typeScale, + baseFontFamily: baseFontFamily, + baseLineHeight: baseLineHeight, + oldStyleTf: oldStyleTf, + modernTf: modernTf, + sansTf: sansTf, + humanistTf: humanistTf, + monospaceTf: monospaceTf, + serifJa: serifJa, + sansSerifJa: sansSerifJa, + serifJaV: serifJaV, + sansSerifJaV: sansSerifJaV, + compFontFamily: compFontFamily, + codeFontFamily: codeFontFamily, + overrides: overrides + ) + } + public func cssProperties() -> [String: String?] { var props: [String: String?] = [:] @@ -492,7 +580,7 @@ public struct CSSRSProperties: CSSProperties, Sendable { props.putCSS(name: "--RS__paraIndent", value: paraIndent) // Safeguards - props.putCSS(name: "--RS__maxLineLength", value: maxLineLength) + props.putCSS(name: "--RS__defaultLineLength", value: defaultLineLength) props.putCSS(name: "--RS__maxMediaWidth", value: maxMediaWidth) props.putCSS(name: "--RS__maxMediaHeight", value: maxMediaHeight) props.putCSS(name: "--RS__boxSizingMedia", value: boxSizingMedia) diff --git a/Tests/NavigatorTests/EPUB/CSS/CSSRSPropertiesTests.swift b/Tests/NavigatorTests/EPUB/CSS/CSSRSPropertiesTests.swift index f77423b170..fbc3ef3d6d 100644 --- a/Tests/NavigatorTests/EPUB/CSS/CSSRSPropertiesTests.swift +++ b/Tests/NavigatorTests/EPUB/CSS/CSSRSPropertiesTests.swift @@ -20,7 +20,7 @@ class CSSRSPropertiesTests: XCTestCase { "--RS__flowSpacing": nil, "--RS__paraSpacing": nil, "--RS__paraIndent": nil, - "--RS__maxLineLength": nil, + "--RS__defaultLineLength": nil, "--RS__maxMediaWidth": nil, "--RS__maxMediaHeight": nil, "--RS__boxSizingMedia": nil, @@ -74,7 +74,7 @@ class CSSRSPropertiesTests: XCTestCase { flowSpacing: CSSMmLength(4.5), paraSpacing: CSSPxLength(5.6), paraIndent: CSSEmLength(6.7), - maxLineLength: CSSRemLength(7.8), + defaultLineLength: CSSRemLength(7.8), maxMediaWidth: CSSPercentLength(0.5), maxMediaHeight: CSSVwLength(9.10), boxSizingMedia: .borderBox, @@ -110,7 +110,7 @@ class CSSRSPropertiesTests: XCTestCase { "--RS__flowSpacing": "4.50000mm", "--RS__paraSpacing": "5.60000px", "--RS__paraIndent": "6.70000em", - "--RS__maxLineLength": "7.80000rem", + "--RS__defaultLineLength": "7.80000rem", "--RS__maxMediaWidth": "50.00000%", "--RS__maxMediaHeight": "9.10000vw", "--RS__boxSizingMedia": "border-box", @@ -140,4 +140,14 @@ class CSSRSPropertiesTests: XCTestCase { ] ) } + + func testDeprecatedMaxLineLength() { + var props = CSSRSProperties(maxLineLength: CSSRemLength(5.0)) + XCTAssertEqual(props.defaultLineLength?.value, 5.0) + XCTAssertEqual(props.maxLineLength?.value, 5.0) + + props.maxLineLength = CSSRemLength(6.0) + XCTAssertEqual(props.defaultLineLength?.value, 6.0) + XCTAssertEqual(props.cssProperties()["--RS__defaultLineLength"], "6.00000rem") + } } From 560b49209742ccaffada86ea2c0b8aea6f9a8be6 Mon Sep 17 00:00:00 2001 From: Steven Zeck <8315038+stevenzeck@users.noreply.github.com> Date: Mon, 17 Aug 2026 18:14:59 -0500 Subject: [PATCH 05/21] Add additional properties --- .../Navigator/EPUB/CSS/CSSProperties.swift | 30 +++++++++++++++++++ .../EPUB/CSS/CSSRSPropertiesTests.swift | 15 ++++++++++ 2 files changed, 45 insertions(+) diff --git a/Sources/Navigator/EPUB/CSS/CSSProperties.swift b/Sources/Navigator/EPUB/CSS/CSSProperties.swift index 23770c9606..9c90f7f8a8 100644 --- a/Sources/Navigator/EPUB/CSS/CSSProperties.swift +++ b/Sources/Navigator/EPUB/CSS/CSSProperties.swift @@ -270,6 +270,9 @@ public struct CSSUserProperties: CSSProperties, Sendable { public struct CSSRSProperties: CSSProperties, Sendable { // Pagination + /// @param viewportWidth The optimal viewport width. + public var viewportWidth: CSSLength? + /// @param colWidth The optimal column’s width. It serves as a floor in our design. public var colWidth: CSSLength? @@ -282,6 +285,18 @@ public struct CSSRSProperties: CSSProperties, Sendable { /// @param pageGutter The horizontal page margins. public var pageGutter: CSSAbsoluteLength? + /// @param scrollPaddingTop The default top padding for continuous scroll mode. + public var scrollPaddingTop: CSSLength? + + /// @param scrollPaddingBottom The default bottom padding for continuous scroll mode. + public var scrollPaddingBottom: CSSLength? + + /// @param scrollPaddingLeft The default left padding for continuous scroll mode. + public var scrollPaddingLeft: CSSLength? + + /// @param scrollPaddingRight The default right padding for continuous scroll mode. + public var scrollPaddingRight: CSSLength? + // Vertical rhythm /// @param flowSpacing The default vertical margins for HTML5 flow content e.g. pre, figure, @@ -410,10 +425,15 @@ public struct CSSRSProperties: CSSProperties, Sendable { public var overrides: [String: String?] public init( + viewportWidth: CSSLength? = nil, colWidth: CSSLength? = nil, colCount: CSSColCount? = nil, colGap: CSSAbsoluteLength? = nil, pageGutter: CSSAbsoluteLength? = nil, + scrollPaddingTop: CSSLength? = nil, + scrollPaddingBottom: CSSLength? = nil, + scrollPaddingLeft: CSSLength? = nil, + scrollPaddingRight: CSSLength? = nil, flowSpacing: CSSLength? = nil, paraSpacing: CSSLength? = nil, paraIndent: CSSLength? = nil, @@ -446,10 +466,15 @@ public struct CSSRSProperties: CSSProperties, Sendable { codeFontFamily: [String]? = nil, overrides: [String: String?] = [:] ) { + self.viewportWidth = viewportWidth self.colWidth = colWidth self.colCount = colCount self.colGap = colGap self.pageGutter = pageGutter + self.scrollPaddingTop = scrollPaddingTop + self.scrollPaddingBottom = scrollPaddingBottom + self.scrollPaddingLeft = scrollPaddingLeft + self.scrollPaddingRight = scrollPaddingRight self.flowSpacing = flowSpacing self.paraSpacing = paraSpacing self.paraIndent = paraIndent @@ -569,10 +594,15 @@ public struct CSSRSProperties: CSSProperties, Sendable { var props: [String: String?] = [:] // Pagination + props.putCSS(name: "--RS__viewportWidth", value: viewportWidth) props.putCSS(name: "--RS__colWidth", value: colWidth) props.putCSS(name: "--RS__colCount", value: colCount) props.putCSS(name: "--RS__colGap", value: colGap) props.putCSS(name: "--RS__pageGutter", value: pageGutter) + props.putCSS(name: "--RS__scrollPaddingTop", value: scrollPaddingTop) + props.putCSS(name: "--RS__scrollPaddingBottom", value: scrollPaddingBottom) + props.putCSS(name: "--RS__scrollPaddingLeft", value: scrollPaddingLeft) + props.putCSS(name: "--RS__scrollPaddingRight", value: scrollPaddingRight) // Vertical rhythm props.putCSS(name: "--RS__flowSpacing", value: flowSpacing) diff --git a/Tests/NavigatorTests/EPUB/CSS/CSSRSPropertiesTests.swift b/Tests/NavigatorTests/EPUB/CSS/CSSRSPropertiesTests.swift index fbc3ef3d6d..b644e29f1a 100644 --- a/Tests/NavigatorTests/EPUB/CSS/CSSRSPropertiesTests.swift +++ b/Tests/NavigatorTests/EPUB/CSS/CSSRSPropertiesTests.swift @@ -13,10 +13,15 @@ class CSSRSPropertiesTests: XCTestCase { XCTAssertEqual( CSSRSProperties().cssProperties(), [ + "--RS__viewportWidth": nil, "--RS__colWidth": nil, "--RS__colCount": nil, "--RS__colGap": nil, "--RS__pageGutter": nil, + "--RS__scrollPaddingTop": nil, + "--RS__scrollPaddingBottom": nil, + "--RS__scrollPaddingLeft": nil, + "--RS__scrollPaddingRight": nil, "--RS__flowSpacing": nil, "--RS__paraSpacing": nil, "--RS__paraIndent": nil, @@ -67,10 +72,15 @@ class CSSRSPropertiesTests: XCTestCase { func testConvertFullPropertiesToCSSProperties() { XCTAssertEqual( CSSRSProperties( + viewportWidth: CSSPercentLength(1.0), colWidth: CSSCmLength(1.2), colCount: .two, colGap: CSSPtLength(2.3), pageGutter: CSSPcLength(3.4), + scrollPaddingTop: CSSPxLength(10), + scrollPaddingBottom: CSSPxLength(20), + scrollPaddingLeft: CSSPxLength(15), + scrollPaddingRight: CSSPxLength(25), flowSpacing: CSSMmLength(4.5), paraSpacing: CSSPxLength(5.6), paraIndent: CSSEmLength(6.7), @@ -103,10 +113,15 @@ class CSSRSPropertiesTests: XCTestCase { codeFontFamily: ["Monaco", "Console Sans"] ).cssProperties(), [ + "--RS__viewportWidth": "100.00000%", "--RS__colWidth": "1.20000cm", "--RS__colCount": "2", "--RS__colGap": "2.30000pt", "--RS__pageGutter": "3.40000pc", + "--RS__scrollPaddingTop": "10.00000px", + "--RS__scrollPaddingBottom": "20.00000px", + "--RS__scrollPaddingLeft": "15.00000px", + "--RS__scrollPaddingRight": "25.00000px", "--RS__flowSpacing": "4.50000mm", "--RS__paraSpacing": "5.60000px", "--RS__paraIndent": "6.70000em", From f67bb65e1b7fb698cc3f1747fb68f7bccd078d18 Mon Sep 17 00:00:00 2001 From: Steven Zeck <8315038+stevenzeck@users.noreply.github.com> Date: Mon, 17 Aug 2026 18:15:15 -0500 Subject: [PATCH 06/21] Add overrides --- Sources/Navigator/EPUB/CSS/ReadiumCSS.swift | 49 ++++++++++++++++++--- 1 file changed, 43 insertions(+), 6 deletions(-) diff --git a/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift b/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift index e80d06e7ce..8ca00b6c40 100644 --- a/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift +++ b/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift @@ -6,6 +6,7 @@ import Foundation import ReadiumShared +import UIKit struct ReadiumCSS { var layout: CSSLayout = .init() @@ -19,13 +20,53 @@ struct ReadiumCSS { } extension ReadiumCSS { + @MainActor mutating func update(with settings: EPUBSettings) { layout = settings.cssLayout + + var overrides: [String: String] = [ + // See https://github.com/readium/css/issues/183 + "--RS__disableOverflow": "readium-noOverflow-on", + + "font-weight": settings.fontWeight + .map { String(format: "%.0f", (Double(CSSStandardFontWeight.normal.rawValue) * $0).clamped(to: 1 ... 1000)) } + ?? "", + ] + + let baseGutter = 20.0 + let gutterString = String(format: "%.5fpx", baseGutter * settings.pageMargins) + overrides["--RS__pageGutter"] = gutterString + + if settings.scroll { + if settings.verticalText { + overrides["--RS__scrollPaddingTop"] = gutterString + overrides["--RS__scrollPaddingBottom"] = gutterString + } else { + overrides["--RS__scrollPaddingLeft"] = gutterString + overrides["--RS__scrollPaddingRight"] = gutterString + } + } + + // Applies WebKit patches, ideally: + // - iOS patch for iOS and iPadOS when the site is requested as mobile. + // - iPadOSPatch for iPadOS when the site is requested as desktop. + // - Nothing if MacOS. + // + // See https://github.com/readium/css/issues/189 + switch UIDevice.current.userInterfaceIdiom { + case .pad: + overrides["--USER__iPadOSPatch"] = "readium-iPadOSPatch-on" + case .phone: + overrides["--USER__iOSPatch"] = "readium-iOSPatch-on" + default: + break + } + userProperties = CSSUserProperties( view: settings.scroll ? .scroll : .paged, colCount: { switch settings.columnCount { - case .auto: return .auto + case .auto: return nil case .one: return .one case .two: return .two } @@ -64,12 +105,8 @@ extension ReadiumCSS { bodyHyphens: settings.hyphens.map { $0 ? .auto : .none }, ligatures: settings.ligatures.map { $0 ? .common : .none }, a11yNormalize: settings.textNormalization, - overrides: [ - "font-weight": settings.fontWeight - .map { String(format: "%.0f", (Double(CSSStandardFontWeight.normal.rawValue) * $0).clamped(to: 1 ... 1000)) } - ?? "", - ] noRuby: settings.noRuby, + overrides: overrides ) } From 2d1919a862bd5760827a414c216b743132966264 Mon Sep 17 00:00:00 2001 From: Steven Zeck <8315038+stevenzeck@users.noreply.github.com> Date: Mon, 17 Aug 2026 18:15:27 -0500 Subject: [PATCH 07/21] Add tests --- .../EPUB/CSS/ReadiumCSSTests.swift | 36 +++++++++++++++++++ 1 file changed, 36 insertions(+) diff --git a/Tests/NavigatorTests/EPUB/CSS/ReadiumCSSTests.swift b/Tests/NavigatorTests/EPUB/CSS/ReadiumCSSTests.swift index 064713c46d..bfe35e8986 100644 --- a/Tests/NavigatorTests/EPUB/CSS/ReadiumCSSTests.swift +++ b/Tests/NavigatorTests/EPUB/CSS/ReadiumCSSTests.swift @@ -385,4 +385,40 @@ class ReadiumCSSTests: XCTestCase { """ ) } + + @MainActor + func testUpdateWithSettingsComputesPageGutter() { + var css = ReadiumCSS(baseURL: baseURL) + let settings = EPUBSettings( + preferences: EPUBPreferences(pageMargins: 1.5), + defaults: EPUBDefaults(), + metadata: Metadata(title: "Test") + ) + css.update(with: settings) + + XCTAssertEqual( + css.userProperties.cssProperties()["--RS__pageGutter"], + "30.00000px" + ) + } + + @MainActor + func testUpdateWithScrollSettingsComputesScrollPadding() { + var css = ReadiumCSS(baseURL: baseURL) + let settings = EPUBSettings( + preferences: EPUBPreferences(pageMargins: 1.5, scroll: true), + defaults: EPUBDefaults(), + metadata: Metadata(title: "Test") + ) + css.update(with: settings) + + XCTAssertEqual( + css.userProperties.cssProperties()["--RS__scrollPaddingLeft"], + "30.00000px" + ) + XCTAssertEqual( + css.userProperties.cssProperties()["--RS__scrollPaddingRight"], + "30.00000px" + ) + } } From 5b7b258011424b9c5d664a62730c023c13433474 Mon Sep 17 00:00:00 2001 From: Steven Zeck <8315038+stevenzeck@users.noreply.github.com> Date: Mon, 17 Aug 2026 18:15:37 -0500 Subject: [PATCH 08/21] Update documentation --- CHANGELOG.md | 18 +++++++++++++++++- docs/Guides/Navigator/Preferences.md | 3 +++ docs/Migration Guide.md | 12 +++++++++++- 3 files changed, 31 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index e0bd52e15f..a809952ca8 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,7 +3,23 @@ All notable changes to this project will be documented in this file. Take a look at [the migration guide](docs/Migration%20Guide.md) to upgrade between two major versions. - +## [Unreleased] + +### Added + +#### Navigator + +* Upgraded Readium CSS to version 2.0.5. +* Added the `noRuby` preference to `EPUBPreferences`, `EPUBSettings`, `EPUBDefaults`, and `EPUBPreferencesEditor` to allow hiding ruby (furigana) annotations in CJK publications. +* Added `CSSRSProperties.defaultLineLength`, `viewportWidth`, `scrollPaddingTop`, `scrollPaddingBottom`, `scrollPaddingLeft`, and `scrollPaddingRight` to configure Readium CSS v2 reading system properties. +* Added optional CSS minification to the build scripts (`make scripts minify=true`). + +### Changed + +#### Navigator + +* `CSSRSProperties.maxLineLength` is deprecated in favor of `defaultLineLength` to match Readium CSS v2. + ## [4.0.0-alpha.1] - 2026-08-14 diff --git a/docs/Guides/Navigator/Preferences.md b/docs/Guides/Navigator/Preferences.md index f971d0cae3..29e935b244 100644 --- a/docs/Guides/Navigator/Preferences.md +++ b/docs/Guides/Navigator/Preferences.md @@ -388,6 +388,8 @@ EPUB comes in two very different flavors: **reflowable** which allows a lot of c | `letterSpacing` | :white_check_mark: | | | `ligatures` | :white_check_mark: | | | `lineHeight` | :white_check_mark: | | +| `noRuby` | :white_check_mark: | | +| `offsetFirstPage` | | :white_check_mark: | | `pageMargins` | :white_check_mark: | | | `paragraphIndent` | :white_check_mark: | | | `paragraphSpacing` | :white_check_mark: | | @@ -437,6 +439,7 @@ Some preferences are not available for all languages and layout. | `wordSpacing` | :white_check_mark: | | | | `hyphens` | :white_check_mark: | | | | `ligatures` | | :white_check_mark: | | +| `noRuby` | | | :white_check_mark: | ### PDF diff --git a/docs/Migration Guide.md b/docs/Migration Guide.md index fdb984c5e7..fa2f8c7104 100644 --- a/docs/Migration Guide.md +++ b/docs/Migration Guide.md @@ -2,7 +2,17 @@ All migration steps necessary in reading apps to upgrade to major versions of the Swift Readium toolkit will be documented in this file. - +## Unreleased + +### Readium CSS v2 and `CSSRSProperties` + +Readium CSS has been upgraded to version 2. If you configure custom Reading System properties via `CSSRSProperties`, note that `maxLineLength` is deprecated in favor of `defaultLineLength`: + +```diff +-CSSRSProperties(maxLineLength: CSSRemLength(40)) ++CSSRSProperties(defaultLineLength: CSSRemLength(40)) +``` + ## 4.0.0-alpha.1 From 4a4d140a4054b782b9ae824f57594e8dc10a5194 Mon Sep 17 00:00:00 2001 From: Steven Zeck <8315038+stevenzeck@users.noreply.github.com> Date: Mon, 17 Aug 2026 18:20:35 -0500 Subject: [PATCH 09/21] Convert CSS tests to Swift testing --- .../EPUB/CSS/CSSLayoutTests.swift | 14 +-- .../EPUB/CSS/CSSRSPropertiesTests.swift | 34 +++-- .../EPUB/CSS/CSSUserPropertiesTests.swift | 42 +++---- .../EPUB/CSS/ReadiumCSSTests.swift | 116 ++++++++---------- 4 files changed, 92 insertions(+), 114 deletions(-) diff --git a/Tests/NavigatorTests/EPUB/CSS/CSSLayoutTests.swift b/Tests/NavigatorTests/EPUB/CSS/CSSLayoutTests.swift index 12a9b13aa9..ee8a42ce24 100644 --- a/Tests/NavigatorTests/EPUB/CSS/CSSLayoutTests.swift +++ b/Tests/NavigatorTests/EPUB/CSS/CSSLayoutTests.swift @@ -6,13 +6,13 @@ @testable import ReadiumNavigator import ReadiumShared -import XCTest +import Testing -class CSSLayoutTests: XCTestCase { - func testComputeHTMLDiStylesheets() { - XCTAssertEqual(CSSLayout.Stylesheets.default.htmlDir, .ltr) - XCTAssertEqual(CSSLayout.Stylesheets.rtl.htmlDir, .rtl) - XCTAssertEqual(CSSLayout.Stylesheets.cjkVertical.htmlDir, .unspecified) - XCTAssertEqual(CSSLayout.Stylesheets.cjkHorizontal.htmlDir, .ltr) +struct CSSLayoutTests { + @Test func computeHTMLDiStylesheets() { + #expect(CSSLayout.Stylesheets.default.htmlDir == .ltr) + #expect(CSSLayout.Stylesheets.rtl.htmlDir == .rtl) + #expect(CSSLayout.Stylesheets.cjkVertical.htmlDir == .unspecified) + #expect(CSSLayout.Stylesheets.cjkHorizontal.htmlDir == .ltr) } } diff --git a/Tests/NavigatorTests/EPUB/CSS/CSSRSPropertiesTests.swift b/Tests/NavigatorTests/EPUB/CSS/CSSRSPropertiesTests.swift index b644e29f1a..757ba3e4dc 100644 --- a/Tests/NavigatorTests/EPUB/CSS/CSSRSPropertiesTests.swift +++ b/Tests/NavigatorTests/EPUB/CSS/CSSRSPropertiesTests.swift @@ -6,13 +6,12 @@ @testable import ReadiumNavigator import ReadiumShared -import XCTest +import Testing -class CSSRSPropertiesTests: XCTestCase { - func convertEmptyPropertiesToCSSProperties() { - XCTAssertEqual( - CSSRSProperties().cssProperties(), - [ +struct CSSRSPropertiesTests { + @Test func convertEmptyPropertiesToCSSProperties() { + #expect( + CSSRSProperties().cssProperties() == [ "--RS__viewportWidth": nil, "--RS__colWidth": nil, "--RS__colCount": nil, @@ -56,7 +55,7 @@ class CSSRSPropertiesTests: XCTestCase { ) } - func testOverrideProperties() { + @Test func overrideProperties() { let props = CSSRSProperties( colCount: .one, overrides: [ @@ -65,12 +64,12 @@ class CSSRSPropertiesTests: XCTestCase { ] ).cssProperties() - XCTAssertEqual(props["--RS__colCount"], "2") - XCTAssertEqual(props["--RS__custom"], "value") + #expect(props["--RS__colCount"] == "2") + #expect(props["--RS__custom"] == "value") } - func testConvertFullPropertiesToCSSProperties() { - XCTAssertEqual( + @Test func convertFullPropertiesToCSSProperties() { + #expect( CSSRSProperties( viewportWidth: CSSPercentLength(1.0), colWidth: CSSCmLength(1.2), @@ -111,8 +110,7 @@ class CSSRSPropertiesTests: XCTestCase { sansSerifJaV: ["Sans serif", "JaV"], compFontFamily: ["Arial"], codeFontFamily: ["Monaco", "Console Sans"] - ).cssProperties(), - [ + ).cssProperties() == [ "--RS__viewportWidth": "100.00000%", "--RS__colWidth": "1.20000cm", "--RS__colCount": "2", @@ -156,13 +154,13 @@ class CSSRSPropertiesTests: XCTestCase { ) } - func testDeprecatedMaxLineLength() { + @Test func deprecatedMaxLineLength() { var props = CSSRSProperties(maxLineLength: CSSRemLength(5.0)) - XCTAssertEqual(props.defaultLineLength?.value, 5.0) - XCTAssertEqual(props.maxLineLength?.value, 5.0) + #expect(props.defaultLineLength?.value == 5.0) + #expect(props.maxLineLength?.value == 5.0) props.maxLineLength = CSSRemLength(6.0) - XCTAssertEqual(props.defaultLineLength?.value, 6.0) - XCTAssertEqual(props.cssProperties()["--RS__defaultLineLength"], "6.00000rem") + #expect(props.defaultLineLength?.value == 6.0) + #expect(props.cssProperties()["--RS__defaultLineLength"] == "6.00000rem") } } diff --git a/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift b/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift index f7207635fa..883a6e64e8 100644 --- a/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift +++ b/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift @@ -6,13 +6,12 @@ @testable import ReadiumNavigator import ReadiumShared -import XCTest +import Testing -class CSSUserPropertiesTests: XCTestCase { - func testConvertEmptyUserPropertiesToCSSProperties() { - XCTAssertEqual( - CSSUserProperties().cssProperties(), - [ +struct CSSUserPropertiesTests { + @Test func convertEmptyUserPropertiesToCSSProperties() { + #expect( + CSSUserProperties().cssProperties() == [ "--USER__view": nil, "--USER__colCount": nil, "--USER__pageMargins": nil, @@ -40,8 +39,8 @@ class CSSUserPropertiesTests: XCTestCase { ) } - func testConvertFullUserPropertiesToCSSProperties() { - XCTAssertEqual( + @Test func convertFullUserPropertiesToCSSProperties() { + #expect( CSSUserProperties( view: .scroll, colCount: .auto, @@ -66,8 +65,7 @@ class CSSUserPropertiesTests: XCTestCase { ligatures: .common, a11yNormalize: true, noRuby: true - ).cssProperties(), - [ + ).cssProperties() == [ "--USER__view": "readium-scroll-on", "--USER__colCount": "auto", "--USER__pageMargins": "1.20000", @@ -95,7 +93,7 @@ class CSSUserPropertiesTests: XCTestCase { ) } - func testOverrideUserProperties() { + @Test func overrideUserProperties() { let props = CSSUserProperties( colCount: .one, overrides: [ @@ -104,21 +102,20 @@ class CSSUserPropertiesTests: XCTestCase { ] ).cssProperties() - XCTAssertEqual(props["--USER__colCount"], "2") - XCTAssertEqual(props["--USER__custom"], "value") + #expect(props["--USER__colCount"] == "2") + #expect(props["--USER__custom"] == "value") } - func testGenerateEmptyInlineCSSProperties() { - XCTAssertEqual(CSSUserProperties().css(), nil) + @Test func generateEmptyInlineCSSProperties() { + #expect(CSSUserProperties().css() == nil) } - func testGenerateMinimalInlineCSSProperties() { - XCTAssertEqual( + @Test func generateMinimalInlineCSSProperties() { + #expect( CSSUserProperties( view: .scroll, colCount: .auto - ).css(), - """ + ).css() == """ --USER__colCount: auto !important; --USER__view: readium-scroll-on !important; @@ -126,8 +123,8 @@ class CSSUserPropertiesTests: XCTestCase { ) } - func testGenerateFullInlineCSSProperties() { - XCTAssertEqual( + @Test func generateFullInlineCSSProperties() { + #expect( CSSUserProperties( view: .scroll, colCount: .auto, @@ -152,8 +149,7 @@ class CSSUserPropertiesTests: XCTestCase { ligatures: .common, a11yNormalize: true, noRuby: true - ).css(), - """ + ).css() == """ --USER__a11yNormalize: readium-a11y-on !important; --USER__advancedSettings: readium-advanced-on !important; --USER__appearance: readium-night-on !important; diff --git a/Tests/NavigatorTests/EPUB/CSS/ReadiumCSSTests.swift b/Tests/NavigatorTests/EPUB/CSS/ReadiumCSSTests.swift index bfe35e8986..e1d1348053 100644 --- a/Tests/NavigatorTests/EPUB/CSS/ReadiumCSSTests.swift +++ b/Tests/NavigatorTests/EPUB/CSS/ReadiumCSSTests.swift @@ -6,9 +6,9 @@ @testable import ReadiumNavigator import ReadiumShared -import XCTest +import Testing -class ReadiumCSSTests: XCTestCase { +struct ReadiumCSSTests { let baseURL = HTTPURL(string: "https://readium/assets")! let viewportMeta = HTMLInjection.meta(name: "viewport", content: "width=device-width, height=device-height, initial-scale=1.0") @@ -38,7 +38,7 @@ class ReadiumCSSTests: XCTestCase { """ - func testInjectionsWithoutAnyStyle() { + @Test func injectionsWithoutAnyStyle() throws { let css = ReadiumCSS( layout: CSSLayout(), rsProperties: CSSRSProperties(), @@ -46,9 +46,8 @@ class ReadiumCSSTests: XCTestCase { baseURL: baseURL ) - XCTAssertEqual( - try css.injections(for: html), - [ + #expect( + try css.injections(for: html) == [ viewportMeta, cssBefore(), cssDefault(), @@ -61,7 +60,7 @@ class ReadiumCSSTests: XCTestCase { ) } - func testInjectionsWithPublicationStyles() { + @Test func injectionsWithPublicationStyles() throws { let css = ReadiumCSS( layout: CSSLayout(), rsProperties: CSSRSProperties(), @@ -69,8 +68,8 @@ class ReadiumCSSTests: XCTestCase { baseURL: baseURL ) - XCTAssertFalse( - try css.injections(for: """ + #expect( + try !css.injections(for: """ @@ -82,8 +81,8 @@ class ReadiumCSSTests: XCTestCase { """).contains(cssDefault()) ) - XCTAssertFalse( - try css.injections(for: """ + #expect( + try !css.injections(for: """ @@ -95,8 +94,8 @@ class ReadiumCSSTests: XCTestCase { """).contains(cssDefault()) ) - XCTAssertFalse( - try css.injections(for: """ + #expect( + try !css.injections(for: """ @@ -110,7 +109,7 @@ class ReadiumCSSTests: XCTestCase { ) } - func testInjectionsWithReadiumCSSProperties() { + @Test func injectionsWithReadiumCSSProperties() throws { let css = ReadiumCSS( layout: CSSLayout(), rsProperties: CSSRSProperties( @@ -124,9 +123,8 @@ class ReadiumCSSTests: XCTestCase { baseURL: baseURL ) - XCTAssertEqual( - try css.injections(for: html), - [ + #expect( + try css.injections(for: html) == [ viewportMeta, cssBefore(), cssDefault(), @@ -145,7 +143,7 @@ class ReadiumCSSTests: XCTestCase { ) } - func testInjectRTLDirStylesheets() { + @Test func injectRTLDirStylesheets() throws { let css = ReadiumCSS( layout: CSSLayout(stylesheets: .rtl), rsProperties: CSSRSProperties(), @@ -153,9 +151,8 @@ class ReadiumCSSTests: XCTestCase { baseURL: baseURL ) - XCTAssertEqual( - try css.injections(for: html), - [ + #expect( + try css.injections(for: html) == [ viewportMeta, cssBefore(folder: "rtl/"), cssDefault(folder: "rtl/"), @@ -168,7 +165,7 @@ class ReadiumCSSTests: XCTestCase { ) } - func testInjectCJKHorizontalStylesheets() { + @Test func injectCJKHorizontalStylesheets() throws { let css = ReadiumCSS( layout: CSSLayout(stylesheets: .cjkHorizontal), rsProperties: CSSRSProperties(), @@ -176,9 +173,8 @@ class ReadiumCSSTests: XCTestCase { baseURL: baseURL ) - XCTAssertEqual( - try css.injections(for: html), - [ + #expect( + try css.injections(for: html) == [ viewportMeta, cssBefore(folder: "cjk-horizontal/"), cssDefault(folder: "cjk-horizontal/"), @@ -191,7 +187,7 @@ class ReadiumCSSTests: XCTestCase { ) } - func testInjectCJKVerticalStylesheets() { + @Test func injectCJKVerticalStylesheets() throws { let css = ReadiumCSS( layout: CSSLayout(stylesheets: .cjkVertical), rsProperties: CSSRSProperties(), @@ -199,9 +195,8 @@ class ReadiumCSSTests: XCTestCase { baseURL: baseURL ) - XCTAssertEqual( - try css.injections(for: html), - [ + #expect( + try css.injections(for: html) == [ viewportMeta, cssBefore(folder: "cjk-vertical/"), cssDefault(folder: "cjk-vertical/"), @@ -212,14 +207,14 @@ class ReadiumCSSTests: XCTestCase { ) } - func testInjectLangAttributes() { + @Test func injectLangAttributes() throws { let language = Language(code: .bcp47("en")) let css = ReadiumCSS( layout: CSSLayout(language: language), baseURL: baseURL ) - XCTAssertEqual( + #expect( try css.injections(for: """ @@ -228,8 +223,7 @@ class ReadiumCSSTests: XCTestCase { - """), - [ + """) == [ viewportMeta, cssBefore(), cssDefault(), @@ -244,13 +238,13 @@ class ReadiumCSSTests: XCTestCase { ) } - func testInjectLangAttributesWhenOneExistsOnHTMLTag() { + @Test func injectLangAttributesWhenOneExistsOnHTMLTag() throws { let css = ReadiumCSS( layout: CSSLayout(language: Language(code: .bcp47("en"))), baseURL: baseURL ) - XCTAssertEqual( + #expect( try css.injections(for: """ @@ -259,8 +253,7 @@ class ReadiumCSSTests: XCTestCase { - """), - [ + """) == [ viewportMeta, cssBefore(), cssDefault(), @@ -273,13 +266,13 @@ class ReadiumCSSTests: XCTestCase { ) } - func testInjectLangAttributesCopiesTheOneFromBodyTag() { + @Test func injectLangAttributesCopiesTheOneFromBodyTag() throws { let css = ReadiumCSS( layout: CSSLayout(language: Language(code: .bcp47("en"))), baseURL: baseURL ) - XCTAssertEqual( + #expect( try css.injections(for: """ @@ -288,8 +281,7 @@ class ReadiumCSSTests: XCTestCase { - """), - [ + """) == [ viewportMeta, cssBefore(), cssDefault(), @@ -305,15 +297,14 @@ class ReadiumCSSTests: XCTestCase { // MARK: - langInjections(for:) via injections(for:) - func testNoLangInjectionWhenNoLanguageSet() { + @Test func noLangInjectionWhenNoLanguageSet() throws { let css = ReadiumCSS( layout: CSSLayout(), baseURL: baseURL ) - XCTAssertEqual( - try css.injections(for: html), - [ + #expect( + try css.injections(for: html) == [ viewportMeta, cssBefore(), cssDefault(), @@ -326,14 +317,14 @@ class ReadiumCSSTests: XCTestCase { ) } - func testLangInjectionFallsBackToLayoutLangWhenBodyLangIsEmpty() { + @Test func langInjectionFallsBackToLayoutLangWhenBodyLangIsEmpty() throws { let language = Language(code: .bcp47("en")) let css = ReadiumCSS( layout: CSSLayout(language: language), baseURL: baseURL ) - XCTAssertEqual( + #expect( try css.injections(for: """ @@ -342,8 +333,7 @@ class ReadiumCSSTests: XCTestCase { - """), - [ + """) == [ viewportMeta, cssBefore(), cssDefault(), @@ -358,13 +348,13 @@ class ReadiumCSSTests: XCTestCase { ) } - func testInjectDirAttributeWhenAlreadyPresent() { + @Test func injectDirAttributeWhenAlreadyPresent() throws { let css = ReadiumCSS( layout: CSSLayout(language: Language(code: .bcp47("en"))), baseURL: baseURL ) - XCTAssertEqual( + #expect( try css.inject(in: """ @@ -373,8 +363,7 @@ class ReadiumCSSTests: XCTestCase { - """), - """ + """) == """ @@ -386,8 +375,7 @@ class ReadiumCSSTests: XCTestCase { ) } - @MainActor - func testUpdateWithSettingsComputesPageGutter() { + @Test @MainActor func updateWithSettingsComputesPageGutter() { var css = ReadiumCSS(baseURL: baseURL) let settings = EPUBSettings( preferences: EPUBPreferences(pageMargins: 1.5), @@ -396,14 +384,12 @@ class ReadiumCSSTests: XCTestCase { ) css.update(with: settings) - XCTAssertEqual( - css.userProperties.cssProperties()["--RS__pageGutter"], - "30.00000px" + #expect( + css.userProperties.cssProperties()["--RS__pageGutter"] == "30.00000px" ) } - @MainActor - func testUpdateWithScrollSettingsComputesScrollPadding() { + @Test @MainActor func updateWithScrollSettingsComputesScrollPadding() { var css = ReadiumCSS(baseURL: baseURL) let settings = EPUBSettings( preferences: EPUBPreferences(pageMargins: 1.5, scroll: true), @@ -412,13 +398,11 @@ class ReadiumCSSTests: XCTestCase { ) css.update(with: settings) - XCTAssertEqual( - css.userProperties.cssProperties()["--RS__scrollPaddingLeft"], - "30.00000px" + #expect( + css.userProperties.cssProperties()["--RS__scrollPaddingLeft"] == "30.00000px" ) - XCTAssertEqual( - css.userProperties.cssProperties()["--RS__scrollPaddingRight"], - "30.00000px" + #expect( + css.userProperties.cssProperties()["--RS__scrollPaddingRight"] == "30.00000px" ) } } From 6aff721a82d15404b21d2c215a7354069bc9fb00 Mon Sep 17 00:00:00 2001 From: Steven Zeck <8315038+stevenzeck@users.noreply.github.com> Date: Tue, 18 Aug 2026 11:06:55 -0500 Subject: [PATCH 10/21] Change columnCount from enum to Int --- CHANGELOG.md | 1 + .../Navigator/EPUB/CSS/CSSProperties.swift | 20 +++++++++++-------- Sources/Navigator/EPUB/CSS/ReadiumCSS.swift | 8 +------- .../Preferences/EPUBPreferences+Legacy.swift | 2 +- .../EPUB/Preferences/EPUBPreferences.swift | 6 ++++-- .../Preferences/EPUBPreferencesEditor.swift | 10 ++++++---- .../EPUB/Preferences/EPUBSettings.swift | 12 ++++++----- Sources/Navigator/Preferences/Types.swift | 7 ------- .../EPUB/CSS/CSSRSPropertiesTests.swift | 4 ++-- .../EPUB/CSS/CSSUserPropertiesTests.swift | 14 ++++++------- docs/Guides/Navigator/Preferences.md | 2 +- docs/Migration Guide.md | 11 ++++++++++ 12 files changed, 53 insertions(+), 44 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index a809952ca8..0a9b9da3d6 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -19,6 +19,7 @@ All notable changes to this project will be documented in this file. Take a look #### Navigator * `CSSRSProperties.maxLineLength` is deprecated in favor of `defaultLineLength` to match Readium CSS v2. +* Changed `columnCount` preference in `EPUBPreferences`, `EPUBSettings`, and `EPUBDefaults` to `Int` to support arbitrary column counts. The `ColumnCount` enum is removed. ## [4.0.0-alpha.1] - 2026-08-14 diff --git a/Sources/Navigator/EPUB/CSS/CSSProperties.swift b/Sources/Navigator/EPUB/CSS/CSSProperties.swift index 9c90f7f8a8..338ccf0c4f 100644 --- a/Sources/Navigator/EPUB/CSS/CSSProperties.swift +++ b/Sources/Navigator/EPUB/CSS/CSSProperties.swift @@ -43,11 +43,10 @@ public struct CSSUserProperties: CSSProperties, Sendable { // Pagination - /// The number of columns (column-count) the user wants displayed (one-page view or two-page - /// spread). + /// The number of columns (column-count) the user wants displayed. /// - /// To reset, change the value to auto. - public var colCount: CSSColCount? + /// To reset, change the value to 0. + public var colCount: Int? /// A factor applied to horizontal margins (padding-left and padding-right) the user wants to /// set. @@ -170,7 +169,7 @@ public struct CSSUserProperties: CSSProperties, Sendable { public init( view: CSSView? = nil, - colCount: CSSColCount? = nil, + colCount: Int? = nil, pageMargins: Double? = nil, appearance: CSSAppearance? = nil, darkenImages: Bool? = nil, @@ -277,7 +276,7 @@ public struct CSSRSProperties: CSSProperties, Sendable { public var colWidth: CSSLength? /// @param colCount The optimal number of columns (depending on the columns’ width). - public var colCount: CSSColCount? + public var colCount: Int? /// @param colGap The gap between columns. You must account for this gap when scrolling. public var colGap: CSSAbsoluteLength? @@ -427,7 +426,7 @@ public struct CSSRSProperties: CSSProperties, Sendable { public init( viewportWidth: CSSLength? = nil, colWidth: CSSLength? = nil, - colCount: CSSColCount? = nil, + colCount: Int? = nil, colGap: CSSAbsoluteLength? = nil, pageGutter: CSSAbsoluteLength? = nil, scrollPaddingTop: CSSLength? = nil, @@ -511,7 +510,7 @@ public struct CSSRSProperties: CSSProperties, Sendable { @available(*, deprecated, message: "Use init with defaultLineLength instead") public init( colWidth: CSSLength? = nil, - colCount: CSSColCount? = nil, + colCount: Int? = nil, colGap: CSSAbsoluteLength? = nil, pageGutter: CSSAbsoluteLength? = nil, flowSpacing: CSSLength? = nil, @@ -1006,6 +1005,11 @@ private extension Dictionary where Key == String, Value == String? { self[name] = value?.css() } + mutating func putCSS(name: String, value: Int?) { + let css = value.map { String(format: "%d", $0) } + self[name] = css + } + mutating func putCSS(name: String, value: Double?) { let css = value.map { String(format: "%.5f", $0) } self[name] = css diff --git a/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift b/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift index 8ca00b6c40..3e7913c72b 100644 --- a/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift +++ b/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift @@ -64,13 +64,7 @@ extension ReadiumCSS { userProperties = CSSUserProperties( view: settings.scroll ? .scroll : .paged, - colCount: { - switch settings.columnCount { - case .auto: return nil - case .one: return .one - case .two: return .two - } - }(), + colCount: settings.columnCount, pageMargins: settings.pageMargins, appearance: { switch settings.theme { diff --git a/Sources/Navigator/EPUB/Preferences/EPUBPreferences+Legacy.swift b/Sources/Navigator/EPUB/Preferences/EPUBPreferences+Legacy.swift index b70a9af8d4..cf8f2e1342 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBPreferences+Legacy.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBPreferences+Legacy.swift @@ -35,7 +35,7 @@ public extension EPUBPreferences { .flatMap { Color(hex: $0) }, columnCount: defaults.optInt(for: .columnCount) .flatMap { (columnCountValues ?? defaultColumnCountValues).getOrNil($0) } - .flatMap { ColumnCount(rawValue: $0) }, + .flatMap { Int($0) }, fontFamily: defaults.optInt(for: .fontFamily) .takeIf { $0 != 0 } // Original .flatMap { (fontFamilyValues ?? defaultFontFamilyValues).getOrNil($0) } diff --git a/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift b/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift index d635b672cb..4fbb999861 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift @@ -16,7 +16,9 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { /// Number of reflowable columns to display (one-page view or two-page /// spread). - public var columnCount: ColumnCount? + /// + /// Use `0` for an automatic number of columns, depending on the viewport size. + public var columnCount: Int? /// Method for fitting the content of a fixed-layout publication within the /// viewport. @@ -112,7 +114,7 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { public init( backgroundColor: Color? = nil, - columnCount: ColumnCount? = nil, + columnCount: Int? = nil, fit: Fit? = nil, fontFamily: FontFamily? = nil, fontSize: Double? = nil, diff --git a/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift b/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift index c2debfcf44..602f0348e3 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift @@ -53,16 +53,18 @@ public final class EPUBPreferencesEditor: StatefulPreferencesEditor = - enumPreference( + public lazy var columnCount: AnyRangePreference = + rangePreference( preference: \.columnCount, setting: \.columnCount, - defaultEffectiveValue: defaults.columnCount ?? .auto, + defaultEffectiveValue: defaults.columnCount ?? 1, isEffective: { [layout] in layout == .reflowable && !$0.settings.scroll }, - supportedValues: [.auto, .one, .two] + supportedRange: 1 ... 9, + progressionStrategy: .increment(1), + format: { String(format: "%d", $0) } ) /// Method for fitting the content within the viewport. diff --git a/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift b/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift index 05c0f815ee..359adfa789 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift @@ -12,7 +12,9 @@ import ReadiumShared /// See `EPUBPreferences` public struct EPUBSettings: ConfigurableSettings, Sendable { public var backgroundColor: Color? - public var columnCount: ColumnCount + /// Number of reflowable columns to display (one-page view or two-page spread). + /// `0` means automatic column count. + public var columnCount: Int public var fit: Fit public var fontFamily: FontFamily? public var fontSize: Double @@ -48,7 +50,7 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { public init( backgroundColor: Color?, - columnCount: ColumnCount, + columnCount: Int, fit: Fit, fontFamily: FontFamily?, fontSize: Double, @@ -147,7 +149,7 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { backgroundColor: preferences.backgroundColor, columnCount: preferences.columnCount ?? defaults.columnCount - ?? .auto, + ?? 0, fit: preferences.fit ?? defaults.fit ?? .auto, @@ -212,7 +214,7 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { /// /// See `EPUBPreferences`. public struct EPUBDefaults: Sendable { - public var columnCount: ColumnCount? + public var columnCount: Int? public var fit: Fit? public var fontSize: Double? public var fontWeight: Double? @@ -237,7 +239,7 @@ public struct EPUBDefaults: Sendable { public var wordSpacing: Double? public init( - columnCount: ColumnCount? = nil, + columnCount: Int? = nil, fit: Fit? = nil, fontSize: Double? = nil, fontWeight: Double? = nil, diff --git a/Sources/Navigator/Preferences/Types.swift b/Sources/Navigator/Preferences/Types.swift index a91d145cdf..a7588fbfef 100644 --- a/Sources/Navigator/Preferences/Types.swift +++ b/Sources/Navigator/Preferences/Types.swift @@ -92,13 +92,6 @@ public enum Theme: String, Codable, Hashable, Sendable { private static let sepiaBackgroundColor = Color(hex: "#faf4e8")! } -/// Number of columns displayed in a reflowable document. -public enum ColumnCount: String, Codable, Hashable, Sendable { - case auto - case one = "1" - case two = "2" -} - /// Filter used to render images in a reflowable document. public enum ImageFilter: String, Codable, Hashable, Sendable { case darken diff --git a/Tests/NavigatorTests/EPUB/CSS/CSSRSPropertiesTests.swift b/Tests/NavigatorTests/EPUB/CSS/CSSRSPropertiesTests.swift index 757ba3e4dc..e5f08ede05 100644 --- a/Tests/NavigatorTests/EPUB/CSS/CSSRSPropertiesTests.swift +++ b/Tests/NavigatorTests/EPUB/CSS/CSSRSPropertiesTests.swift @@ -57,7 +57,7 @@ struct CSSRSPropertiesTests { @Test func overrideProperties() { let props = CSSRSProperties( - colCount: .one, + colCount: 1, overrides: [ "--RS__colCount": "2", "--RS__custom": "value", @@ -73,7 +73,7 @@ struct CSSRSPropertiesTests { CSSRSProperties( viewportWidth: CSSPercentLength(1.0), colWidth: CSSCmLength(1.2), - colCount: .two, + colCount: 2, colGap: CSSPtLength(2.3), pageGutter: CSSPcLength(3.4), scrollPaddingTop: CSSPxLength(10), diff --git a/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift b/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift index 883a6e64e8..9a01a30165 100644 --- a/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift +++ b/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift @@ -43,7 +43,7 @@ struct CSSUserPropertiesTests { #expect( CSSUserProperties( view: .scroll, - colCount: .auto, + colCount: 0, pageMargins: 1.2, appearance: .night, darkenImages: true, @@ -67,7 +67,7 @@ struct CSSUserPropertiesTests { noRuby: true ).cssProperties() == [ "--USER__view": "readium-scroll-on", - "--USER__colCount": "auto", + "--USER__colCount": "0", "--USER__pageMargins": "1.20000", "--USER__appearance": "readium-night-on", "--USER__darkenImages": "readium-darken-on", @@ -95,7 +95,7 @@ struct CSSUserPropertiesTests { @Test func overrideUserProperties() { let props = CSSUserProperties( - colCount: .one, + colCount: 1, overrides: [ "--USER__colCount": "2", "--USER__custom": "value", @@ -114,9 +114,9 @@ struct CSSUserPropertiesTests { #expect( CSSUserProperties( view: .scroll, - colCount: .auto + colCount: 0 ).css() == """ - --USER__colCount: auto !important; + --USER__colCount: 0 !important; --USER__view: readium-scroll-on !important; """ @@ -127,7 +127,7 @@ struct CSSUserPropertiesTests { #expect( CSSUserProperties( view: .scroll, - colCount: .auto, + colCount: 0, pageMargins: 1.2, appearance: .night, darkenImages: true, @@ -155,7 +155,7 @@ struct CSSUserPropertiesTests { --USER__appearance: readium-night-on !important; --USER__backgroundColor: #00FF00 !important; --USER__bodyHyphens: auto !important; - --USER__colCount: auto !important; + --USER__colCount: 0 !important; --USER__darkenImages: readium-darken-on !important; --USER__fontFamily: "Times New", "Comic Sans" !important; --USER__fontOverride: readium-font-on !important; diff --git a/docs/Guides/Navigator/Preferences.md b/docs/Guides/Navigator/Preferences.md index 29e935b244..92cacb7d7c 100644 --- a/docs/Guides/Navigator/Preferences.md +++ b/docs/Guides/Navigator/Preferences.md @@ -48,7 +48,7 @@ epubNavigator.submitPreferences(editor.preferences) Preferences are low-level technical properties. While some of them can be exposed directly to the user, such as the font size, others should not be displayed as-is. -For instance, in EPUB, we can simulate two pages side by side using the `columnCount` (`auto`, `1`, `2`) property for reflowable resources, and the `spread` (`auto`, `never`, `always`) property for fixed-layout publications. Rather than displaying both of these settings with all of their possible values in the user interface, you might prefer to show a single switch button to enable a dual-page mode, which will set both settings appropriately. +For instance, in EPUB, we can simulate two pages side by side using the `columnCount` property for reflowable resources, and the `spread` (`auto`, `never`, `always`) property for fixed-layout publications. Rather than displaying both of these settings with all of their possible values in the user interface, you might prefer to show a single switch button to enable a dual-page mode, which will set both settings appropriately. ### Inactive settings diff --git a/docs/Migration Guide.md b/docs/Migration Guide.md index fa2f8c7104..57bbeeb29a 100644 --- a/docs/Migration Guide.md +++ b/docs/Migration Guide.md @@ -13,6 +13,17 @@ Readium CSS has been upgraded to version 2. If you configure custom Reading Syst +CSSRSProperties(defaultLineLength: CSSRemLength(40)) ``` +### `EPUBPreferences` Column Count + +To support arbitrary integers natively via Readium CSS v2, `EPUBPreferences.columnCount` has been changed from a `ColumnCount` enum to an `Int`. The old `ColumnCount` enum is removed. + +```diff +-var preferences = EPUBPreferences() +-preferences.columnCount = .auto ++var preferences = EPUBPreferences() ++preferences.columnCount = 0 // 0 maps to auto +``` + ## 4.0.0-alpha.1 From 5897899d7f8485c83bbefb610e8c7bcb01585e4b Mon Sep 17 00:00:00 2001 From: Steven Zeck <8315038+stevenzeck@users.noreply.github.com> Date: Tue, 18 Aug 2026 11:33:09 -0500 Subject: [PATCH 11/21] Add lineLength --- CHANGELOG.md | 1 + Sources/Navigator/EPUB/CSS/CSSProperties.swift | 6 ++++++ Sources/Navigator/EPUB/CSS/ReadiumCSS.swift | 1 + .../Navigator/EPUB/Preferences/EPUBPreferences.swift | 6 ++++++ .../EPUB/Preferences/EPUBPreferencesEditor.swift | 12 ++++++++++++ .../Navigator/EPUB/Preferences/EPUBSettings.swift | 9 +++++++++ .../EPUB/CSS/CSSUserPropertiesTests.swift | 4 ++++ docs/Guides/Navigator/Preferences.md | 1 + 8 files changed, 40 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 0a9b9da3d6..b7f1be772a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -12,6 +12,7 @@ All notable changes to this project will be documented in this file. Take a look * Upgraded Readium CSS to version 2.0.5. * Added the `noRuby` preference to `EPUBPreferences`, `EPUBSettings`, `EPUBDefaults`, and `EPUBPreferencesEditor` to allow hiding ruby (furigana) annotations in CJK publications. * Added `CSSRSProperties.defaultLineLength`, `viewportWidth`, `scrollPaddingTop`, `scrollPaddingBottom`, `scrollPaddingLeft`, and `scrollPaddingRight` to configure Readium CSS v2 reading system properties. +* Added the `lineLength` preference to `EPUBPreferences`, `EPUBSettings`, `EPUBDefaults`, and `EPUBPreferencesEditor`. This setting behaves as a factor applied to the maximum width of the text column, offering finer control over text presentation than `pageMargins` (which solely handles the padding around the text). * Added optional CSS minification to the build scripts (`make scripts minify=true`). ### Changed diff --git a/Sources/Navigator/EPUB/CSS/CSSProperties.swift b/Sources/Navigator/EPUB/CSS/CSSProperties.swift index 338ccf0c4f..2d15680e6f 100644 --- a/Sources/Navigator/EPUB/CSS/CSSProperties.swift +++ b/Sources/Navigator/EPUB/CSS/CSSProperties.swift @@ -55,6 +55,9 @@ public struct CSSUserProperties: CSSProperties, Sendable { /// To reset, change the value to 1. public var pageMargins: Double? + /// The maximum line length. + public var lineLength: CSSLength? + // Appearance /// This flag applies a reading mode (sepia or night). @@ -171,6 +174,7 @@ public struct CSSUserProperties: CSSProperties, Sendable { view: CSSView? = nil, colCount: Int? = nil, pageMargins: Double? = nil, + lineLength: CSSLength? = nil, appearance: CSSAppearance? = nil, darkenImages: Bool? = nil, invertImages: Bool? = nil, @@ -196,6 +200,7 @@ public struct CSSUserProperties: CSSProperties, Sendable { self.view = view self.colCount = colCount self.pageMargins = pageMargins + self.lineLength = lineLength self.appearance = appearance self.darkenImages = darkenImages self.invertImages = invertImages @@ -227,6 +232,7 @@ public struct CSSUserProperties: CSSProperties, Sendable { // Pagination props.putCSS(name: "--USER__colCount", value: colCount) props.putCSS(name: "--USER__pageMargins", value: pageMargins) + props.putCSS(name: "--USER__lineLength", value: lineLength) // Appearance props.putCSS(name: "--USER__appearance", value: appearance) diff --git a/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift b/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift index 3e7913c72b..92ea2d090d 100644 --- a/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift +++ b/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift @@ -66,6 +66,7 @@ extension ReadiumCSS { view: settings.scroll ? .scroll : .paged, colCount: settings.columnCount, pageMargins: settings.pageMargins, + lineLength: CSSPercentLength(settings.lineLength), appearance: { switch settings.theme { case .light: return nil diff --git a/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift b/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift index 4fbb999861..3388b7ee92 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift @@ -51,6 +51,9 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { /// Enable ligatures in Arabic. public var ligatures: Bool? + /// The maximum line length. + public var lineLength: Double? + /// Leading line height. public var lineHeight: Double? @@ -124,6 +127,7 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { language: Language? = nil, letterSpacing: Double? = nil, ligatures: Bool? = nil, + lineLength: Double? = nil, lineHeight: Double? = nil, noRuby: Bool? = nil, offsetFirstPage: Bool? = nil, @@ -153,6 +157,7 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { self.language = language self.letterSpacing = letterSpacing.map { max($0, 0) } self.ligatures = ligatures + self.lineLength = lineLength.map { max($0, 0) } self.lineHeight = lineHeight self.noRuby = noRuby self.offsetFirstPage = offsetFirstPage @@ -185,6 +190,7 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { language: other.language ?? language, letterSpacing: other.letterSpacing ?? letterSpacing, ligatures: other.ligatures ?? ligatures, + lineLength: other.lineLength ?? lineLength, lineHeight: other.lineHeight ?? lineHeight, noRuby: other.noRuby ?? noRuby, offsetFirstPage: other.offsetFirstPage ?? offsetFirstPage, diff --git a/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift b/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift index 602f0348e3..7fc15e128c 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift @@ -264,6 +264,18 @@ public final class EPUBPreferencesEditor: StatefulPreferencesEditor = + rangePreference( + preference: \.lineLength, + setting: \.lineLength, + defaultEffectiveValue: defaults.lineLength ?? 1.0, + isEffective: { _ in true }, + supportedRange: 0.0 ... 1.0, + progressionStrategy: .increment(0.1), + format: \.percentageString + ) + /// Factor applied to horizontal margins. Default to 1. /// /// Only effective with reflowable publications. diff --git a/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift b/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift index 359adfa789..22e7a68904 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift @@ -24,6 +24,7 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { public var language: Language? public var letterSpacing: Double? public var ligatures: Bool? + public var lineLength: Double public var lineHeight: Double? public var noRuby: Bool public var offsetFirstPage: Bool? @@ -60,6 +61,7 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { language: Language?, letterSpacing: Double?, ligatures: Bool?, + lineLength: Double, lineHeight: Double?, noRuby: Bool = false, offsetFirstPage: Bool?, @@ -89,6 +91,7 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { self.language = language self.letterSpacing = letterSpacing self.ligatures = ligatures + self.lineLength = lineLength self.lineHeight = lineHeight self.noRuby = noRuby self.offsetFirstPage = offsetFirstPage @@ -166,6 +169,9 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { language: language, letterSpacing: preferences.letterSpacing ?? defaults.letterSpacing, + lineLength: preferences.lineLength + ?? defaults.lineLength + ?? 1.0, ligatures: preferences.ligatures ?? defaults.ligatures, lineHeight: preferences.lineHeight @@ -223,6 +229,7 @@ public struct EPUBDefaults: Sendable { public var language: Language? public var letterSpacing: Double? public var ligatures: Bool? + public var lineLength: Double? public var lineHeight: Double? public var noRuby: Bool? public var offsetFirstPage: Bool? @@ -248,6 +255,7 @@ public struct EPUBDefaults: Sendable { language: Language? = nil, letterSpacing: Double? = nil, ligatures: Bool? = nil, + lineLength: Double? = nil, lineHeight: Double? = nil, noRuby: Bool? = nil, offsetFirstPage: Bool? = nil, @@ -272,6 +280,7 @@ public struct EPUBDefaults: Sendable { self.language = language self.letterSpacing = letterSpacing self.ligatures = ligatures + self.lineLength = lineLength self.lineHeight = lineHeight self.noRuby = noRuby self.offsetFirstPage = offsetFirstPage diff --git a/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift b/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift index 9a01a30165..fd0810d939 100644 --- a/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift +++ b/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift @@ -15,6 +15,7 @@ struct CSSUserPropertiesTests { "--USER__view": nil, "--USER__colCount": nil, "--USER__pageMargins": nil, + "--USER__lineLength": nil, "--USER__appearance": nil, "--USER__darkenImages": nil, "--USER__invertImages": nil, @@ -45,6 +46,7 @@ struct CSSUserPropertiesTests { view: .scroll, colCount: 0, pageMargins: 1.2, + lineLength: CSSPercentLength(42), appearance: .night, darkenImages: true, invertImages: true, @@ -69,6 +71,7 @@ struct CSSUserPropertiesTests { "--USER__view": "readium-scroll-on", "--USER__colCount": "0", "--USER__pageMargins": "1.20000", + "--USER__lineLength": "4200%", "--USER__appearance": "readium-night-on", "--USER__darkenImages": "readium-darken-on", "--USER__invertImages": "readium-invert-on", @@ -129,6 +132,7 @@ struct CSSUserPropertiesTests { view: .scroll, colCount: 0, pageMargins: 1.2, + lineLength: CSSPercentLength(42), appearance: .night, darkenImages: true, invertImages: true, diff --git a/docs/Guides/Navigator/Preferences.md b/docs/Guides/Navigator/Preferences.md index 92cacb7d7c..b01cc1ba38 100644 --- a/docs/Guides/Navigator/Preferences.md +++ b/docs/Guides/Navigator/Preferences.md @@ -387,6 +387,7 @@ EPUB comes in two very different flavors: **reflowable** which allows a lot of c | `language` | :white_check_mark: | :white_check_mark: | | `letterSpacing` | :white_check_mark: | | | `ligatures` | :white_check_mark: | | +| `lineLength` | :white_check_mark: | | `lineHeight` | :white_check_mark: | | | `noRuby` | :white_check_mark: | | | `offsetFirstPage` | | :white_check_mark: | From 14e56f083278a04330d2c13b45f76d36eadb6837 Mon Sep 17 00:00:00 2001 From: Steven Zeck <8315038+stevenzeck@users.noreply.github.com> Date: Tue, 18 Aug 2026 13:22:47 -0500 Subject: [PATCH 12/21] Remove imageFilter, add blendImages, darkenImages, invertImages, and invertGaiji --- CHANGELOG.md | 2 + .../Navigator/EPUB/CSS/CSSProperties.swift | 31 ++-- Sources/Navigator/EPUB/CSS/ReadiumCSS.swift | 6 +- .../EPUB/Preferences/EPUBPreferences.swift | 28 +++- .../Preferences/EPUBPreferencesEditor.swift | 63 ++++++-- .../EPUB/Preferences/EPUBSettings.swift | 134 ++++++++++-------- Sources/Navigator/Preferences/Types.swift | 6 - .../Common/Preferences/UserPreferences.swift | 66 +++++---- .../EPUB/CSS/CSSUserPropertiesTests.swift | 29 ++-- docs/Guides/Navigator/Preferences.md | 7 +- docs/Migration Guide.md | 11 ++ 11 files changed, 256 insertions(+), 127 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index b7f1be772a..a15df16f05 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -13,6 +13,7 @@ All notable changes to this project will be documented in this file. Take a look * Added the `noRuby` preference to `EPUBPreferences`, `EPUBSettings`, `EPUBDefaults`, and `EPUBPreferencesEditor` to allow hiding ruby (furigana) annotations in CJK publications. * Added `CSSRSProperties.defaultLineLength`, `viewportWidth`, `scrollPaddingTop`, `scrollPaddingBottom`, `scrollPaddingLeft`, and `scrollPaddingRight` to configure Readium CSS v2 reading system properties. * Added the `lineLength` preference to `EPUBPreferences`, `EPUBSettings`, `EPUBDefaults`, and `EPUBPreferencesEditor`. This setting behaves as a factor applied to the maximum width of the text column, offering finer control over text presentation than `pageMargins` (which solely handles the padding around the text). +* Added `blendImages`, `darkenImages`, `invertImages`, and `invertGaiji` to `EPUBPreferences`, `EPUBSettings`, `EPUBDefaults`, and `EPUBPreferencesEditor` for precise CSS filtering of images. * Added optional CSS minification to the build scripts (`make scripts minify=true`). ### Changed @@ -21,6 +22,7 @@ All notable changes to this project will be documented in this file. Take a look * `CSSRSProperties.maxLineLength` is deprecated in favor of `defaultLineLength` to match Readium CSS v2. * Changed `columnCount` preference in `EPUBPreferences`, `EPUBSettings`, and `EPUBDefaults` to `Int` to support arbitrary column counts. The `ColumnCount` enum is removed. +* Replaced the `imageFilter` preference with `blendImages`, `darkenImages`, `invertImages`, and `invertGaiji`. The `ImageFilter` enum is removed. ## [4.0.0-alpha.1] - 2026-08-14 diff --git a/Sources/Navigator/EPUB/CSS/CSSProperties.swift b/Sources/Navigator/EPUB/CSS/CSSProperties.swift index 2d15680e6f..e3012fdef7 100644 --- a/Sources/Navigator/EPUB/CSS/CSSProperties.swift +++ b/Sources/Navigator/EPUB/CSS/CSSProperties.swift @@ -63,15 +63,24 @@ public struct CSSUserProperties: CSSProperties, Sendable { /// This flag applies a reading mode (sepia or night). public var appearance: CSSAppearance? - /// This will only apply in night mode to darken images and impact img. + /// Blends the images with the background color. + public var blendImages: Bool? + + /// This will apply a brightness filter with the value it's given. + /// + /// Requires: appearance = Appearance.Night + public var darkenImages: Double? + + /// This will apply an invert filter with the value it's given. /// /// Requires: appearance = Appearance.Night - public var darkenImages: Bool? + public var invertImages: Double? - /// This will only apply in night mode to invert images and impact img. + /// This will apply an invert filter with the value it's given, + /// only to img class="gaiji". /// /// Requires: appearance = Appearance.Night - public var invertImages: Bool? + public var invertGaiji: Double? /// The color for textual contents. It impacts all elements but headings and pre in the DOM. /// @@ -176,8 +185,10 @@ public struct CSSUserProperties: CSSProperties, Sendable { pageMargins: Double? = nil, lineLength: CSSLength? = nil, appearance: CSSAppearance? = nil, - darkenImages: Bool? = nil, - invertImages: Bool? = nil, + blendImages: Bool? = nil, + darkenImages: Double? = nil, + invertImages: Double? = nil, + invertGaiji: Double? = nil, textColor: CSSColor? = nil, backgroundColor: CSSColor? = nil, fontOverride: Bool? = nil, @@ -202,8 +213,10 @@ public struct CSSUserProperties: CSSProperties, Sendable { self.pageMargins = pageMargins self.lineLength = lineLength self.appearance = appearance + self.blendImages = blendImages self.darkenImages = darkenImages self.invertImages = invertImages + self.invertGaiji = invertGaiji self.textColor = textColor self.backgroundColor = backgroundColor self.fontOverride = fontOverride @@ -236,8 +249,10 @@ public struct CSSUserProperties: CSSProperties, Sendable { // Appearance props.putCSS(name: "--USER__appearance", value: appearance) - props.putCSS(name: "--USER__darkenImages", value: CSSFlag(name: "darken", isEnabled: darkenImages)) - props.putCSS(name: "--USER__invertImages", value: CSSFlag(name: "invert", isEnabled: invertImages)) + props.putCSS(name: "--USER__blendImages", value: CSSFlag(name: "blend", isEnabled: blendImages)) + props.putCSS(name: "--USER__darkenImages", value: darkenImages) + props.putCSS(name: "--USER__invertImages", value: invertImages) + props.putCSS(name: "--USER__invertGaiji", value: invertGaiji) // Colors props.putCSS(name: "--USER__textColor", value: textColor) diff --git a/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift b/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift index 92ea2d090d..9e39dc2d41 100644 --- a/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift +++ b/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift @@ -74,8 +74,10 @@ extension ReadiumCSS { case .sepia: return .sepia } }(), - darkenImages: settings.imageFilter == .darken, - invertImages: settings.imageFilter == .invert, + blendImages: settings.blendImages, + darkenImages: settings.darkenImages, + invertImages: settings.invertImages, + invertGaiji: settings.invertGaiji, textColor: settings.textColor.map { CSSIntColor($0.rawValue) }, backgroundColor: settings.backgroundColor.map { CSSIntColor($0.rawValue) }, fontOverride: settings.fontFamily != nil || settings.textNormalization, diff --git a/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift b/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift index 3388b7ee92..7f72a6438f 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift @@ -39,8 +39,17 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { /// Enable hyphenation. public var hyphens: Bool? - /// Filter applied to images in dark theme. - public var imageFilter: ImageFilter? + /// Blends the images with the background color. + public var blendImages: Bool? + + /// Darkens images by the given percentage (0.0 to 1.0). + public var darkenImages: Double? + + /// Inverts images by the given percentage (0.0 to 1.0). + public var invertImages: Double? + + /// Inverts gaiji images by the given percentage (0.0 to 1.0). + public var invertGaiji: Double? /// Language of the publication content. public var language: Language? @@ -123,7 +132,10 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { fontSize: Double? = nil, fontWeight: Double? = nil, hyphens: Bool? = nil, - imageFilter: ImageFilter? = nil, + blendImages: Bool? = nil, + darkenImages: Double? = nil, + invertImages: Double? = nil, + invertGaiji: Double? = nil, language: Language? = nil, letterSpacing: Double? = nil, ligatures: Bool? = nil, @@ -153,7 +165,10 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { self.fontSize = fontSize.map { max($0, 0) } self.fontWeight = fontWeight?.clamped(to: 0.0 ... 2.5) self.hyphens = hyphens - self.imageFilter = imageFilter + self.blendImages = blendImages + self.darkenImages = darkenImages + self.invertImages = invertImages + self.invertGaiji = invertGaiji self.language = language self.letterSpacing = letterSpacing.map { max($0, 0) } self.ligatures = ligatures @@ -186,7 +201,10 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { fontSize: other.fontSize ?? fontSize, fontWeight: other.fontWeight ?? fontWeight, hyphens: other.hyphens ?? hyphens, - imageFilter: other.imageFilter ?? imageFilter, + blendImages: other.blendImages ?? blendImages, + darkenImages: other.darkenImages ?? darkenImages, + invertImages: other.invertImages ?? invertImages, + invertGaiji: other.invertGaiji ?? invertGaiji, language: other.language ?? language, letterSpacing: other.letterSpacing ?? letterSpacing, ligatures: other.ligatures ?? ligatures, diff --git a/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift b/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift index 7fc15e128c..9d00675798 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift @@ -145,18 +145,59 @@ public final class EPUBPreferencesEditor: StatefulPreferencesEditor = - enumPreference( - preference: \.imageFilter, - setting: \.imageFilter, - isEffective: { $0.settings.theme == .dark }, - supportedValues: [nil, .darken, .invert] + /// Blends the images with the background color. + public lazy var blendImages: AnyPreference = + preference( + preference: \.blendImages, + setting: \.blendImages, + isEffective: { [layout] _ in layout == .reflowable } + ) + + /// Darkens images by the given percentage. + public lazy var darkenImages: AnyRangePreference = + rangePreference( + preference: \.darkenImages, + effectiveValue: { $0.settings.darkenImages ?? 0 }, + defaultEffectiveValue: 0, + isEffective: { [layout] _ in layout == .reflowable }, + supportedRange: 0.0 ... 1.0, + progressionStrategy: .increment(0.1), + format: \.percentageString + ) + + /// Inverts gaiji images. + public lazy var invertGaiji: AnyPreference = + rangePreference( + preference: \.invertGaiji, + effectiveValue: { $0.settings.invertGaiji ?? 0 }, + defaultEffectiveValue: 0, + isEffective: { [layout] _ in layout == .reflowable }, + supportedRange: 0.0 ... 1.0, + progressionStrategy: .increment(0.1), + format: \.percentageString + ) + .map( + from: { $0 > 0 }, + to: { $0 ? 1.0 : 0.0 } + ) + .eraseToAnyPreference() + + /// Inverts the color of images. + public lazy var invertImages: AnyPreference = + rangePreference( + preference: \.invertImages, + effectiveValue: { $0.settings.invertImages ?? 0 }, + defaultEffectiveValue: 0, + isEffective: { [layout] _ in layout == .reflowable }, + supportedRange: 0.0 ... 1.0, + progressionStrategy: .increment(0.1), + format: \.percentageString + ) + .map( + from: { $0 > 0 }, + to: { $0 ? 1.0 : 0.0 } ) + .eraseToAnyPreference() /// Language of the publication content. /// diff --git a/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift b/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift index 22e7a68904..6b01646529 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift @@ -20,7 +20,10 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { public var fontSize: Double public var fontWeight: Double? public var hyphens: Bool? - public var imageFilter: ImageFilter? + public var blendImages: Bool? + public var darkenImages: Double? + public var invertImages: Double? + public var invertGaiji: Double? public var language: Language? public var letterSpacing: Double? public var ligatures: Bool? @@ -57,7 +60,10 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { fontSize: Double, fontWeight: Double?, hyphens: Bool?, - imageFilter: ImageFilter?, + blendImages: Bool?, + darkenImages: Double?, + invertImages: Double?, + invertGaiji: Double?, language: Language?, letterSpacing: Double?, ligatures: Bool?, @@ -87,7 +93,10 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { self.fontSize = fontSize self.fontWeight = fontWeight self.hyphens = hyphens - self.imageFilter = imageFilter + self.blendImages = blendImages + self.darkenImages = darkenImages + self.invertImages = invertImages + self.invertGaiji = invertGaiji self.language = language self.letterSpacing = letterSpacing self.ligatures = ligatures @@ -148,67 +157,65 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { scroll = true } + let columnCount = preferences.columnCount ?? defaults.columnCount ?? 0 + let fit = preferences.fit ?? defaults.fit ?? .auto + let fontSize = preferences.fontSize ?? defaults.fontSize ?? 1.0 + let fontWeight = preferences.fontWeight ?? defaults.fontWeight + let hyphens = preferences.hyphens ?? defaults.hyphens + let blendImages = preferences.blendImages ?? defaults.blendImages + let darkenImages = preferences.darkenImages ?? defaults.darkenImages + let invertImages = preferences.invertImages ?? defaults.invertImages + let invertGaiji = preferences.invertGaiji ?? defaults.invertGaiji + let letterSpacing = preferences.letterSpacing ?? defaults.letterSpacing + let lineLength = preferences.lineLength ?? defaults.lineLength ?? 1.0 + let ligatures = preferences.ligatures ?? defaults.ligatures + let lineHeight = preferences.lineHeight ?? defaults.lineHeight + let noRuby = preferences.noRuby ?? defaults.noRuby ?? false + let offsetFirstPage = preferences.offsetFirstPage ?? defaults.offsetFirstPage + let pageMargins = preferences.pageMargins ?? defaults.pageMargins ?? 1.0 + let paragraphIndent = preferences.paragraphIndent ?? defaults.paragraphIndent + let paragraphSpacing = preferences.paragraphSpacing ?? defaults.paragraphSpacing + let publisherStyles = preferences.publisherStyles ?? defaults.publisherStyles ?? true + let spread = preferences.spread ?? defaults.spread ?? .auto + let textAlign = preferences.textAlign ?? defaults.textAlign + let textNormalization = preferences.textNormalization ?? defaults.textNormalization ?? false + let theme = preferences.theme ?? .light + let typeScale = preferences.typeScale ?? defaults.typeScale + let wordSpacing = preferences.wordSpacing ?? defaults.wordSpacing + self.init( backgroundColor: preferences.backgroundColor, - columnCount: preferences.columnCount - ?? defaults.columnCount - ?? 0, - fit: preferences.fit - ?? defaults.fit - ?? .auto, + columnCount: columnCount, + fit: fit, fontFamily: preferences.fontFamily, - fontSize: preferences.fontSize - ?? defaults.fontSize - ?? 1.0, - fontWeight: preferences.fontWeight - ?? defaults.fontWeight, - hyphens: preferences.hyphens - ?? defaults.hyphens, - imageFilter: preferences.imageFilter - ?? defaults.imageFilter, + fontSize: fontSize, + fontWeight: fontWeight, + hyphens: hyphens, + blendImages: blendImages, + darkenImages: darkenImages, + invertImages: invertImages, + invertGaiji: invertGaiji, language: language, - letterSpacing: preferences.letterSpacing - ?? defaults.letterSpacing, - lineLength: preferences.lineLength - ?? defaults.lineLength - ?? 1.0, - ligatures: preferences.ligatures - ?? defaults.ligatures, - lineHeight: preferences.lineHeight - ?? defaults.lineHeight, - noRuby: preferences.noRuby - ?? defaults.noRuby - ?? false, - offsetFirstPage: preferences.offsetFirstPage - ?? defaults.offsetFirstPage, - pageMargins: preferences.pageMargins - ?? defaults.pageMargins - ?? 1.0, - paragraphIndent: preferences.paragraphIndent - ?? defaults.paragraphIndent, - paragraphSpacing: preferences.paragraphSpacing - ?? defaults.paragraphSpacing, - publisherStyles: preferences.publisherStyles - ?? defaults.publisherStyles - ?? true, + letterSpacing: letterSpacing, + ligatures: ligatures, + lineLength: lineLength, + lineHeight: lineHeight, + noRuby: noRuby, + offsetFirstPage: offsetFirstPage, + pageMargins: pageMargins, + paragraphIndent: paragraphIndent, + paragraphSpacing: paragraphSpacing, + publisherStyles: publisherStyles, readingProgression: readingProgression, scroll: scroll, - spread: preferences.spread - ?? defaults.spread - ?? .auto, - textAlign: preferences.textAlign - ?? defaults.textAlign, + spread: spread, + textAlign: textAlign, textColor: preferences.textColor, - textNormalization: preferences.textNormalization - ?? defaults.textNormalization - ?? false, - theme: preferences.theme - ?? .light, - typeScale: preferences.typeScale - ?? defaults.typeScale, + textNormalization: textNormalization, + theme: theme, + typeScale: typeScale, verticalText: verticalText, - wordSpacing: preferences.wordSpacing - ?? defaults.wordSpacing + wordSpacing: wordSpacing ) } } @@ -225,7 +232,10 @@ public struct EPUBDefaults: Sendable { public var fontSize: Double? public var fontWeight: Double? public var hyphens: Bool? - public var imageFilter: ImageFilter? + public var blendImages: Bool? + public var darkenImages: Double? + public var invertImages: Double? + public var invertGaiji: Double? public var language: Language? public var letterSpacing: Double? public var ligatures: Bool? @@ -251,7 +261,10 @@ public struct EPUBDefaults: Sendable { fontSize: Double? = nil, fontWeight: Double? = nil, hyphens: Bool? = nil, - imageFilter: ImageFilter? = nil, + blendImages: Bool? = nil, + darkenImages: Double? = nil, + invertImages: Double? = nil, + invertGaiji: Double? = nil, language: Language? = nil, letterSpacing: Double? = nil, ligatures: Bool? = nil, @@ -276,7 +289,10 @@ public struct EPUBDefaults: Sendable { self.fontSize = fontSize self.fontWeight = fontWeight self.hyphens = hyphens - self.imageFilter = imageFilter + self.blendImages = blendImages + self.darkenImages = darkenImages + self.invertImages = invertImages + self.invertGaiji = invertGaiji self.language = language self.letterSpacing = letterSpacing self.ligatures = ligatures diff --git a/Sources/Navigator/Preferences/Types.swift b/Sources/Navigator/Preferences/Types.swift index a7588fbfef..f9756b82c3 100644 --- a/Sources/Navigator/Preferences/Types.swift +++ b/Sources/Navigator/Preferences/Types.swift @@ -92,12 +92,6 @@ public enum Theme: String, Codable, Hashable, Sendable { private static let sepiaBackgroundColor = Color(hex: "#faf4e8")! } -/// Filter used to render images in a reflowable document. -public enum ImageFilter: String, Codable, Hashable, Sendable { - case darken - case invert -} - /// Text alignment in a reflowable document. public enum TextAlignment: String, Codable, Hashable, Sendable { /// Align the text in the center of the page. diff --git a/TestApp/Sources/Reader/Common/Preferences/UserPreferences.swift b/TestApp/Sources/Reader/Common/Preferences/UserPreferences.swift index 0ba52e8b1e..4fe1661637 100644 --- a/TestApp/Sources/Reader/Common/Preferences/UserPreferences.swift +++ b/TestApp/Sources/Reader/Common/Preferences/UserPreferences.swift @@ -110,7 +110,10 @@ struct UserPreferences< fontSize: editor.fontSize, fontWeight: editor.fontWeight, hyphens: editor.hyphens, - imageFilter: editor.imageFilter, + blendImages: editor.blendImages, + darkenImages: editor.darkenImages, + invertImages: editor.invertImages, + invertGaiji: editor.invertGaiji, language: editor.language, letterSpacing: editor.letterSpacing, ligatures: editor.ligatures, @@ -321,12 +324,15 @@ struct UserPreferences< @ViewBuilder func reflowableUserPreferences( commit: @escaping () -> Void, backgroundColor: AnyPreference? = nil, - columnCount: AnyEnumPreference? = nil, + columnCount: AnyRangePreference? = nil, fontFamily: AnyPreference? = nil, fontSize: AnyRangePreference? = nil, fontWeight: AnyRangePreference? = nil, hyphens: AnyPreference? = nil, - imageFilter: AnyEnumPreference? = nil, + blendImages: AnyPreference? = nil, + darkenImages: AnyRangePreference? = nil, + invertImages: AnyPreference? = nil, + invertGaiji: AnyPreference? = nil, language: AnyPreference? = nil, letterSpacing: AnyRangePreference? = nil, ligatures: AnyPreference? = nil, @@ -399,17 +405,10 @@ struct UserPreferences< } if let columnCount = columnCount { - pickerRow( + stepperRow( title: "Columns", preference: columnCount, - commit: commit, - formatValue: { v in - switch v { - case .auto: return "Auto" - case .one: return "1" - case .two: return "2" - } - } + commit: commit ) } @@ -423,7 +422,7 @@ struct UserPreferences< } } - if theme != nil || imageFilter != nil || textColor != nil || backgroundColor != nil { + if theme != nil || blendImages != nil || darkenImages != nil || invertImages != nil || invertGaiji != nil || textColor != nil || backgroundColor != nil { Section { if let theme = theme { pickerRow( @@ -440,18 +439,35 @@ struct UserPreferences< ) } - if let imageFilter = imageFilter { - pickerRow( - title: "Image filter", - preference: imageFilter, - commit: commit, - formatValue: { v in - switch v { - case nil: return "None" - case .darken: return "Darken colors" - case .invert: return "Invert colors" - } - } + if let blendImages = blendImages { + toggleRow( + title: "Blend Images", + preference: blendImages.map(from: { $0 ?? false }, to: { $0 }).eraseToAnyPreference(), + commit: commit + ) + } + + if let darkenImages = darkenImages { + stepperRow( + title: "Darken Images", + preference: darkenImages, + commit: commit + ) + } + + if let invertImages = invertImages { + toggleRow( + title: "Invert Images", + preference: invertImages, + commit: commit + ) + } + + if let invertGaiji = invertGaiji { + toggleRow( + title: "Invert Gaiji", + preference: invertGaiji, + commit: commit ) } diff --git a/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift b/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift index fd0810d939..d1056a2956 100644 --- a/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift +++ b/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift @@ -17,8 +17,10 @@ struct CSSUserPropertiesTests { "--USER__pageMargins": nil, "--USER__lineLength": nil, "--USER__appearance": nil, + "--USER__blendImages": nil, "--USER__darkenImages": nil, "--USER__invertImages": nil, + "--USER__invertGaiji": nil, "--USER__textColor": nil, "--USER__backgroundColor": nil, "--USER__fontOverride": nil, @@ -48,8 +50,10 @@ struct CSSUserPropertiesTests { pageMargins: 1.2, lineLength: CSSPercentLength(42), appearance: .night, - darkenImages: true, - invertImages: true, + blendImages: true, + darkenImages: 0.8, + invertImages: 0.9, + invertGaiji: 0.95, textColor: CSSHexColor("#FF0000"), backgroundColor: CSSHexColor("#00FF00"), fontOverride: true, @@ -71,10 +75,12 @@ struct CSSUserPropertiesTests { "--USER__view": "readium-scroll-on", "--USER__colCount": "0", "--USER__pageMargins": "1.20000", - "--USER__lineLength": "4200%", + "--USER__lineLength": "4200.00000%", "--USER__appearance": "readium-night-on", - "--USER__darkenImages": "readium-darken-on", - "--USER__invertImages": "readium-invert-on", + "--USER__blendImages": "readium-blend-on", + "--USER__darkenImages": "0.80000", + "--USER__invertImages": "0.90000", + "--USER__invertGaiji": "0.95000", "--USER__textColor": "#FF0000", "--USER__backgroundColor": "#00FF00", "--USER__fontOverride": "readium-font-on", @@ -134,8 +140,10 @@ struct CSSUserPropertiesTests { pageMargins: 1.2, lineLength: CSSPercentLength(42), appearance: .night, - darkenImages: true, - invertImages: true, + blendImages: true, + darkenImages: 0.8, + invertImages: 0.9, + invertGaiji: 0.95, textColor: CSSHexColor("#FF0000"), backgroundColor: CSSHexColor("#00FF00"), fontOverride: true, @@ -158,16 +166,19 @@ struct CSSUserPropertiesTests { --USER__advancedSettings: readium-advanced-on !important; --USER__appearance: readium-night-on !important; --USER__backgroundColor: #00FF00 !important; + --USER__blendImages: readium-blend-on !important; --USER__bodyHyphens: auto !important; --USER__colCount: 0 !important; - --USER__darkenImages: readium-darken-on !important; + --USER__darkenImages: 0.80000 !important; --USER__fontFamily: "Times New", "Comic Sans" !important; --USER__fontOverride: readium-font-on !important; --USER__fontSize: 2.30000vmax !important; - --USER__invertImages: readium-invert-on !important; + --USER__invertGaiji: 0.95000 !important; + --USER__invertImages: 0.90000 !important; --USER__letterSpacing: 8.90000rem !important; --USER__ligatures: common-ligatures !important; --USER__lineHeight: 4.50000pt !important; + --USER__lineLength: 4200.00000% !important; --USER__noRuby: readium-noRuby-on !important; --USER__pageMargins: 1.20000 !important; --USER__paraIndent: 6.70000rem !important; diff --git a/docs/Guides/Navigator/Preferences.md b/docs/Guides/Navigator/Preferences.md index b01cc1ba38..ea6d97b1e6 100644 --- a/docs/Guides/Navigator/Preferences.md +++ b/docs/Guides/Navigator/Preferences.md @@ -383,7 +383,10 @@ EPUB comes in two very different flavors: **reflowable** which allows a lot of c | `fontSize` | :white_check_mark: | | | `fontWeight` | :white_check_mark: | | | `hyphens` | :white_check_mark: | | -| `imageFilter` | :white_check_mark: | | +| `blendImages` | :white_check_mark: | | +| `darkenImages` | :white_check_mark: | | +| `invertImages` | :white_check_mark: | | +| `invertGaiji` | :white_check_mark: | | | `language` | :white_check_mark: | :white_check_mark: | | `letterSpacing` | :white_check_mark: | | | `ligatures` | :white_check_mark: | | @@ -426,7 +429,7 @@ The `columnCount` preference is available only when in paginated mode (`scroll = #### Dark theme specific preferences -The `imageFilter` preference is available only in dark mode (`theme = .dark`). +The `darkenImages`, `invertImages`, and `invertGaiji` preferences are available only in dark mode (`theme = .dark`). #### Language specific preferences diff --git a/docs/Migration Guide.md b/docs/Migration Guide.md index 57bbeeb29a..67e5bb37f4 100644 --- a/docs/Migration Guide.md +++ b/docs/Migration Guide.md @@ -24,6 +24,17 @@ To support arbitrary integers natively via Readium CSS v2, `EPUBPreferences.colu +preferences.columnCount = 0 // 0 maps to auto ``` +### `EPUBPreferences` Image Filters + +To support precise CSS filtering of images via Readium CSS v2, `EPUBPreferences.imageFilter` has been replaced with `blendImages`, `darkenImages`, `invertImages`, and `invertGaiji`. The old `ImageFilter` enum is removed. + +```diff +-var preferences = EPUBPreferences() +-preferences.imageFilter = .darken ++var preferences = EPUBPreferences() ++preferences.darkenImages = 0.8 +``` + ## 4.0.0-alpha.1 From 64b42a04f5acb41da20ed863c61dc9583bb809d3 Mon Sep 17 00:00:00 2001 From: Steven Zeck <8315038+stevenzeck@users.noreply.github.com> Date: Tue, 18 Aug 2026 14:09:15 -0500 Subject: [PATCH 13/21] Fix darkenImages behavior --- Sources/Navigator/EPUB/CSS/ReadiumCSS.swift | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift b/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift index 9e39dc2d41..78df071742 100644 --- a/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift +++ b/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift @@ -75,7 +75,7 @@ extension ReadiumCSS { } }(), blendImages: settings.blendImages, - darkenImages: settings.darkenImages, + darkenImages: settings.darkenImages.map { 1 - $0 }, invertImages: settings.invertImages, invertGaiji: settings.invertGaiji, textColor: settings.textColor.map { CSSIntColor($0.rawValue) }, From 83688e222a88b8cf6ef5f996c17ae2edd3d4beb9 Mon Sep 17 00:00:00 2001 From: Steven Zeck <8315038+stevenzeck@users.noreply.github.com> Date: Wed, 16 Sep 2026 12:06:43 -0500 Subject: [PATCH 14/21] Fix merge issue --- .../EPUB/Preferences/EPUBPreferencesEditor.swift | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift b/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift index 85afe80815..c2f1182aa6 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift @@ -188,7 +188,7 @@ public final class EPUBPreferencesEditor: StatefulPreferencesEditor Date: Tue, 22 Sep 2026 09:04:05 -0500 Subject: [PATCH 15/21] Use algorithm for reader layout --- .../Navigator/EPUB/CSS/LayoutResolver.swift | 203 ++++++++++++++++++ Sources/Navigator/EPUB/CSS/ReadiumCSS.swift | 34 ++- .../EPUB/EPUBNavigatorViewController.swift | 20 +- .../EPUB/EPUBNavigatorViewModel.swift | 29 ++- 4 files changed, 272 insertions(+), 14 deletions(-) create mode 100644 Sources/Navigator/EPUB/CSS/LayoutResolver.swift diff --git a/Sources/Navigator/EPUB/CSS/LayoutResolver.swift b/Sources/Navigator/EPUB/CSS/LayoutResolver.swift new file mode 100644 index 0000000000..2495fd1551 --- /dev/null +++ b/Sources/Navigator/EPUB/CSS/LayoutResolver.swift @@ -0,0 +1,203 @@ +// +// Copyright 2026 Readium Foundation. All rights reserved. +// Use of this source code is governed by the BSD-style license +// available in the top-level LICENSE file of the project. +// + +import CoreGraphics +import Foundation +import UIKit + +/// Resolves column count and line length constraints for reflowable content. +final class LayoutResolver { + /// Result of layout resolution for reflowable content. + struct Layout: Equatable, Sendable { + /// Number of columns to display. + let colCount: Int + /// Line length in points. + let lineLength: Double + } + + private let baseMinMargins: Double + private let baseOptimalLineLength: Double + private let baseMinLineLength: Double + private let baseMaxLineLength: Double + + init( + baseMinMargins: Double = 30.0, + baseOptimalLineLength: Double = 640.0, + baseMinLineLength: Double = 440.0, + baseMaxLineLength: Double = 740.0 + ) { + self.baseMinMargins = baseMinMargins + self.baseOptimalLineLength = baseOptimalLineLength + self.baseMinLineLength = baseMinLineLength + self.baseMaxLineLength = baseMaxLineLength + } + + /// Resolves the layout using `EPUBSettings`. + func layout( + settings: EPUBSettings, + systemFontScale: Double = 1.0, + viewportSize: CGSize, + safeAreaInsets: UIEdgeInsets = .zero + ) -> Layout { + layout( + scroll: settings.scroll, + verticalText: settings.verticalText, + columnCount: settings.columnCount == 0 ? nil : settings.columnCount, + optimalLineLength: settings.lineLength, + minimalLineLength: nil, + maximalLineLength: nil, + minMargins: settings.pageMargins, + systemFontScale: systemFontScale, + viewportSize: viewportSize, + safeAreaInsets: safeAreaInsets + ) + } + + /// Resolves the layout using individual layout parameters. + func layout( + scroll: Bool, + verticalText: Bool, + columnCount: Int?, + optimalLineLength: Double, + minimalLineLength: Double?, + maximalLineLength: Double?, + minMargins: Double, + systemFontScale: Double = 1.0, + viewportSize: CGSize, + safeAreaInsets: UIEdgeInsets = .zero + ) -> Layout { + let optimalLineLength = baseOptimalLineLength * optimalLineLength * systemFontScale + let minLineLength = minimalLineLength.map { baseMinLineLength * $0 * systemFontScale } + let maxLineLength = maximalLineLength.map { baseMaxLineLength * $0 * systemFontScale } + let minMargins = baseMinMargins * minMargins * systemFontScale + + let minMarginsWithInsets: Double = { + if verticalText { + return max(minMargins, max(safeAreaInsets.top, safeAreaInsets.bottom)) + } else { + return max(minMargins, max(safeAreaInsets.left, safeAreaInsets.right)) + } + }() + + if scroll { + return scrolledLayout( + viewportSize: verticalText ? viewportSize.height : viewportSize.width, + minimalMargins: minMarginsWithInsets, + maximalLineLength: maxLineLength + ) + } else { + return paginatedLayout( + viewportWidth: viewportSize.width, + requestedColCount: columnCount, + minimalMargins: minMarginsWithInsets, + optimalLineLength: optimalLineLength, + maximalLineLength: maxLineLength, + minimalLineLength: minLineLength + ) + } + } + + private func scrolledLayout( + viewportSize: Double, + minimalMargins: Double, + maximalLineLength: Double? + ) -> Layout { + let minMargins = min(minimalMargins, viewportSize) + let availableSize = viewportSize - (minMargins * 2) + let maximalLineLength = maximalLineLength.map { max($0, minMargins * 2) } + let lineLength = min(availableSize, maximalLineLength ?? availableSize) + + return Layout( + colCount: 1, + lineLength: lineLength + ) + } + + private func paginatedLayout( + viewportWidth: Double, + requestedColCount: Int?, + minimalMargins: Double, + optimalLineLength: Double, + maximalLineLength: Double?, + minimalLineLength: Double? + ) -> Layout { + guard let requestedColCount, requestedColCount > 0 else { + return paginatedLayoutAuto( + minimalPageGutter: minimalMargins, + optimalLineLength: optimalLineLength, + viewportWidth: viewportWidth, + maximalLineLength: maximalLineLength + ) + } + + return paginatedLayoutNColumns( + colCount: requestedColCount, + minimalMargins: minimalMargins, + viewportWidth: viewportWidth, + minimalLineLength: minimalLineLength, + maximalLineLength: maximalLineLength + ) + } + + private func paginatedLayoutAuto( + minimalPageGutter: Double, + optimalLineLength: Double, + viewportWidth: Double, + maximalLineLength: Double? + ) -> Layout { + let optimalLineLength = min(optimalLineLength, viewportWidth) + guard optimalLineLength > 0 else { + return Layout(colCount: 1, lineLength: 0) + } + + let minMarginWidthWithFloatingColCount = + (minimalPageGutter * 2 * (viewportWidth / optimalLineLength)) / (1 + (minimalPageGutter * 2 / optimalLineLength)) + + let floatingColCount = (viewportWidth - minMarginWidthWithFloatingColCount) / optimalLineLength + let colCount = max(1, Int(floor(floatingColCount).rounded())) + + let minMarginWidth = minimalPageGutter * 2 * Double(colCount) + let available = (viewportWidth - minMarginWidth) / Double(colCount) + let lineLength = min(available, maximalLineLength ?? available) + + return Layout(colCount: colCount, lineLength: lineLength) + } + + private func paginatedLayoutNColumns( + colCount: Int, + minimalMargins: Double, + viewportWidth: Double, + minimalLineLength: Double?, + maximalLineLength: Double? + ) -> Layout { + let minPageGutter = min(minimalMargins, viewportWidth) + let actualAvailableWidth = viewportWidth - (minPageGutter * 2 * Double(colCount)) + let minimalLineLength = minimalLineLength.map { min($0, actualAvailableWidth) } + let maximalLineLength = maximalLineLength.map { max($0, minPageGutter * 2) } + + let lineLength = actualAvailableWidth / Double(colCount) + + if let minimalLineLength, lineLength < minimalLineLength, colCount > 1 { + return paginatedLayoutNColumns( + colCount: colCount - 1, + minimalMargins: minPageGutter, + viewportWidth: viewportWidth, + minimalLineLength: minimalLineLength, + maximalLineLength: maximalLineLength + ) + } else if let maximalLineLength, lineLength > maximalLineLength { + return Layout( + colCount: colCount, + lineLength: maximalLineLength + ) + } else { + return Layout( + colCount: colCount, + lineLength: lineLength + ) + } + } +} diff --git a/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift b/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift index 78df071742..1d973b5943 100644 --- a/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift +++ b/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift @@ -21,7 +21,11 @@ struct ReadiumCSS { extension ReadiumCSS { @MainActor - mutating func update(with settings: EPUBSettings) { + mutating func update( + with settings: EPUBSettings, + resolvedLayout: LayoutResolver.Layout? = nil, + safeAreaInsets: UIEdgeInsets = .zero + ) { layout = settings.cssLayout var overrides: [String: String] = [ @@ -38,12 +42,22 @@ extension ReadiumCSS { overrides["--RS__pageGutter"] = gutterString if settings.scroll { - if settings.verticalText { - overrides["--RS__scrollPaddingTop"] = gutterString - overrides["--RS__scrollPaddingBottom"] = gutterString + if resolvedLayout != nil { + if settings.verticalText { + overrides["--RS__scrollPaddingLeft"] = String(format: "%.5fpx", safeAreaInsets.left / settings.fontSize) + overrides["--RS__scrollPaddingRight"] = String(format: "%.5fpx", safeAreaInsets.right / settings.fontSize) + } else { + overrides["--RS__scrollPaddingTop"] = String(format: "%.5fpx", safeAreaInsets.top / settings.fontSize) + overrides["--RS__scrollPaddingBottom"] = String(format: "%.5fpx", safeAreaInsets.bottom / settings.fontSize) + } } else { - overrides["--RS__scrollPaddingLeft"] = gutterString - overrides["--RS__scrollPaddingRight"] = gutterString + if settings.verticalText { + overrides["--RS__scrollPaddingTop"] = gutterString + overrides["--RS__scrollPaddingBottom"] = gutterString + } else { + overrides["--RS__scrollPaddingLeft"] = gutterString + overrides["--RS__scrollPaddingRight"] = gutterString + } } } @@ -62,11 +76,15 @@ extension ReadiumCSS { break } + let colCount: Int = resolvedLayout?.colCount ?? settings.columnCount + let lineLength: CSSLength? = resolvedLayout.map { CSSPxLength($0.lineLength / settings.fontSize) } + ?? CSSPercentLength(settings.lineLength) + userProperties = CSSUserProperties( view: settings.scroll ? .scroll : .paged, - colCount: settings.columnCount, + colCount: colCount, pageMargins: settings.pageMargins, - lineLength: CSSPercentLength(settings.lineLength), + lineLength: lineLength, appearance: { switch settings.theme { case .light: return nil diff --git a/Sources/Navigator/EPUB/EPUBNavigatorViewController.swift b/Sources/Navigator/EPUB/EPUBNavigatorViewController.swift index 454cfa7301..57749c1d32 100644 --- a/Sources/Navigator/EPUB/EPUBNavigatorViewController.swift +++ b/Sources/Navigator/EPUB/EPUBNavigatorViewController.swift @@ -426,7 +426,7 @@ open class EPUBNavigatorViewController: InputObservableViewController, // We may need to refresh the spreads in this situation. Unfortunately, // the `viewWillTransition(to:with:)` API is called before we receive // the `didBecomeActive` notification, so we cannot rely on it here. - viewModel.viewSizeWillChange(view.bounds.size) + viewModel.viewSizeWillChange(view.bounds.size, insets: view.safeAreaInsets) if needsReloadSpreadsOnActive { needsReloadSpreadsOnActive = false @@ -481,14 +481,28 @@ open class EPUBNavigatorViewController: InputObservableViewController, override open func viewWillAppear(_ animated: Bool) { super.viewWillAppear(animated) - viewModel.viewSizeWillChange(view.bounds.size) + viewModel.viewSizeWillChange(view.bounds.size, insets: view.safeAreaInsets) + } + + override open func viewDidLayoutSubviews() { + super.viewDidLayoutSubviews() + if isActive { + viewModel.viewSizeWillChange(view.bounds.size, insets: view.safeAreaInsets) + } + } + + override open func viewSafeAreaInsetsDidChange() { + super.viewSafeAreaInsetsDidChange() + if isActive { + viewModel.safeAreaInsetsDidChange(view.safeAreaInsets) + } } override open func viewWillTransition(to size: CGSize, with coordinator: UIViewControllerTransitionCoordinator) { super.viewWillTransition(to: size, with: coordinator) if isActive { - viewModel.viewSizeWillChange(size) + viewModel.viewSizeWillChange(size, insets: view.safeAreaInsets) } } diff --git a/Sources/Navigator/EPUB/EPUBNavigatorViewModel.swift b/Sources/Navigator/EPUB/EPUBNavigatorViewModel.swift index ba6f365e7b..50678702df 100644 --- a/Sources/Navigator/EPUB/EPUBNavigatorViewModel.swift +++ b/Sources/Navigator/EPUB/EPUBNavigatorViewModel.swift @@ -281,13 +281,28 @@ enum EPUBScriptScope { private(set) var spreadEnabled: Bool = false private var viewSize: CGSize? + private var safeAreaInsets: UIEdgeInsets = .zero + private let layoutResolver = LayoutResolver() - func viewSizeWillChange(_ newSize: CGSize) { - guard viewSize != newSize else { + func viewSizeWillChange(_ newSize: CGSize, insets: UIEdgeInsets? = nil) { + let insetsChanged = insets != nil && insets != safeAreaInsets + guard viewSize != newSize || insetsChanged else { return } viewSize = newSize + if let insets = insets { + safeAreaInsets = insets + } updateSpread() + updateCSS(with: settings, commitNow: true) + } + + func safeAreaInsetsDidChange(_ insets: UIEdgeInsets) { + guard safeAreaInsets != insets else { + return + } + safeAreaInsets = insets + updateCSS(with: settings, commitNow: true) } private func updateSpread() { @@ -343,7 +358,15 @@ enum EPUBScriptScope { private func updateCSS(with settings: EPUBSettings, commitNow: Bool) { let previous = css - css.update(with: settings) + let layout = viewSize.flatMap { size -> LayoutResolver.Layout? in + guard size.width > 0, size.height > 0 else { return nil } + return layoutResolver.layout( + settings: settings, + viewportSize: size, + safeAreaInsets: safeAreaInsets + ) + } + css.update(with: settings, resolvedLayout: layout, safeAreaInsets: safeAreaInsets) // HTML resources in the cache have the CSS already injected at the time // they were first served. Evict them so that any future resource load From 40296466a5b033834280992252a46928694f8007 Mon Sep 17 00:00:00 2001 From: Steven Zeck <8315038+stevenzeck@users.noreply.github.com> Date: Tue, 22 Sep 2026 09:04:12 -0500 Subject: [PATCH 16/21] Add and update tests --- .../EPUB/CSS/LayoutResolverTests.swift | 271 ++++++++++++++++++ .../EPUB/CSS/ReadiumCSSTests.swift | 38 +++ 2 files changed, 309 insertions(+) create mode 100644 Tests/NavigatorTests/EPUB/CSS/LayoutResolverTests.swift diff --git a/Tests/NavigatorTests/EPUB/CSS/LayoutResolverTests.swift b/Tests/NavigatorTests/EPUB/CSS/LayoutResolverTests.swift new file mode 100644 index 0000000000..5a200793fc --- /dev/null +++ b/Tests/NavigatorTests/EPUB/CSS/LayoutResolverTests.swift @@ -0,0 +1,271 @@ +// +// Copyright 2026 Readium Foundation. All rights reserved. +// Use of this source code is governed by the BSD-style license +// available in the top-level LICENSE file of the project. +// + +import CoreGraphics +@testable import ReadiumNavigator +import ReadiumShared +import Testing +import UIKit + +struct LayoutResolverTests { + let resolver = LayoutResolver( + baseMinMargins: 30.0, + baseOptimalLineLength: 640.0, + baseMinLineLength: 440.0, + baseMaxLineLength: 740.0 + ) + + // MARK: - Scrolled Layout + + @Test func scrolledHorizontalLayout() { + let layout = resolver.layout( + scroll: true, + verticalText: false, + columnCount: nil, + optimalLineLength: 1.0, + minimalLineLength: nil, + maximalLineLength: nil, + minMargins: 1.0, + systemFontScale: 1.0, + viewportSize: CGSize(width: 800, height: 600), + safeAreaInsets: .zero + ) + + // colCount is always 1 for scroll + #expect(layout.colCount == 1) + // available = 800 - 30 * 2 = 740 + #expect(layout.lineLength == 740.0) + } + + @Test func scrolledVerticalTextUsesHeight() { + let layout = resolver.layout( + scroll: true, + verticalText: true, + columnCount: nil, + optimalLineLength: 1.0, + minimalLineLength: nil, + maximalLineLength: nil, + minMargins: 1.0, + systemFontScale: 1.0, + viewportSize: CGSize(width: 800, height: 600), + safeAreaInsets: .zero + ) + + #expect(layout.colCount == 1) + // available = 600 (height) - 30 * 2 = 540 + #expect(layout.lineLength == 540.0) + } + + @Test func scrolledLayoutClampsMaximalLineLength() { + let layout = resolver.layout( + scroll: true, + verticalText: false, + columnCount: nil, + optimalLineLength: 1.0, + minimalLineLength: nil, + maximalLineLength: 0.8, // 740 * 0.8 = 592 + minMargins: 1.0, + systemFontScale: 1.0, + viewportSize: CGSize(width: 1000, height: 800), + safeAreaInsets: .zero + ) + + #expect(layout.colCount == 1) + // available = 1000 - 60 = 940, clamped to max 592 + #expect(layout.lineLength == 592.0) + } + + @Test func scrolledLayoutWithSafeAreaInsets() { + let layout = resolver.layout( + scroll: true, + verticalText: false, + columnCount: nil, + optimalLineLength: 1.0, + minimalLineLength: nil, + maximalLineLength: nil, + minMargins: 1.0, // 30 + systemFontScale: 1.0, + viewportSize: CGSize(width: 800, height: 600), + safeAreaInsets: UIEdgeInsets(top: 10, left: 50, bottom: 10, right: 40) + ) + + #expect(layout.colCount == 1) + // insets max(50, 40) = 50 > minMargins 30 -> margins = 50 + // available = 800 - 50 * 2 = 700 + #expect(layout.lineLength == 700.0) + } + + // MARK: - Paginated Layout Auto + + @Test func paginatedAutoSingleColumnOnPhone() { + let layout = resolver.layout( + scroll: false, + verticalText: false, + columnCount: nil, + optimalLineLength: 1.0, + minimalLineLength: nil, + maximalLineLength: nil, + minMargins: 1.0, + systemFontScale: 1.0, + viewportSize: CGSize(width: 390, height: 844), + safeAreaInsets: .zero + ) + + #expect(layout.colCount == 1) + // minMarginWidth = 30 * 2 * 1 = 60 + // lineLength = (390 - 60) / 1 = 330 + #expect(layout.lineLength == 330.0) + } + + @Test func paginatedAutoTwoColumnsOnWideScreen() { + let layout = resolver.layout( + scroll: false, + verticalText: false, + columnCount: nil, + optimalLineLength: 1.0, + minimalLineLength: nil, + maximalLineLength: nil, + minMargins: 1.0, + systemFontScale: 1.0, + viewportSize: CGSize(width: 1400, height: 900), + safeAreaInsets: .zero + ) + + #expect(layout.colCount == 2) + // minMarginWidth = 30 * 2 * 2 = 120 + // lineLength = (1400 - 120) / 2 = 640 + #expect(layout.lineLength == 640.0) + } + + @Test func paginatedAutoClampsToMaximalLineLength() { + let layout = resolver.layout( + scroll: false, + verticalText: false, + columnCount: nil, + optimalLineLength: 1.0, + minimalLineLength: nil, + maximalLineLength: 0.8, // 740 * 0.8 = 592 + minMargins: 1.0, + systemFontScale: 1.0, + viewportSize: CGSize(width: 1400, height: 900), + safeAreaInsets: .zero + ) + + #expect(layout.colCount == 2) + // available = (1400 - 120) / 2 = 640, clamped to max 592 + #expect(layout.lineLength == 592.0) + } + + // MARK: - Paginated Layout N Columns + + @Test func paginatedRequestedColumnsHonoredWhenFitting() { + let layout = resolver.layout( + scroll: false, + verticalText: false, + columnCount: 2, + optimalLineLength: 1.0, + minimalLineLength: 1.0, // 440 + maximalLineLength: nil, + minMargins: 1.0, // 30 + systemFontScale: 1.0, + viewportSize: CGSize(width: 1200, height: 800), + safeAreaInsets: .zero + ) + + #expect(layout.colCount == 2) + // available = 1200 - 30 * 2 * 2 = 1080 + // lineLength = 1080 / 2 = 540 >= minimalLineLength 440 + #expect(layout.lineLength == 540.0) + } + + @Test func paginatedRequestedColumnsReducedWhenBelowMinimalLineLength() { + let layout = resolver.layout( + scroll: false, + verticalText: false, + columnCount: 2, + optimalLineLength: 1.0, + minimalLineLength: 1.0, // 440 + maximalLineLength: nil, + minMargins: 1.0, // 30 + systemFontScale: 1.0, + viewportSize: CGSize(width: 600, height: 800), + safeAreaInsets: .zero + ) + + // For 2 columns: available = 600 - 120 = 480 / 2 = 240 < 440 + // Reduces to 1 column: available = 600 - 60 = 540 + #expect(layout.colCount == 1) + #expect(layout.lineLength == 540.0) + } + + // MARK: - EPUBSettings Overload + + @Test func layoutWithEPUBSettings() { + let settings = EPUBSettings( + backgroundColor: nil, + columnCount: 0, // auto + fit: .auto, + fontFamily: nil, + fontSize: 1.0, + fontWeight: nil, + hyphens: nil, + blendImages: nil, + darkenImages: nil, + invertImages: nil, + invertGaiji: nil, + language: nil, + letterSpacing: nil, + ligatures: nil, + lineLength: 1.0, + lineHeight: nil, + offsetFirstPage: nil, + pageMargins: 1.0, + paragraphIndent: nil, + paragraphSpacing: nil, + publisherStyles: true, + readingProgression: .ltr, + scroll: false, + spread: .auto, + textAlign: nil, + textColor: nil, + textNormalization: false, + theme: .light, + typeScale: nil, + verticalText: false, + wordSpacing: nil + ) + + let layout = resolver.layout( + settings: settings, + systemFontScale: 1.0, + viewportSize: CGSize(width: 1400, height: 900) + ) + + #expect(layout.colCount == 2) + #expect(layout.lineLength == 640.0) + } + + @Test func systemFontScaleScalesLineLengthAndMargins() { + let fontScale = 1.5 + let layout = resolver.layout( + scroll: true, + verticalText: false, + columnCount: nil, + optimalLineLength: 1.0, + minimalLineLength: nil, + maximalLineLength: nil, + minMargins: 1.0, + systemFontScale: fontScale, + viewportSize: CGSize(width: 1000, height: 800), + safeAreaInsets: .zero + ) + + // margins: 30 * 1.0 * 1.5 = 45 + // available: 1000 - 45 * 2 = 910 + #expect(layout.colCount == 1) + #expect(layout.lineLength == 910.0) + } +} diff --git a/Tests/NavigatorTests/EPUB/CSS/ReadiumCSSTests.swift b/Tests/NavigatorTests/EPUB/CSS/ReadiumCSSTests.swift index e1d1348053..9211886dc3 100644 --- a/Tests/NavigatorTests/EPUB/CSS/ReadiumCSSTests.swift +++ b/Tests/NavigatorTests/EPUB/CSS/ReadiumCSSTests.swift @@ -7,6 +7,7 @@ @testable import ReadiumNavigator import ReadiumShared import Testing +import UIKit struct ReadiumCSSTests { let baseURL = HTTPURL(string: "https://readium/assets")! @@ -405,4 +406,41 @@ struct ReadiumCSSTests { css.userProperties.cssProperties()["--RS__scrollPaddingRight"] == "30.00000px" ) } + + @Test @MainActor func updateWithLayoutAppliesColCountAndLineLength() { + var css = ReadiumCSS(baseURL: baseURL) + let settings = EPUBSettings( + preferences: EPUBPreferences(fontSize: 2.0), + defaults: EPUBDefaults(), + metadata: Metadata(title: "Test") + ) + let layout = LayoutResolver.Layout(colCount: 2, lineLength: 640.0) + css.update(with: settings, resolvedLayout: layout) + + #expect( + css.userProperties.cssProperties()["--USER__colCount"] == "2" + ) + #expect( + css.userProperties.cssProperties()["--USER__lineLength"] == "320.00000px" + ) + } + + @Test @MainActor func updateWithLayoutAndScrollSettingsComputesScrollPaddingFromInsets() { + var css = ReadiumCSS(baseURL: baseURL) + let settings = EPUBSettings( + preferences: EPUBPreferences(scroll: true), + defaults: EPUBDefaults(), + metadata: Metadata(title: "Test") + ) + let insets = UIEdgeInsets(top: 44, left: 20, bottom: 34, right: 25) + let layout = LayoutResolver.Layout(colCount: 1, lineLength: 500.0) + css.update(with: settings, resolvedLayout: layout, safeAreaInsets: insets) + + #expect( + css.userProperties.cssProperties()["--RS__scrollPaddingTop"] == "44.00000px" + ) + #expect( + css.userProperties.cssProperties()["--RS__scrollPaddingBottom"] == "34.00000px" + ) + } } From 1e8f0b2f922b48bb5a832beead33f3b0d63fe2da Mon Sep 17 00:00:00 2001 From: Steven Zeck <8315038+stevenzeck@users.noreply.github.com> Date: Tue, 22 Sep 2026 09:04:22 -0500 Subject: [PATCH 17/21] Fix deprecation in old test --- Tests/NavigatorTests/EPUB/EPUBReadingOrderTests.swift | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/Tests/NavigatorTests/EPUB/EPUBReadingOrderTests.swift b/Tests/NavigatorTests/EPUB/EPUBReadingOrderTests.swift index 953147e78a..3bd77a8161 100644 --- a/Tests/NavigatorTests/EPUB/EPUBReadingOrderTests.swift +++ b/Tests/NavigatorTests/EPUB/EPUBReadingOrderTests.swift @@ -152,7 +152,7 @@ enum EPUBReadingOrderTests { #expect(result.index == 1) #expect(result.locator.href.string == "p1.jpg") - #expect(result.locator.mediaType == .jpeg) + #expect(result.locator.mediaType.matches(.jpeg)) #expect(result.locator.locations.fragments.isEmpty) #expect(result.locator.locations.otherLocations.isEmpty) #expect(result.locator.locations.progression == 0.5) @@ -177,7 +177,7 @@ enum EPUBReadingOrderTests { #expect(result.index == 1) #expect(result.locator.href.string == "p1.xhtml") - #expect(result.locator.mediaType == .xhtml) + #expect(result.locator.mediaType.matches(.xhtml)) #expect(result.locator.locations.progression == 0) } From 78a79fad20d9371abab6cf1ae6b7c3196c698ed9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micka=C3=ABl=20Menu?= Date: Fri, 25 Sep 2026 18:02:58 +0200 Subject: [PATCH 18/21] Fix the CHANGELOG --- CHANGELOG.md | 26 ++++++++++++-------------- 1 file changed, 12 insertions(+), 14 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index c4fd302d65..7de54e7730 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -10,6 +10,12 @@ All notable changes to this project will be documented in this file. Take a look #### Navigator * `AudioNavigator.stop()` stops the playback and ends the audio session. +* Upgraded Readium CSS to version 2.0.5. +* Added the `noRuby` preference to `EPUBPreferences`, `EPUBSettings`, `EPUBDefaults`, and `EPUBPreferencesEditor` to allow hiding ruby (furigana) annotations in CJK publications. +* Added `CSSRSProperties.defaultLineLength`, `viewportWidth`, `scrollPaddingTop`, `scrollPaddingBottom`, `scrollPaddingLeft`, and `scrollPaddingRight` to configure Readium CSS v2 reading system properties. +* Added the `lineLength` preference to `EPUBPreferences`, `EPUBSettings`, `EPUBDefaults`, and `EPUBPreferencesEditor`. This setting behaves as a factor applied to the maximum width of the text column, offering finer control over text presentation than `pageMargins` (which solely handles the padding around the text). +* Added `blendImages`, `darkenImages`, `invertImages`, and `invertGaiji` to `EPUBPreferences`, `EPUBSettings`, `EPUBDefaults`, and `EPUBPreferencesEditor` for precise CSS filtering of images. +* Added optional CSS minification to the build scripts (`make scripts minify=true`). ### Changed @@ -21,6 +27,12 @@ All notable changes to this project will be documented in this file. Take a look * `end(with:)` takes the `AudioSessionUser` instead of an `AudioSessionToken`, which is removed. * `NowPlayingInfo.Media.chapterNumber` moved to `NowPlayingInfo.Playback.chapterNumber`, [see the migration guide](docs/Migration%20Guide.md). +#### Navigator + +* `CSSRSProperties.maxLineLength` is deprecated in favor of `defaultLineLength` to match Readium CSS v2, [see the migration guide](docs/Migration%20Guide.md). +* Changed `columnCount` preference in `EPUBPreferences`, `EPUBSettings`, and `EPUBDefaults` to `Int` to support arbitrary column counts. The `ColumnCount` enum is removed, [see the migration guide](docs/Migration%20Guide.md). +* Replaced the `imageFilter` preference with `blendImages`, `darkenImages`, `invertImages`, and `invertGaiji`. The `ImageFilter` enum is removed, [see the migration guide](docs/Migration%20Guide.md). + ### Fixed #### Navigator @@ -36,20 +48,6 @@ All notable changes to this project will be documented in this file. Take a look #### Navigator -* Upgraded Readium CSS to version 2.0.5. -* Added the `noRuby` preference to `EPUBPreferences`, `EPUBSettings`, `EPUBDefaults`, and `EPUBPreferencesEditor` to allow hiding ruby (furigana) annotations in CJK publications. -* Added `CSSRSProperties.defaultLineLength`, `viewportWidth`, `scrollPaddingTop`, `scrollPaddingBottom`, `scrollPaddingLeft`, and `scrollPaddingRight` to configure Readium CSS v2 reading system properties. -* Added the `lineLength` preference to `EPUBPreferences`, `EPUBSettings`, `EPUBDefaults`, and `EPUBPreferencesEditor`. This setting behaves as a factor applied to the maximum width of the text column, offering finer control over text presentation than `pageMargins` (which solely handles the padding around the text). -* Added `blendImages`, `darkenImages`, `invertImages`, and `invertGaiji` to `EPUBPreferences`, `EPUBSettings`, `EPUBDefaults`, and `EPUBPreferencesEditor` for precise CSS filtering of images. -* Added optional CSS minification to the build scripts (`make scripts minify=true`). - -### Changed - -#### Navigator - -* `CSSRSProperties.maxLineLength` is deprecated in favor of `defaultLineLength` to match Readium CSS v2. -* Changed `columnCount` preference in `EPUBPreferences`, `EPUBSettings`, and `EPUBDefaults` to `Int` to support arbitrary column counts. The `ColumnCount` enum is removed. -* Replaced the `imageFilter` preference with `blendImages`, `darkenImages`, `invertImages`, and `invertGaiji`. The `ImageFilter` enum is removed. * The EPUB navigator supports publications mixing reflowable and fixed-layout resources, rendering each resource according to its own layout. * New `EPUBNavigatorViewController.Configuration.preferredResourceVariant` to choose which variant of each resource is rendered among its `alternates`, such as the XHTML page or its bitmap fallback. * Bitmap resources in the reading order are rendered as fixed-layout, even in a reflowable publication. From 1f174ccb4b519082f02c2a4e7bffb2d7481b32cc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micka=C3=ABl=20Menu?= Date: Fri, 25 Sep 2026 19:00:32 +0200 Subject: [PATCH 19/21] Remove Readium CSS v1 flags and the `publisherStyles` preference --- CHANGELOG.md | 19 ++- .../Navigator/EPUB/CSS/CSSProperties.swift | 59 ++----- Sources/Navigator/EPUB/CSS/ReadiumCSS.swift | 3 - .../Preferences/EPUBPreferences+Legacy.swift | 2 - .../EPUB/Preferences/EPUBPreferences.swift | 13 +- .../Preferences/EPUBPreferencesEditor.swift | 32 +--- .../EPUB/Preferences/EPUBSettings.swift | 18 +- .../Common/Preferences/UserPreferences.swift | 159 ++++++++---------- .../EPUB/CSS/CSSUserPropertiesTests.swift | 15 -- .../EPUB/CSS/LayoutResolverTests.swift | 1 - docs/Guides/Navigator/Preferences.md | 14 +- docs/Migration Guide.md | 17 +- 12 files changed, 141 insertions(+), 211 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 7de54e7730..4f20f3a7ac 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -11,11 +11,11 @@ All notable changes to this project will be documented in this file. Take a look * `AudioNavigator.stop()` stops the playback and ends the audio session. * Upgraded Readium CSS to version 2.0.5. -* Added the `noRuby` preference to `EPUBPreferences`, `EPUBSettings`, `EPUBDefaults`, and `EPUBPreferencesEditor` to allow hiding ruby (furigana) annotations in CJK publications. -* Added `CSSRSProperties.defaultLineLength`, `viewportWidth`, `scrollPaddingTop`, `scrollPaddingBottom`, `scrollPaddingLeft`, and `scrollPaddingRight` to configure Readium CSS v2 reading system properties. -* Added the `lineLength` preference to `EPUBPreferences`, `EPUBSettings`, `EPUBDefaults`, and `EPUBPreferencesEditor`. This setting behaves as a factor applied to the maximum width of the text column, offering finer control over text presentation than `pageMargins` (which solely handles the padding around the text). -* Added `blendImages`, `darkenImages`, `invertImages`, and `invertGaiji` to `EPUBPreferences`, `EPUBSettings`, `EPUBDefaults`, and `EPUBPreferencesEditor` for precise CSS filtering of images. -* Added optional CSS minification to the build scripts (`make scripts minify=true`). + * Added the `noRuby` preference to allow hiding ruby (furigana) annotations in CJK publications. + * Added the `lineLength` preference, which behaves as a factor applied to the maximum width of the text column, offering finer control over text presentation than `pageMargins` (which solely handles the padding around the text). + * Added `blendImages`, `darkenImages`, `invertImages`, and `invertGaiji` preferences for precise CSS filtering of images. + * Added `CSSRSProperties.defaultLineLength`, `viewportWidth`, `scrollPaddingTop`, `scrollPaddingBottom`, `scrollPaddingLeft`, and `scrollPaddingRight` to configure Readium CSS v2 reading system properties. + * Added optional CSS minification to the build scripts (`make scripts minify=true`). ### Changed @@ -29,9 +29,12 @@ All notable changes to this project will be documented in this file. Take a look #### Navigator -* `CSSRSProperties.maxLineLength` is deprecated in favor of `defaultLineLength` to match Readium CSS v2, [see the migration guide](docs/Migration%20Guide.md). -* Changed `columnCount` preference in `EPUBPreferences`, `EPUBSettings`, and `EPUBDefaults` to `Int` to support arbitrary column counts. The `ColumnCount` enum is removed, [see the migration guide](docs/Migration%20Guide.md). -* Replaced the `imageFilter` preference with `blendImages`, `darkenImages`, `invertImages`, and `invertGaiji`. The `ImageFilter` enum is removed, [see the migration guide](docs/Migration%20Guide.md). +* Changes in the EPUB navigator preferences, following the upgrade to Readium CSS v2. + * `CSSRSProperties.maxLineLength` is deprecated in favor of `defaultLineLength` to match Readium CSS v2, [see the migration guide](docs/Migration%20Guide.md). + * Changed `columnCount` preference in `EPUBPreferences`, `EPUBSettings`, and `EPUBDefaults` to `Int` to support arbitrary column counts. The `ColumnCount` enum is removed, [see the migration guide](docs/Migration%20Guide.md). + * Replaced the `imageFilter` preference with `blendImages`, `darkenImages`, `invertImages`, and `invertGaiji`. The `ImageFilter` enum is removed, [see the migration guide](docs/Migration%20Guide.md). + * Removed the `publisherStyles` preference. Readium CSS v2 applies the user settings as soon as they are set, [see the migration guide](docs/Migration%20Guide.md). + * Removed `CSSUserProperties.fontOverride`, `advancedSettings`, and `pageMargins`, which don't exist in Readium CSS v2. ### Fixed diff --git a/Sources/Navigator/EPUB/CSS/CSSProperties.swift b/Sources/Navigator/EPUB/CSS/CSSProperties.swift index e3012fdef7..4c508ccdf9 100644 --- a/Sources/Navigator/EPUB/CSS/CSSProperties.swift +++ b/Sources/Navigator/EPUB/CSS/CSSProperties.swift @@ -48,13 +48,6 @@ public struct CSSUserProperties: CSSProperties, Sendable { /// To reset, change the value to 0. public var colCount: Int? - /// A factor applied to horizontal margins (padding-left and padding-right) the user wants to - /// set. - /// - /// Recommended values: a range from 0.5 to 2. Increments are left to implementers’ judgment. - /// To reset, change the value to 1. - public var pageMargins: Double? - /// The maximum line length. public var lineLength: CSSLength? @@ -92,85 +85,58 @@ public struct CSSUserProperties: CSSProperties, Sendable { // Typography - /// This flag is required to change the font-family user setting. - public var fontOverride: Bool? - /// The typeface (font-family) the user wants to read with. It impacts body, p, li, div, dt, dd /// and phrasing elements which don’t have a lang or xml:lang attribute. - /// - /// To reset, remove the required flag. - /// Requires: fontOverride public var fontFamily: [String]? /// Increasing and decreasing the root font-size. It will serve as a reference for the cascade. - /// - /// To reset, remove the required flag. public var fontSize: CSSLength? - // Advanced settings - - /// This flag is required to apply the font-size and/or advanced user settings. - public var advancedSettings: Bool? - /// The type scale the user wants to use for the publication. It impacts headings, p, li, div, /// pre, dd, small, sub, and sup. /// /// Recommended values: a range from 75% to 250%. Increments are left to implementers’ judgment. - /// Requires: advancedSettings public var typeScale: Double? /// The alignment (text-align) the user prefers. It impacts body, li, and p which are not /// children of blockquote and figcaption. - /// - /// Requires: advancedSettings public var textAlign: CSSTextAlign? /// Increasing and decreasing leading (line-height). It impacts body, p, li and div. /// /// Recommended values: a range from 1 to 2. Increments are left to implementers’ judgment. - /// Requires: advancedSettings public var lineHeight: CSSLineHeight? /// The vertical margins (margin-top and margin-bottom) for paragraphs. /// /// Recommended values: a range from 0 to 2rem. Increments are left to implementers’ judgment. - /// Requires: advancedSettings = true public var paraSpacing: CSSLength? /// The text-indent for paragraphs. /// /// Recommended values: a range from 0 to 3rem. Increments are left to implementers’ judgment. - /// Requires: advancedSettings public var paraIndent: CSSRemLength? /// Increasing space between words (word-spacing, related to a11y). /// /// Recommended values: a range from 0 to 1rem. Increments are left to implementers’ judgment. - /// Requires: advancedSettings public var wordSpacing: CSSRemLength? /// Increasing space between letters (letter-spacing, related to a11y). /// /// Recommended values: a range from 0 to 0.5rem. Increments are left to implementers’ /// judgment. - /// Requires: advancedSettings public var letterSpacing: CSSRemLength? /// Enabling and disabling hyphenation. It impacts body, p, li, div and dd. - /// - /// Requires: advancedSettings public var bodyHyphens: CSSHyphens? /// Enabling and disabling ligatures in Arabic (related to a11y). - /// - /// Requires: advancedSettings public var ligatures: CSSLigatures? // Accessibility /// It impacts font style, weight and variant, text decoration, super and subscripts. - /// - /// Requires: fontOverride public var a11yNormalize: Bool? /// Hiding/disabling ruby (furigana) annotations. @@ -182,7 +148,6 @@ public struct CSSUserProperties: CSSProperties, Sendable { public init( view: CSSView? = nil, colCount: Int? = nil, - pageMargins: Double? = nil, lineLength: CSSLength? = nil, appearance: CSSAppearance? = nil, blendImages: Bool? = nil, @@ -191,10 +156,8 @@ public struct CSSUserProperties: CSSProperties, Sendable { invertGaiji: Double? = nil, textColor: CSSColor? = nil, backgroundColor: CSSColor? = nil, - fontOverride: Bool? = nil, fontFamily: [String]? = nil, fontSize: CSSLength? = nil, - advancedSettings: Bool? = nil, typeScale: Double? = nil, textAlign: CSSTextAlign? = nil, lineHeight: CSSLineHeight? = nil, @@ -210,7 +173,6 @@ public struct CSSUserProperties: CSSProperties, Sendable { ) { self.view = view self.colCount = colCount - self.pageMargins = pageMargins self.lineLength = lineLength self.appearance = appearance self.blendImages = blendImages @@ -219,10 +181,8 @@ public struct CSSUserProperties: CSSProperties, Sendable { self.invertGaiji = invertGaiji self.textColor = textColor self.backgroundColor = backgroundColor - self.fontOverride = fontOverride self.fontFamily = fontFamily self.fontSize = fontSize - self.advancedSettings = advancedSettings self.typeScale = typeScale self.textAlign = textAlign self.lineHeight = lineHeight @@ -237,6 +197,21 @@ public struct CSSUserProperties: CSSProperties, Sendable { self.overrides = overrides } + @available(*, unavailable, message: "Not available in Readium CSS v2") + public var pageMargins: Double? { + fatalError() + } + + @available(*, unavailable, message: "Not needed anymore with Readium CSS v2") + public var fontOverride: Bool? { + fatalError() + } + + @available(*, unavailable, message: "Not needed anymore with Readium CSS v2") + public var advancedSettings: Bool? { + fatalError() + } + public func cssProperties() -> [String: String?] { var props: [String: String?] = [:] // View mode @@ -244,7 +219,6 @@ public struct CSSUserProperties: CSSProperties, Sendable { // Pagination props.putCSS(name: "--USER__colCount", value: colCount) - props.putCSS(name: "--USER__pageMargins", value: pageMargins) props.putCSS(name: "--USER__lineLength", value: lineLength) // Appearance @@ -259,12 +233,9 @@ public struct CSSUserProperties: CSSProperties, Sendable { props.putCSS(name: "--USER__backgroundColor", value: backgroundColor) // Typography - props.putCSS(name: "--USER__fontOverride", value: CSSFlag(name: "font", isEnabled: fontOverride)) props.putCSS(name: "--USER__fontFamily", value: fontFamily) props.putCSS(name: "--USER__fontSize", value: fontSize) - // Advanced settings - props.putCSS(name: "--USER__advancedSettings", value: CSSFlag(name: "advanced", isEnabled: advancedSettings)) props.putCSS(name: "--USER__typeScale", value: typeScale) props.putCSS(name: "--USER__textAlign", value: textAlign) props.putCSS(name: "--USER__lineHeight", value: lineHeight) diff --git a/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift b/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift index 1d973b5943..c36c758101 100644 --- a/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift +++ b/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift @@ -83,7 +83,6 @@ extension ReadiumCSS { userProperties = CSSUserProperties( view: settings.scroll ? .scroll : .paged, colCount: colCount, - pageMargins: settings.pageMargins, lineLength: lineLength, appearance: { switch settings.theme { @@ -98,10 +97,8 @@ extension ReadiumCSS { invertGaiji: settings.invertGaiji, textColor: settings.textColor.map { CSSIntColor($0.rawValue) }, backgroundColor: settings.backgroundColor.map { CSSIntColor($0.rawValue) }, - fontOverride: settings.fontFamily != nil || settings.textNormalization, fontFamily: settings.fontFamily.map(resolveFontStack), fontSize: CSSPercentLength(settings.fontSize), - advancedSettings: !settings.publisherStyles, typeScale: settings.typeScale, textAlign: { switch settings.textAlign { diff --git a/Sources/Navigator/EPUB/Preferences/EPUBPreferences+Legacy.swift b/Sources/Navigator/EPUB/Preferences/EPUBPreferences+Legacy.swift index cf8f2e1342..f7ec2f4cb2 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBPreferences+Legacy.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBPreferences+Legacy.swift @@ -47,7 +47,6 @@ public extension EPUBPreferences { lineHeight: defaults.optDouble(for: .lineHeight), pageMargins: defaults.optDouble(for: .pageMargins), paragraphSpacing: defaults.optDouble(for: .paragraphMargins), - publisherStyles: defaults.optBool(for: .publisherDefault), scroll: defaults.optBool(for: .scroll), // Used to be merged with column-count spread: defaults.optInt(for: .columnCount) @@ -129,7 +128,6 @@ private enum ReadiumCSSName: String { case fontOverride = "--USER__fontOverride" case appearance = "--USER__appearance" case scroll = "--USER__scroll" - case publisherDefault = "--USER__advancedSettings" case textAlignment = "--USER__textAlign" case columnCount = "--USER__colCount" case wordSpacing = "--USER__wordSpacing" diff --git a/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift b/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift index 4bcf00aed0..515eb80927 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift @@ -84,11 +84,6 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { /// Vertical margins for paragraphs. public var paragraphSpacing: Double? - /// Indicates whether the original publisher styles should be observed. - /// - /// Many settings require this to be off. - public var publisherStyles: Bool? - /// Direction of the reading progression across resources. public var readingProgression: ReadingProgression? @@ -146,7 +141,6 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { pageMargins: Double? = nil, paragraphIndent: Double? = nil, paragraphSpacing: Double? = nil, - publisherStyles: Bool? = nil, readingProgression: ReadingProgression? = nil, scroll: Bool? = nil, spread: Spread? = nil, @@ -179,7 +173,6 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { self.pageMargins = pageMargins.map { max($0, 0) } self.paragraphIndent = paragraphIndent self.paragraphSpacing = paragraphSpacing.map { max($0, 0) } - self.publisherStyles = publisherStyles self.readingProgression = readingProgression self.scroll = scroll self.spread = [nil, .never, .always].contains(spread) ? spread : nil @@ -215,7 +208,6 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { pageMargins: other.pageMargins ?? pageMargins, paragraphIndent: other.paragraphIndent ?? paragraphIndent, paragraphSpacing: other.paragraphSpacing ?? paragraphSpacing, - publisherStyles: other.publisherStyles ?? publisherStyles, readingProgression: other.readingProgression ?? readingProgression, scroll: other.scroll ?? scroll, spread: other.spread ?? spread, @@ -229,6 +221,11 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { ) } + @available(*, unavailable, message: "Not needed anymore with Readium CSS v2, user settings are applied as soon as they are set") + public var publisherStyles: Bool? { + fatalError() + } + /// Returns a new `EPUBPreferences` with the publication-specific preferences /// removed. public func filterSharedPreferences() -> EPUBPreferences { diff --git a/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift b/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift index c2f1182aa6..1dee2f030b 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift @@ -168,7 +168,6 @@ public final class EPUBPreferencesEditor: StatefulPreferencesEditor = preference( @@ -178,7 +177,6 @@ public final class EPUBPreferencesEditor: StatefulPreferencesEditor = rangePreference( @@ -261,7 +258,6 @@ public final class EPUBPreferencesEditor: StatefulPreferencesEditor = preference( @@ -283,7 +278,6 @@ public final class EPUBPreferencesEditor: StatefulPreferencesEditor = rangePreference( preference: \.lineHeight, @@ -300,7 +293,6 @@ public final class EPUBPreferencesEditor: StatefulPreferencesEditor = rangePreference( @@ -383,7 +374,6 @@ public final class EPUBPreferencesEditor: StatefulPreferencesEditor = rangePreference( preference: \.paragraphSpacing, @@ -403,7 +392,6 @@ public final class EPUBPreferencesEditor: StatefulPreferencesEditor = - preference( - preference: \.publisherStyles, - setting: \.publisherStyles, - defaultEffectiveValue: defaults.publisherStyles ?? true, - isEffective: { [layouts] _ in layouts.contains(.reflowable) } - ) + @available(*, unavailable, message: "Not needed anymore with Readium CSS v2, user settings are applied as soon as they are set") + public var publisherStyles: AnyPreference { + fatalError() + } /// Direction of the reading progression across resources. /// @@ -466,7 +447,6 @@ public final class EPUBPreferencesEditor: StatefulPreferencesEditor = enumPreference( @@ -475,7 +455,6 @@ public final class EPUBPreferencesEditor: StatefulPreferencesEditor = rangePreference( preference: \.typeScale, @@ -534,7 +512,6 @@ public final class EPUBPreferencesEditor: StatefulPreferencesEditor? = nil, paragraphIndent: AnyRangePreference? = nil, paragraphSpacing: AnyRangePreference? = nil, - publisherStyles: AnyPreference? = nil, readingProgression: AnyEnumPreference? = nil, scroll: AnyPreference? = nil, textAlign: AnyEnumPreference? = nil, @@ -544,100 +542,89 @@ struct UserPreferences< } } - if let publisherStyles = publisherStyles { + if textAlign != nil || typeScale != nil || lineHeight != nil || paragraphIndent != nil || paragraphSpacing != nil || wordSpacing != nil || letterSpacing != nil || hyphens != nil || ligatures != nil { Section { - toggleRow( - title: "Publisher styles", - preference: publisherStyles, - commit: commit - ) - - // The following settings all require the publisher styles to - // be disabled for EPUB. To simplify the interface, they are - // hidden when the publisher styles are on. - if !publisherStyles.effectiveValue { - if let textAlign = textAlign { - pickerRow( - title: "Text alignment", - preference: textAlign, - commit: commit, - formatValue: { v in - switch v { - case nil: return "Default" - case .center: return "Center" - case .left: return "Left" - case .right: return "Right" - case .justify: return "Justify" - case .start: return "Start" - case .end: return "End" - } + if let textAlign = textAlign { + pickerRow( + title: "Text alignment", + preference: textAlign, + commit: commit, + formatValue: { v in + switch v { + case nil: return "Default" + case .center: return "Center" + case .left: return "Left" + case .right: return "Right" + case .justify: return "Justify" + case .start: return "Start" + case .end: return "End" } - ) - } + } + ) + } - if let typeScale = typeScale { - stepperRow( - title: "Type scale", - preference: typeScale, - commit: commit - ) - } + if let typeScale = typeScale { + stepperRow( + title: "Type scale", + preference: typeScale, + commit: commit + ) + } - if let lineHeight = lineHeight { - stepperRow( - title: "Line height", - preference: lineHeight, - commit: commit - ) - } + if let lineHeight = lineHeight { + stepperRow( + title: "Line height", + preference: lineHeight, + commit: commit + ) + } - if let paragraphIndent = paragraphIndent { - stepperRow( - title: "Paragraph indent", - preference: paragraphIndent, - commit: commit - ) - } + if let paragraphIndent = paragraphIndent { + stepperRow( + title: "Paragraph indent", + preference: paragraphIndent, + commit: commit + ) + } - if let paragraphSpacing = paragraphSpacing { - stepperRow( - title: "Paragraph spacing", - preference: paragraphSpacing, - commit: commit - ) - } + if let paragraphSpacing = paragraphSpacing { + stepperRow( + title: "Paragraph spacing", + preference: paragraphSpacing, + commit: commit + ) + } - if let wordSpacing = wordSpacing { - stepperRow( - title: "Word spacing", - preference: wordSpacing, - commit: commit - ) - } + if let wordSpacing = wordSpacing { + stepperRow( + title: "Word spacing", + preference: wordSpacing, + commit: commit + ) + } - if let letterSpacing = letterSpacing { - stepperRow( - title: "Letter spacing", - preference: letterSpacing, - commit: commit - ) - } + if let letterSpacing = letterSpacing { + stepperRow( + title: "Letter spacing", + preference: letterSpacing, + commit: commit + ) + } - if let hyphens = hyphens { - toggleRow( - title: "Hyphens", - preference: hyphens, - commit: commit - ) - } + if let hyphens = hyphens { + toggleRow( + title: "Hyphens", + preference: hyphens, + commit: commit + ) + } - if let ligatures = ligatures { - toggleRow( - title: "Ligatures", - preference: ligatures, - commit: commit - ) - } + if let ligatures = ligatures { + toggleRow( + title: "Ligatures", + preference: ligatures, + commit: commit + ) } } } diff --git a/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift b/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift index d1056a2956..5b3e73fb9d 100644 --- a/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift +++ b/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift @@ -14,7 +14,6 @@ struct CSSUserPropertiesTests { CSSUserProperties().cssProperties() == [ "--USER__view": nil, "--USER__colCount": nil, - "--USER__pageMargins": nil, "--USER__lineLength": nil, "--USER__appearance": nil, "--USER__blendImages": nil, @@ -23,10 +22,8 @@ struct CSSUserPropertiesTests { "--USER__invertGaiji": nil, "--USER__textColor": nil, "--USER__backgroundColor": nil, - "--USER__fontOverride": nil, "--USER__fontFamily": nil, "--USER__fontSize": nil, - "--USER__advancedSettings": nil, "--USER__typeScale": nil, "--USER__textAlign": nil, "--USER__lineHeight": nil, @@ -47,7 +44,6 @@ struct CSSUserPropertiesTests { CSSUserProperties( view: .scroll, colCount: 0, - pageMargins: 1.2, lineLength: CSSPercentLength(42), appearance: .night, blendImages: true, @@ -56,10 +52,8 @@ struct CSSUserPropertiesTests { invertGaiji: 0.95, textColor: CSSHexColor("#FF0000"), backgroundColor: CSSHexColor("#00FF00"), - fontOverride: true, fontFamily: ["Times New"], fontSize: CSSVMaxLength(2.3), - advancedSettings: true, typeScale: 3.4, textAlign: .justify, lineHeight: .length(CSSPtLength(4.5)), @@ -74,7 +68,6 @@ struct CSSUserPropertiesTests { ).cssProperties() == [ "--USER__view": "readium-scroll-on", "--USER__colCount": "0", - "--USER__pageMargins": "1.20000", "--USER__lineLength": "4200.00000%", "--USER__appearance": "readium-night-on", "--USER__blendImages": "readium-blend-on", @@ -83,10 +76,8 @@ struct CSSUserPropertiesTests { "--USER__invertGaiji": "0.95000", "--USER__textColor": "#FF0000", "--USER__backgroundColor": "#00FF00", - "--USER__fontOverride": "readium-font-on", "--USER__fontFamily": "\"Times New\"", "--USER__fontSize": "2.30000vmax", - "--USER__advancedSettings": "readium-advanced-on", "--USER__typeScale": "3.40000", "--USER__textAlign": "justify", "--USER__lineHeight": "4.50000pt", @@ -137,7 +128,6 @@ struct CSSUserPropertiesTests { CSSUserProperties( view: .scroll, colCount: 0, - pageMargins: 1.2, lineLength: CSSPercentLength(42), appearance: .night, blendImages: true, @@ -146,10 +136,8 @@ struct CSSUserPropertiesTests { invertGaiji: 0.95, textColor: CSSHexColor("#FF0000"), backgroundColor: CSSHexColor("#00FF00"), - fontOverride: true, fontFamily: ["Times New", "Comic Sans"], fontSize: CSSVMaxLength(2.3), - advancedSettings: true, typeScale: 3.4, textAlign: .justify, lineHeight: .length(CSSPtLength(4.5)), @@ -163,7 +151,6 @@ struct CSSUserPropertiesTests { noRuby: true ).css() == """ --USER__a11yNormalize: readium-a11y-on !important; - --USER__advancedSettings: readium-advanced-on !important; --USER__appearance: readium-night-on !important; --USER__backgroundColor: #00FF00 !important; --USER__blendImages: readium-blend-on !important; @@ -171,7 +158,6 @@ struct CSSUserPropertiesTests { --USER__colCount: 0 !important; --USER__darkenImages: 0.80000 !important; --USER__fontFamily: "Times New", "Comic Sans" !important; - --USER__fontOverride: readium-font-on !important; --USER__fontSize: 2.30000vmax !important; --USER__invertGaiji: 0.95000 !important; --USER__invertImages: 0.90000 !important; @@ -180,7 +166,6 @@ struct CSSUserPropertiesTests { --USER__lineHeight: 4.50000pt !important; --USER__lineLength: 4200.00000% !important; --USER__noRuby: readium-noRuby-on !important; - --USER__pageMargins: 1.20000 !important; --USER__paraIndent: 6.70000rem !important; --USER__paraSpacing: 5.60000pt !important; --USER__textAlign: justify !important; diff --git a/Tests/NavigatorTests/EPUB/CSS/LayoutResolverTests.swift b/Tests/NavigatorTests/EPUB/CSS/LayoutResolverTests.swift index 5a200793fc..e131f3b389 100644 --- a/Tests/NavigatorTests/EPUB/CSS/LayoutResolverTests.swift +++ b/Tests/NavigatorTests/EPUB/CSS/LayoutResolverTests.swift @@ -225,7 +225,6 @@ struct LayoutResolverTests { pageMargins: 1.0, paragraphIndent: nil, paragraphSpacing: nil, - publisherStyles: true, readingProgression: .ltr, scroll: false, spread: .auto, diff --git a/docs/Guides/Navigator/Preferences.md b/docs/Guides/Navigator/Preferences.md index 6555dadb92..bb881f069a 100644 --- a/docs/Guides/Navigator/Preferences.md +++ b/docs/Guides/Navigator/Preferences.md @@ -17,7 +17,7 @@ For instance: "font size" is a **setting**, and the application can submit the f let preferences = EPUBPreferences( fontFamily: .serif, fontSize: 2.0, - publisherStyles: false + textAlign: .justify ) // 2. Submit the preferences, the Navigator will update its settings and the presentation. @@ -38,7 +38,7 @@ let editor = epubNavigator.editor(of: preferences) // 2. Modify the preferences through the editor. editor.fontFamily.set(.serif) editor.fontSize.increment() -editor.publisherStyles.toggle() +editor.hyphens.toggle() // 3. Submit the edited preferences. epubNavigator.submitPreferences(editor.preferences) @@ -52,7 +52,7 @@ For instance, in EPUB, we can simulate two pages side by side using the `columnC ### Inactive settings -A setting may be inactive if its activation conditions are not met in a set of preferences. The Navigator will ignore inactive settings when updating its presentation. For example, with the EPUB navigator, the word spacing setting requires the publisher styles to be disabled in order to take effect. +A setting may be inactive if its activation conditions are not met in a set of preferences. The Navigator will ignore inactive settings when updating its presentation. For example, with the EPUB navigator, the word spacing setting is effective only with a left-to-right layout. You can check if a setting is effective for a set of preferences using the `PreferencesEditor`: @@ -399,7 +399,6 @@ An EPUB can also mix both kinds of resources in a single publication. In this ca | `pageMargins` | :white_check_mark: | | | `paragraphIndent` | :white_check_mark: | | | `paragraphSpacing` | :white_check_mark: | | -| `publisherStyles` | :white_check_mark: | | | `readingProgression` | :white_check_mark: | :white_check_mark: | | `scroll` | :white_check_mark: | | | `spread` | | :white_check_mark: | @@ -411,11 +410,12 @@ An EPUB can also mix both kinds of resources in a single publication. In this ca | `verticalText` | :white_check_mark: | | | `wordSpacing` | :white_check_mark: | | -#### Publisher styles +#### Unset preferences -The following advanced preferences require `publisherStyles` to be explicitly set to `false`. Make sure you convey this in your user interface. +The following preferences are effective only when explicitly set. When unset, the publisher styles are observed. -* `hyphens` +* `fontWeight` +* `hyphens` (also effective when `textAlign` is `.justify`) * `letterSpacing` * `ligatures` * `lineHeight` diff --git a/docs/Migration Guide.md b/docs/Migration Guide.md index 01466cad38..5a045c4a26 100644 --- a/docs/Migration Guide.md +++ b/docs/Migration Guide.md @@ -4,7 +4,7 @@ All migration steps necessary in reading apps to upgrade to major versions of th ## Unreleased -### Readium CSS v2 and `CSSRSProperties` +### Readium CSS v2 properties Readium CSS has been upgraded to version 2. If you configure custom Reading System properties via `CSSRSProperties`, note that `maxLineLength` is deprecated in favor of `defaultLineLength`: @@ -13,6 +13,8 @@ Readium CSS has been upgraded to version 2. If you configure custom Reading Syst +CSSRSProperties(defaultLineLength: CSSRemLength(40)) ``` +`CSSUserProperties.fontOverride`, `advancedSettings`, and `pageMargins` are also removed, as these properties don't exist in Readium CSS v2. + ### `EPUBPreferences` Column Count To support arbitrary integers natively via Readium CSS v2, `EPUBPreferences.columnCount` has been changed from a `ColumnCount` enum to an `Int`. The old `ColumnCount` enum is removed. @@ -35,6 +37,19 @@ To support precise CSS filtering of images via Readium CSS v2, `EPUBPreferences. +preferences.darkenImages = 0.8 ``` +### `EPUBPreferences` publisher styles + +Readium CSS v2 no longer requires a flag to apply the user settings, so the `publisherStyles` preference is removed from `EPUBPreferences` and associated types. + +The publisher styles are observed as long as the related preferences are unset. Preferences such as `textAlign`, `lineHeight`, or `wordSpacing` take effect as soon as they are set, so you can remove any toggle for the publisher styles from your user interface. To restore the publisher styles, reset these preferences to `nil` (e.g. with `editor.textAlign.clear()`). + +```diff + let preferences = EPUBPreferences( +- publisherStyles: false, + textAlign: .justify + ) +``` + ### Audio session changes #### Custom `AudioSessionManaging` implementations From a21946c905c77e6676247f87ef8a7e1f363f80b0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micka=C3=ABl=20Menu?= Date: Fri, 25 Sep 2026 19:17:41 +0200 Subject: [PATCH 20/21] Hide empty preference sections automatically in the TestApp --- .../Common/Preferences/UserPreferences.swift | 518 +++++++++--------- 1 file changed, 260 insertions(+), 258 deletions(-) diff --git a/TestApp/Sources/Reader/Common/Preferences/UserPreferences.swift b/TestApp/Sources/Reader/Common/Preferences/UserPreferences.swift index 4cf008965a..37688b41a2 100644 --- a/TestApp/Sources/Reader/Common/Preferences/UserPreferences.swift +++ b/TestApp/Sources/Reader/Common/Preferences/UserPreferences.swift @@ -196,29 +196,27 @@ struct UserPreferences< spread: AnyEnumPreference? = nil, visibleScrollbar: AnyPreference? = nil ) -> some View { - if language != nil || readingProgression != nil { - Section { - if let language = language { - languageRow( - title: "Language", - preference: language, - commit: commit - ) - } + NonEmptySection { + if let language = language { + languageRow( + title: "Language", + preference: language, + commit: commit + ) + } - if let readingProgression = readingProgression { - pickerRow( - title: "Reading progression", - preference: readingProgression, - commit: commit, - formatValue: { v in - switch v { - case .ltr: return "LTR" - case .rtl: return "RTL" - } + if let readingProgression = readingProgression { + pickerRow( + title: "Reading progression", + preference: readingProgression, + commit: commit, + formatValue: { v in + switch v { + case .ltr: return "LTR" + case .rtl: return "RTL" } - ) - } + } + ) } } @@ -350,282 +348,272 @@ struct UserPreferences< verticalText: AnyPreference? = nil, wordSpacing: AnyRangePreference? = nil ) -> some View { - if language != nil || readingProgression != nil || verticalText != nil || noRuby != nil { - Section { - if let language = language { - languageRow( - title: "Language", - preference: language, - commit: commit - ) - } + NonEmptySection { + if let language = language { + languageRow( + title: "Language", + preference: language, + commit: commit + ) + } - if let readingProgression = readingProgression { - pickerRow( - title: "Reading progression", - preference: readingProgression, - commit: commit, - formatValue: { v in - switch v { - case .ltr: return "LTR" - case .rtl: return "RTL" - } + if let readingProgression = readingProgression { + pickerRow( + title: "Reading progression", + preference: readingProgression, + commit: commit, + formatValue: { v in + switch v { + case .ltr: return "LTR" + case .rtl: return "RTL" } - ) - } + } + ) + } - if let verticalText = verticalText { - toggleRow( - title: "Vertical text", - preference: verticalText, - commit: commit - ) - } + if let verticalText = verticalText { + toggleRow( + title: "Vertical text", + preference: verticalText, + commit: commit + ) + } - if let noRuby = noRuby { - toggleRow( - title: "Hide ruby annotations", - preference: noRuby, - commit: commit - ) - } + if let noRuby = noRuby { + toggleRow( + title: "Hide ruby annotations", + preference: noRuby, + commit: commit + ) } } - if scroll != nil || columnCount != nil || pageMargins != nil { - Section { - if let scroll = scroll { - toggleRow( - title: "Scroll", - preference: scroll, - commit: commit - ) - } + NonEmptySection { + if let scroll = scroll { + toggleRow( + title: "Scroll", + preference: scroll, + commit: commit + ) + } - if let columnCount = columnCount { - stepperRow( - title: "Columns", - preference: columnCount, - commit: commit - ) - } + if let columnCount = columnCount { + stepperRow( + title: "Columns", + preference: columnCount, + commit: commit + ) + } - if let pageMargins = pageMargins { - stepperRow( - title: "Page margins", - preference: pageMargins, - commit: commit - ) - } + if let pageMargins = pageMargins { + stepperRow( + title: "Page margins", + preference: pageMargins, + commit: commit + ) } } - if theme != nil || blendImages != nil || darkenImages != nil || invertImages != nil || invertGaiji != nil || textColor != nil || backgroundColor != nil { - Section { - if let theme = theme { - pickerRow( - title: "Theme", - preference: theme, - commit: commit, - formatValue: { v in - switch v { - case .light: return "Light" - case .dark: return "Dark" - case .sepia: return "Sepia" - } + NonEmptySection { + if let theme = theme { + pickerRow( + title: "Theme", + preference: theme, + commit: commit, + formatValue: { v in + switch v { + case .light: return "Light" + case .dark: return "Dark" + case .sepia: return "Sepia" } - ) - } + } + ) + } - if let blendImages = blendImages { - toggleRow( - title: "Blend Images", - preference: blendImages.map(from: { $0 ?? false }, to: { $0 }).eraseToAnyPreference(), - commit: commit - ) - } + if let blendImages = blendImages { + toggleRow( + title: "Blend Images", + preference: blendImages.map(from: { $0 ?? false }, to: { $0 }).eraseToAnyPreference(), + commit: commit + ) + } - if let darkenImages = darkenImages { - stepperRow( - title: "Darken Images", - preference: darkenImages, - commit: commit - ) - } + if let darkenImages = darkenImages { + stepperRow( + title: "Darken Images", + preference: darkenImages, + commit: commit + ) + } - if let invertImages = invertImages { - toggleRow( - title: "Invert Images", - preference: invertImages, - commit: commit - ) - } + if let invertImages = invertImages { + toggleRow( + title: "Invert Images", + preference: invertImages, + commit: commit + ) + } - if let invertGaiji = invertGaiji { - toggleRow( - title: "Invert Gaiji", - preference: invertGaiji, - commit: commit - ) - } + if let invertGaiji = invertGaiji { + toggleRow( + title: "Invert Gaiji", + preference: invertGaiji, + commit: commit + ) + } - if let textColor = textColor { - colorRow( - title: "Text color", - preference: textColor, - commit: commit - ) - } + if let textColor = textColor { + colorRow( + title: "Text color", + preference: textColor, + commit: commit + ) + } - if let backgroundColor = backgroundColor { - colorRow( - title: "Background color", - preference: backgroundColor, - commit: commit - ) - } + if let backgroundColor = backgroundColor { + colorRow( + title: "Background color", + preference: backgroundColor, + commit: commit + ) } } - if fontFamily != nil || fontSize != nil || fontWeight != nil || textNormalization != nil { - Section { - if let fontFamily = fontFamily { - pickerRow( - title: "Typeface", - preference: fontFamily - .with(supportedValues: [ - nil, - .sansSerif, - .iaWriterDuospace, - .accessibleDfA, - .openDyslexic, - .literata, - ]) - .eraseToAnyPreference(), - commit: commit, - formatValue: { ff in - if let ff = ff { - switch ff { - case .sansSerif: return "Sans serif" - default: return ff.rawValue - } - } else { - return "Original" + NonEmptySection { + if let fontFamily = fontFamily { + pickerRow( + title: "Typeface", + preference: fontFamily + .with(supportedValues: [ + nil, + .sansSerif, + .iaWriterDuospace, + .accessibleDfA, + .openDyslexic, + .literata, + ]) + .eraseToAnyPreference(), + commit: commit, + formatValue: { ff in + if let ff = ff { + switch ff { + case .sansSerif: return "Sans serif" + default: return ff.rawValue } + } else { + return "Original" } - ) - } + } + ) + } - if let fontSize = fontSize { - stepperRow( - title: "Font size", - preference: fontSize, - commit: commit - ) - } + if let fontSize = fontSize { + stepperRow( + title: "Font size", + preference: fontSize, + commit: commit + ) + } - if let fontWeight = fontWeight { - stepperRow( - title: "Font weight", - preference: fontWeight, - commit: commit - ) - } + if let fontWeight = fontWeight { + stepperRow( + title: "Font weight", + preference: fontWeight, + commit: commit + ) + } - if let textNormalization = textNormalization { - toggleRow( - title: "Text normalization", - preference: textNormalization, - commit: commit - ) - } + if let textNormalization = textNormalization { + toggleRow( + title: "Text normalization", + preference: textNormalization, + commit: commit + ) } } - if textAlign != nil || typeScale != nil || lineHeight != nil || paragraphIndent != nil || paragraphSpacing != nil || wordSpacing != nil || letterSpacing != nil || hyphens != nil || ligatures != nil { - Section { - if let textAlign = textAlign { - pickerRow( - title: "Text alignment", - preference: textAlign, - commit: commit, - formatValue: { v in - switch v { - case nil: return "Default" - case .center: return "Center" - case .left: return "Left" - case .right: return "Right" - case .justify: return "Justify" - case .start: return "Start" - case .end: return "End" - } + NonEmptySection { + if let textAlign = textAlign { + pickerRow( + title: "Text alignment", + preference: textAlign, + commit: commit, + formatValue: { v in + switch v { + case nil: return "Default" + case .center: return "Center" + case .left: return "Left" + case .right: return "Right" + case .justify: return "Justify" + case .start: return "Start" + case .end: return "End" } - ) - } + } + ) + } - if let typeScale = typeScale { - stepperRow( - title: "Type scale", - preference: typeScale, - commit: commit - ) - } + if let typeScale = typeScale { + stepperRow( + title: "Type scale", + preference: typeScale, + commit: commit + ) + } - if let lineHeight = lineHeight { - stepperRow( - title: "Line height", - preference: lineHeight, - commit: commit - ) - } + if let lineHeight = lineHeight { + stepperRow( + title: "Line height", + preference: lineHeight, + commit: commit + ) + } - if let paragraphIndent = paragraphIndent { - stepperRow( - title: "Paragraph indent", - preference: paragraphIndent, - commit: commit - ) - } + if let paragraphIndent = paragraphIndent { + stepperRow( + title: "Paragraph indent", + preference: paragraphIndent, + commit: commit + ) + } - if let paragraphSpacing = paragraphSpacing { - stepperRow( - title: "Paragraph spacing", - preference: paragraphSpacing, - commit: commit - ) - } + if let paragraphSpacing = paragraphSpacing { + stepperRow( + title: "Paragraph spacing", + preference: paragraphSpacing, + commit: commit + ) + } - if let wordSpacing = wordSpacing { - stepperRow( - title: "Word spacing", - preference: wordSpacing, - commit: commit - ) - } + if let wordSpacing = wordSpacing { + stepperRow( + title: "Word spacing", + preference: wordSpacing, + commit: commit + ) + } - if let letterSpacing = letterSpacing { - stepperRow( - title: "Letter spacing", - preference: letterSpacing, - commit: commit - ) - } + if let letterSpacing = letterSpacing { + stepperRow( + title: "Letter spacing", + preference: letterSpacing, + commit: commit + ) + } - if let hyphens = hyphens { - toggleRow( - title: "Hyphens", - preference: hyphens, - commit: commit - ) - } + if let hyphens = hyphens { + toggleRow( + title: "Hyphens", + preference: hyphens, + commit: commit + ) + } - if let ligatures = ligatures { - toggleRow( - title: "Ligatures", - preference: ligatures, - commit: commit - ) - } + if let ligatures = ligatures { + toggleRow( + title: "Ligatures", + preference: ligatures, + commit: commit + ) } } } @@ -871,3 +859,17 @@ extension Preference { ) } } + +/// A `Section` which is not rendered when its content is empty, for example +/// when none of its optional preference rows are available. +struct NonEmptySection: View { + @ViewBuilder let content: Content + + var body: some View { + Group(subviews: content) { subviews in + if !subviews.isEmpty { + Section { subviews } + } + } + } +} From 90708f6277acf456a71f2b6164d2fcd1b8072a7f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micka=C3=ABl=20Menu?= Date: Fri, 25 Sep 2026 19:36:52 +0200 Subject: [PATCH 21/21] Remove the `typeScale` preference --- CHANGELOG.md | 1 + .../Navigator/EPUB/CSS/CSSProperties.swift | 15 ++++-------- Sources/Navigator/EPUB/CSS/ReadiumCSS.swift | 1 - .../EPUB/Preferences/EPUBPreferences.swift | 11 ++++----- .../Preferences/EPUBPreferencesEditor.swift | 23 ++++--------------- .../EPUB/Preferences/EPUBSettings.swift | 18 ++++++++------- .../Common/Preferences/UserPreferences.swift | 10 -------- .../EPUB/CSS/CSSUserPropertiesTests.swift | 5 ---- .../EPUB/CSS/LayoutResolverTests.swift | 1 - docs/Guides/Navigator/Preferences.md | 2 -- docs/Migration Guide.md | 2 +- 11 files changed, 27 insertions(+), 62 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 4f20f3a7ac..361b0aa17c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -34,6 +34,7 @@ All notable changes to this project will be documented in this file. Take a look * Changed `columnCount` preference in `EPUBPreferences`, `EPUBSettings`, and `EPUBDefaults` to `Int` to support arbitrary column counts. The `ColumnCount` enum is removed, [see the migration guide](docs/Migration%20Guide.md). * Replaced the `imageFilter` preference with `blendImages`, `darkenImages`, `invertImages`, and `invertGaiji`. The `ImageFilter` enum is removed, [see the migration guide](docs/Migration%20Guide.md). * Removed the `publisherStyles` preference. Readium CSS v2 applies the user settings as soon as they are set, [see the migration guide](docs/Migration%20Guide.md). + * Removed the `typeScale` preference, as the type scale user setting is no longer available in Readium CSS v2. * Removed `CSSUserProperties.fontOverride`, `advancedSettings`, and `pageMargins`, which don't exist in Readium CSS v2. ### Fixed diff --git a/Sources/Navigator/EPUB/CSS/CSSProperties.swift b/Sources/Navigator/EPUB/CSS/CSSProperties.swift index 4c508ccdf9..92b23f6198 100644 --- a/Sources/Navigator/EPUB/CSS/CSSProperties.swift +++ b/Sources/Navigator/EPUB/CSS/CSSProperties.swift @@ -92,12 +92,6 @@ public struct CSSUserProperties: CSSProperties, Sendable { /// Increasing and decreasing the root font-size. It will serve as a reference for the cascade. public var fontSize: CSSLength? - /// The type scale the user wants to use for the publication. It impacts headings, p, li, div, - /// pre, dd, small, sub, and sup. - /// - /// Recommended values: a range from 75% to 250%. Increments are left to implementers’ judgment. - public var typeScale: Double? - /// The alignment (text-align) the user prefers. It impacts body, li, and p which are not /// children of blockquote and figcaption. public var textAlign: CSSTextAlign? @@ -158,7 +152,6 @@ public struct CSSUserProperties: CSSProperties, Sendable { backgroundColor: CSSColor? = nil, fontFamily: [String]? = nil, fontSize: CSSLength? = nil, - typeScale: Double? = nil, textAlign: CSSTextAlign? = nil, lineHeight: CSSLineHeight? = nil, paraSpacing: CSSLength? = nil, @@ -183,7 +176,6 @@ public struct CSSUserProperties: CSSProperties, Sendable { self.backgroundColor = backgroundColor self.fontFamily = fontFamily self.fontSize = fontSize - self.typeScale = typeScale self.textAlign = textAlign self.lineHeight = lineHeight self.paraSpacing = paraSpacing @@ -212,6 +204,11 @@ public struct CSSUserProperties: CSSProperties, Sendable { fatalError() } + @available(*, unavailable, message: "Not available in Readium CSS v2") + public var typeScale: Double? { + fatalError() + } + public func cssProperties() -> [String: String?] { var props: [String: String?] = [:] // View mode @@ -235,8 +232,6 @@ public struct CSSUserProperties: CSSProperties, Sendable { // Typography props.putCSS(name: "--USER__fontFamily", value: fontFamily) props.putCSS(name: "--USER__fontSize", value: fontSize) - - props.putCSS(name: "--USER__typeScale", value: typeScale) props.putCSS(name: "--USER__textAlign", value: textAlign) props.putCSS(name: "--USER__lineHeight", value: lineHeight) props.putCSS(name: "--USER__paraSpacing", value: paraSpacing) diff --git a/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift b/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift index c36c758101..8b776f8370 100644 --- a/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift +++ b/Sources/Navigator/EPUB/CSS/ReadiumCSS.swift @@ -99,7 +99,6 @@ extension ReadiumCSS { backgroundColor: settings.backgroundColor.map { CSSIntColor($0.rawValue) }, fontFamily: settings.fontFamily.map(resolveFontStack), fontSize: CSSPercentLength(settings.fontSize), - typeScale: settings.typeScale, textAlign: { switch settings.textAlign { case .justify: return .justify diff --git a/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift b/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift index 515eb80927..fb802d09bb 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBPreferences.swift @@ -107,9 +107,6 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { /// Reader theme. public var theme: Theme? - /// Scale applied to all element font sizes. - public var typeScale: Double? - /// Indicates whether the text should be laid out vertically. /// /// This is used for example with CJK languages. This setting is @@ -148,7 +145,6 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { textColor: Color? = nil, textNormalization: Bool? = nil, theme: Theme? = nil, - typeScale: Double? = nil, verticalText: Bool? = nil, wordSpacing: Double? = nil ) { @@ -180,7 +176,6 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { self.textColor = textColor self.textNormalization = textNormalization self.theme = theme - self.typeScale = typeScale.map { max($0, 0) } self.verticalText = verticalText self.wordSpacing = wordSpacing.map { max($0, 0) } } @@ -215,7 +210,6 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { textColor: other.textColor ?? textColor, textNormalization: other.textNormalization ?? textNormalization, theme: other.theme ?? theme, - typeScale: other.typeScale ?? typeScale, verticalText: other.verticalText ?? verticalText, wordSpacing: other.wordSpacing ?? wordSpacing ) @@ -226,6 +220,11 @@ public struct EPUBPreferences: ConfigurablePreferences, Sendable { fatalError() } + @available(*, unavailable, message: "Not available in Readium CSS v2") + public var typeScale: Double? { + fatalError() + } + /// Returns a new `EPUBPreferences` with the publication-specific preferences /// removed. public func filterSharedPreferences() -> EPUBPreferences { diff --git a/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift b/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift index 1dee2f030b..39c21f18f7 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBPreferencesEditor.swift @@ -404,6 +404,11 @@ public final class EPUBPreferencesEditor: StatefulPreferencesEditor { + fatalError() + } + /// Direction of the reading progression across resources. /// /// This can be changed to influence directly the layout (e.g. LTR or RTL). @@ -501,24 +506,6 @@ public final class EPUBPreferencesEditor: StatefulPreferencesEditor = - rangePreference( - preference: \.typeScale, - effectiveValue: { $0.settings.typeScale }, - defaultEffectiveValue: defaults.typeScale ?? 1.2, - isEffective: { [layouts] in - layouts.contains(.reflowable) - && $0.preferences.typeScale != nil - }, - supportedRange: 1.0 ... 2.0, - progressionStrategy: .steps(1.0, 1.067, 1.125, 1.2, 1.25, 1.333, 1.414, 1.5, 1.618), - format: { $0.formatDecimal(maximumFractionDigits: 5) } - ) - /// Indicates whether the text should be laid out vertically. This is used /// for example with CJK languages. This setting is automatically derived /// from the language if no preference is given. diff --git a/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift b/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift index 4b69326d40..561b54a781 100644 --- a/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift +++ b/Sources/Navigator/EPUB/Preferences/EPUBSettings.swift @@ -41,7 +41,6 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { public var textColor: Color? public var textNormalization: Bool public var theme: Theme - public var typeScale: Double? public var verticalText: Bool public var wordSpacing: Double? @@ -54,6 +53,11 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { fatalError() } + @available(*, unavailable, message: "Not available in Readium CSS v2") + public var typeScale: Double? { + fatalError() + } + let cssLayout: CSSLayout public init( @@ -85,7 +89,6 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { textColor: Color?, textNormalization: Bool, theme: Theme, - typeScale: Double?, verticalText: Bool, wordSpacing: Double? ) { @@ -117,7 +120,6 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { self.textColor = textColor self.textNormalization = textNormalization self.theme = theme - self.typeScale = typeScale self.verticalText = verticalText self.wordSpacing = wordSpacing cssLayout = CSSLayout(verticalText: verticalText, language: language, readingProgression: readingProgression) @@ -181,7 +183,6 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { let textAlign = preferences.textAlign ?? defaults.textAlign let textNormalization = preferences.textNormalization ?? defaults.textNormalization ?? false let theme = preferences.theme ?? .light - let typeScale = preferences.typeScale ?? defaults.typeScale let wordSpacing = preferences.wordSpacing ?? defaults.wordSpacing self.init( @@ -213,7 +214,6 @@ public struct EPUBSettings: ConfigurableSettings, Sendable { textColor: preferences.textColor, textNormalization: textNormalization, theme: theme, - typeScale: typeScale, verticalText: verticalText, wordSpacing: wordSpacing ) @@ -251,7 +251,6 @@ public struct EPUBDefaults: Sendable { public var spread: Spread? public var textAlign: TextAlignment? public var textNormalization: Bool? - public var typeScale: Double? public var wordSpacing: Double? public init( @@ -279,7 +278,6 @@ public struct EPUBDefaults: Sendable { spread: Spread? = nil, textAlign: TextAlignment? = nil, textNormalization: Bool? = nil, - typeScale: Double? = nil, wordSpacing: Double? = nil ) { self.columnCount = columnCount @@ -306,7 +304,6 @@ public struct EPUBDefaults: Sendable { self.spread = spread self.textAlign = textAlign self.textNormalization = textNormalization - self.typeScale = typeScale self.wordSpacing = wordSpacing } @@ -314,6 +311,11 @@ public struct EPUBDefaults: Sendable { public var publisherStyles: Bool? { fatalError() } + + @available(*, unavailable, message: "Not available in Readium CSS v2") + public var typeScale: Double? { + fatalError() + } } private extension Language { diff --git a/TestApp/Sources/Reader/Common/Preferences/UserPreferences.swift b/TestApp/Sources/Reader/Common/Preferences/UserPreferences.swift index 37688b41a2..7dfd921677 100644 --- a/TestApp/Sources/Reader/Common/Preferences/UserPreferences.swift +++ b/TestApp/Sources/Reader/Common/Preferences/UserPreferences.swift @@ -128,7 +128,6 @@ struct UserPreferences< textColor: editor.textColor, textNormalization: editor.textNormalization, theme: editor.theme, - typeScale: editor.typeScale, verticalText: editor.verticalText, wordSpacing: editor.wordSpacing ) @@ -344,7 +343,6 @@ struct UserPreferences< textColor: AnyPreference? = nil, textNormalization: AnyPreference? = nil, theme: AnyEnumPreference? = nil, - typeScale: AnyRangePreference? = nil, verticalText: AnyPreference? = nil, wordSpacing: AnyRangePreference? = nil ) -> some View { @@ -552,14 +550,6 @@ struct UserPreferences< ) } - if let typeScale = typeScale { - stepperRow( - title: "Type scale", - preference: typeScale, - commit: commit - ) - } - if let lineHeight = lineHeight { stepperRow( title: "Line height", diff --git a/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift b/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift index 5b3e73fb9d..d092f5800b 100644 --- a/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift +++ b/Tests/NavigatorTests/EPUB/CSS/CSSUserPropertiesTests.swift @@ -24,7 +24,6 @@ struct CSSUserPropertiesTests { "--USER__backgroundColor": nil, "--USER__fontFamily": nil, "--USER__fontSize": nil, - "--USER__typeScale": nil, "--USER__textAlign": nil, "--USER__lineHeight": nil, "--USER__paraSpacing": nil, @@ -54,7 +53,6 @@ struct CSSUserPropertiesTests { backgroundColor: CSSHexColor("#00FF00"), fontFamily: ["Times New"], fontSize: CSSVMaxLength(2.3), - typeScale: 3.4, textAlign: .justify, lineHeight: .length(CSSPtLength(4.5)), paraSpacing: CSSPtLength(5.6), @@ -78,7 +76,6 @@ struct CSSUserPropertiesTests { "--USER__backgroundColor": "#00FF00", "--USER__fontFamily": "\"Times New\"", "--USER__fontSize": "2.30000vmax", - "--USER__typeScale": "3.40000", "--USER__textAlign": "justify", "--USER__lineHeight": "4.50000pt", "--USER__paraSpacing": "5.60000pt", @@ -138,7 +135,6 @@ struct CSSUserPropertiesTests { backgroundColor: CSSHexColor("#00FF00"), fontFamily: ["Times New", "Comic Sans"], fontSize: CSSVMaxLength(2.3), - typeScale: 3.4, textAlign: .justify, lineHeight: .length(CSSPtLength(4.5)), paraSpacing: CSSPtLength(5.6), @@ -170,7 +166,6 @@ struct CSSUserPropertiesTests { --USER__paraSpacing: 5.60000pt !important; --USER__textAlign: justify !important; --USER__textColor: #FF0000 !important; - --USER__typeScale: 3.40000 !important; --USER__view: readium-scroll-on !important; --USER__wordSpacing: 7.80000rem !important; diff --git a/Tests/NavigatorTests/EPUB/CSS/LayoutResolverTests.swift b/Tests/NavigatorTests/EPUB/CSS/LayoutResolverTests.swift index e131f3b389..8c89c712f1 100644 --- a/Tests/NavigatorTests/EPUB/CSS/LayoutResolverTests.swift +++ b/Tests/NavigatorTests/EPUB/CSS/LayoutResolverTests.swift @@ -232,7 +232,6 @@ struct LayoutResolverTests { textColor: nil, textNormalization: false, theme: .light, - typeScale: nil, verticalText: false, wordSpacing: nil ) diff --git a/docs/Guides/Navigator/Preferences.md b/docs/Guides/Navigator/Preferences.md index bb881f069a..9b4da31e0a 100644 --- a/docs/Guides/Navigator/Preferences.md +++ b/docs/Guides/Navigator/Preferences.md @@ -406,7 +406,6 @@ An EPUB can also mix both kinds of resources in a single publication. In this ca | `textColor` | :white_check_mark: | | | `textNormalization` | :white_check_mark: | | | `theme` | :white_check_mark: | | -| `typeScale` | :white_check_mark: | | | `verticalText` | :white_check_mark: | | | `wordSpacing` | :white_check_mark: | | @@ -422,7 +421,6 @@ The following preferences are effective only when explicitly set. When unset, th * `paragraphIndent` * `paragraphSpacing` * `textAlign` -* `typeScale` * `wordSpacing` #### Scroll vs paginated diff --git a/docs/Migration Guide.md b/docs/Migration Guide.md index 5a045c4a26..abf6a69a69 100644 --- a/docs/Migration Guide.md +++ b/docs/Migration Guide.md @@ -13,7 +13,7 @@ Readium CSS has been upgraded to version 2. If you configure custom Reading Syst +CSSRSProperties(defaultLineLength: CSSRemLength(40)) ``` -`CSSUserProperties.fontOverride`, `advancedSettings`, and `pageMargins` are also removed, as these properties don't exist in Readium CSS v2. +`CSSUserProperties.fontOverride`, `advancedSettings`, `pageMargins`, and `typeScale` are also removed, as these properties don't exist in Readium CSS v2. ### `EPUBPreferences` Column Count