From 002da9fba8800b796ed98dd83e2ab68b4d37a1cc Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Sun, 27 Jun 2021 17:57:00 -0400 Subject: Structured content style json (#1771) * Install css * Remove unnecessary rule * Create CSS overrides file * Create script to generate CSS JSON file * Generate JSON * Add test --- ext/data/structured-content-style.json | 330 +++++++++++++++++++++++++++++++++ 1 file changed, 330 insertions(+) create mode 100644 ext/data/structured-content-style.json (limited to 'ext/data/structured-content-style.json') diff --git a/ext/data/structured-content-style.json b/ext/data/structured-content-style.json new file mode 100644 index 00000000..80a71e1c --- /dev/null +++ b/ext/data/structured-content-style.json @@ -0,0 +1,330 @@ +[ + { + "selectors": [".gloss-image-container"], + "styles": [ + ["display", "inline-block"], + ["white-space", "nowrap"], + ["max-width", "100%"], + ["position", "relative"], + ["vertical-align", "top"], + ["line-height", "0"], + ["overflow", "hidden"], + ["font-size", "1px"] + ] + }, + { + "selectors": [".gloss-image-link"], + "styles": [ + ["cursor", "inherit"], + ["color", "inherit"], + ["display", "inline-block"], + ["position", "relative"], + ["line-height", "1"] + ] + }, + { + "selectors": [".gloss-image-link[href]:hover"], + "styles": [ + ["cursor", "pointer"] + ] + }, + { + "selectors": [".gloss-image-container-overlay"], + "styles": [ + ["position", "absolute"], + ["left", "0"], + ["top", "0"], + ["width", "100%"], + ["height", "100%"], + ["display", "table"], + ["table-layout", "fixed"], + ["white-space", "normal"], + ["font-size", "initial"], + ["line-height", "initial"], + ["color", "initial"] + ] + }, + { + "selectors": [".gloss-image-link[data-has-image=true][data-image-load-state=load-error] .gloss-image-container-overlay::after"], + "styles": [ + ["content", "'Image failed to load'"], + ["display", "table-cell"], + ["width", "100%"], + ["height", "100%"], + ["vertical-align", "middle"], + ["text-align", "center"], + ["padding", "0.25em"] + ] + }, + { + "selectors": [".gloss-image-background"], + "styles": [ + ["--image", "none"], + ["position", "absolute"], + ["left", "0"], + ["top", "0"], + ["width", "100%"], + ["height", "100%"], + ["-webkit-mask-repeat", "no-repeat"], + ["-webkit-mask-position", "center center"], + ["-webkit-mask-mode", "alpha"], + ["-webkit-mask-size", "contain"], + ["-webkit-mask-image", "var(--image)"], + ["mask-repeat", "no-repeat"], + ["mask-position", "center center"], + ["mask-mode", "alpha"], + ["mask-size", "contain"], + ["mask-image", "var(--image)"], + ["background-color", "currentColor"] + ] + }, + { + "selectors": [".gloss-image"], + "styles": [ + ["display", "inline-block"], + ["vertical-align", "top"], + ["object-fit", "contain"], + ["border", "none"], + ["outline", "none"] + ] + }, + { + "selectors": [".gloss-image-link[data-has-aspect-ratio=true] .gloss-image"], + "styles": [ + ["position", "absolute"], + ["left", "0"], + ["top", "0"], + ["width", "100%"], + ["height", "100%"] + ] + }, + { + "selectors": [".gloss-image:not([src])"], + "styles": [ + ["display", "none"] + ] + }, + { + "selectors": [ + ".gloss-image-link[data-image-rendering=pixelated] .gloss-image", + ".gloss-image-link[data-image-rendering=pixelated] .gloss-image-background" + ], + "styles": [ + ["image-rendering", "auto"], + ["image-rendering", "-moz-crisp-edges"], + ["image-rendering", "-webkit-optimize-contrast"], + ["image-rendering", "pixelated"], + ["image-rendering", "crisp-edges"] + ] + }, + { + "selectors": [ + ".gloss-image-link[data-image-rendering=crisp-edges] .gloss-image", + ".gloss-image-link[data-image-rendering=crisp-edges] .gloss-image-background" + ], + "styles": [ + ["image-rendering", "auto"], + ["image-rendering", "-moz-crisp-edges"], + ["image-rendering", "-webkit-optimize-contrast"], + ["image-rendering", "crisp-edges"] + ] + }, + { + "selectors": [".gloss-image-link[data-has-aspect-ratio=true] .gloss-image-aspect-ratio-sizer"], + "styles": [ + ["display", "inline-block"], + ["width", "0"], + ["vertical-align", "top"], + ["font-size", "0"] + ] + }, + { + "selectors": [".gloss-image-link-text"], + "styles": [ + ["display", "none"], + ["line-height", "initial"] + ] + }, + { + "selectors": [".gloss-image-link-text::before"], + "styles": [ + ["content", "'['"] + ] + }, + { + "selectors": [".gloss-image-link-text::after"], + "styles": [ + ["content", "']'"] + ] + }, + { + "selectors": [".gloss-image-description"], + "styles": [ + ["display", "block"], + ["white-space", "pre-line"] + ] + }, + { + "selectors": [".gloss-image-link[data-appearance=monochrome] .gloss-image"], + "styles": [ + ["visibility", "hidden"] + ] + }, + { + "selectors": [".gloss-image-link:not([data-appearance=monochrome]) .gloss-image-background"], + "styles": [ + ["display", "none"] + ] + }, + { + "selectors": [".gloss-image-link[data-size-units=em] .gloss-image-container"], + "styles": [ + ["font-size", "1em"] + ] + }, + { + "selectors": [".gloss-image-link[data-vertical-align=baseline]"], + "styles": [ + ["vertical-align", "baseline"] + ] + }, + { + "selectors": [".gloss-image-link[data-vertical-align=sub]"], + "styles": [ + ["vertical-align", "sub"] + ] + }, + { + "selectors": [".gloss-image-link[data-vertical-align=super]"], + "styles": [ + ["vertical-align", "super"] + ] + }, + { + "selectors": [".gloss-image-link[data-vertical-align=text-top]"], + "styles": [ + ["vertical-align", "top"] + ] + }, + { + "selectors": [".gloss-image-link[data-vertical-align=text-bottom]"], + "styles": [ + ["vertical-align", "bottom"] + ] + }, + { + "selectors": [".gloss-image-link[data-vertical-align=middle]"], + "styles": [ + ["vertical-align", "middle"] + ] + }, + { + "selectors": [".gloss-image-link[data-vertical-align=top]"], + "styles": [ + ["vertical-align", "top"] + ] + }, + { + "selectors": [".gloss-image-link[data-vertical-align=bottom]"], + "styles": [ + ["vertical-align", "bottom"] + ] + }, + { + "selectors": [ + ".gloss-image-link[data-collapsed=true]", + ":root[data-glossary-layout-mode=compact] .gloss-image-link[data-collapsible=true]" + ], + "styles": [ + ["vertical-align", "baseline"] + ] + }, + { + "selectors": [ + ".gloss-image-link[data-collapsed=true] .gloss-image-container", + ":root[data-glossary-layout-mode=compact] .gloss-image-link[data-collapsible=true] .gloss-image-container" + ], + "styles": [ + ["display", "none"], + ["position", "absolute"], + ["left", "0"], + ["top", "100%"], + ["z-index", "1"] + ] + }, + { + "selectors": [ + ".entry:nth-last-of-type(1):not(:nth-of-type(1)) .gloss-image-link[data-collapsed=true] .gloss-image-container", + ":root[data-glossary-layout-mode=compact] .entry:nth-last-of-type(1):not(:nth-of-type(1)) .gloss-image-link[data-collapsible=true] .gloss-image-container" + ], + "styles": [ + ["bottom", "100%"], + ["top", "auto"] + ] + }, + { + "selectors": [ + ".gloss-image-link[data-collapsed=true]:hover .gloss-image-container", + ".gloss-image-link[data-collapsed=true]:focus .gloss-image-container", + ":root[data-glossary-layout-mode=compact] .gloss-image-link[data-collapsible=true]:hover .gloss-image-container", + ":root[data-glossary-layout-mode=compact] .gloss-image-link[data-collapsible=true]:focus .gloss-image-container" + ], + "styles": [ + ["display", "block"] + ] + }, + { + "selectors": [ + ".gloss-image-link[data-collapsed=true] .gloss-image-link-text", + ":root[data-glossary-layout-mode=compact] .gloss-image-link[data-collapsible=true] .gloss-image-link-text" + ], + "styles": [ + ["display", "inline"] + ] + }, + { + "selectors": [ + ".gloss-image-link[data-collapsed=true]~.gloss-image-description", + ":root[data-glossary-layout-mode=compact] .gloss-image-description" + ], + "styles": [ + ["display", "inline"] + ] + }, + { + "selectors": [".gloss-sc-table-container"], + "styles": [ + ["display", "block"] + ] + }, + { + "selectors": [".gloss-sc-table"], + "styles": [ + ["table-layout", "auto"], + ["border-collapse", "collapse"] + ] + }, + { + "selectors": [ + ".gloss-sc-thead", + ".gloss-sc-tfoot", + ".gloss-sc-th" + ], + "styles": [ + ["font-weight", "bold"] + ] + }, + { + "selectors": [ + ".gloss-sc-th", + ".gloss-sc-td" + ], + "styles": [ + ["border-style", "solid"], + ["padding", "0.25em"], + ["vertical-align", "top"], + ["border-width", "1px"], + ["border-color", "currentColor"] + ] + } +] \ No newline at end of file -- cgit v1.2.3