From 6a74746113c724e750620d10b58ad6bac94060c9 Mon Sep 17 00:00:00 2001 From: Stephen Kraus <8003332+stephenmk@users.noreply.github.com> Date: Sat, 14 May 2022 08:59:38 -0500 Subject: Add new structured content features: lists and the HTML `lang` attribute (#2129) * Add support for structured content lists and `list-style-type` style A full list of supported style types is documented here: https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type There's nothing in this code preventing a term bank from assigning, for example, a `list-style-type` style to a `div` element, but it doesn't seem like browsers will complain about things like that. * Add support for `lang` attribute in structured content Support added for the following node types: "ruby", "rt", "rp", "table", "thead", "tbody", "tfoot", "tr", "td", "th", "span", "div", "ol", "ul", "li", "a" I couldn't get it to work for the alt-hover text on "img" tags. Tests are included in the file "test/data/dictionaries/valid-dictionary/term_bank_1.json" * Add styles for structured content lists * Add override rules for new structured-content list styles see: https://github.com/FooSoft/yomichan/pull/2129 Co-authored-by: stephenmk --- ext/css/structured-content.css | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) (limited to 'ext/css') diff --git a/ext/css/structured-content.css b/ext/css/structured-content.css index 485527e5..5e863318 100644 --- a/ext/css/structured-content.css +++ b/ext/css/structured-content.css @@ -235,3 +235,21 @@ padding: 0.25em; vertical-align: top; } +.gloss-sc-ol, +.gloss-sc-ul { + padding-left: var(--list-padding2); +} +:root[data-glossary-layout-mode=compact] .gloss-sc-ul[data-sc-content=glossary] { + display: inline; + list-style: none; + padding-left: 0; +} +:root[data-glossary-layout-mode=compact] .gloss-sc-ul[data-sc-content=glossary] .gloss-sc-li { + display: inline; +} +:root[data-glossary-layout-mode=compact] .gloss-sc-ul[data-sc-content=glossary] .gloss-sc-li:not(:first-child)::before { + white-space: pre-wrap; + content: var(--compact-list-separator); + display: inline; + color: var(--text-color-light3); +} -- cgit v1.2.3