diff --git a/src/_layouts/base.njk b/src/_layouts/base.njk index cccdcd6..95deb11 100644 --- a/src/_layouts/base.njk +++ b/src/_layouts/base.njk @@ -4,8 +4,8 @@ {% block title %}Accessibility Audit for {{ title }}{% endblock %} - - + + {% block meta %}{% endblock %} diff --git a/src/assets/styles/print.css b/src/assets/styles/print.css index c1d01a0..2b34232 100644 --- a/src/assets/styles/print.css +++ b/src/assets/styles/print.css @@ -1,3 +1,50 @@ +/* stylelint-disable at-rule-property-required-list */ + +@font-face { + font-family: 'Noto Sans Mono'; + font-style: normal; + font-weight: normal; + src: + url('../fonts/noto-sans-mono-v30-latin-regular.woff2') format('woff2'), + url('../fonts/noto-sans-mono-v30-latin-regular.ttf') format('truetype'); +} + +@font-face { + font-family: 'Noto Serif'; + font-style: normal; + font-weight: normal; + src: + url('../fonts/noto-serif-v23-latin-regular.woff2') format('woff2'), + url('../fonts/noto-serif-v23-latin-regular.ttf') format('truetype'); +} + +@font-face { + font-family: 'Noto Serif'; + font-style: italic; + font-weight: normal; + src: + url('../fonts/noto-serif-v23-latin-italic.woff2') format('woff2'), + url('../fonts/noto-serif-v23-latin-italic.ttf') format('truetype'); +} + +@font-face { + font-family: 'Noto Serif'; + font-style: normal; + font-weight: bold; + src: + url('../fonts/noto-serif-v23-latin-700.woff2') format('woff2'), + url('../fonts/noto-serif-v23-latin-700.ttf') format('truetype'); +} + +@font-face { + font-family: 'Noto Serif'; + font-style: italic; + font-weight: bold; + src: + url('../fonts/noto-serif-v23-latin-700italic.woff2') format('woff2'), + url('../fonts/noto-serif-v23-latin-700italic.ttf') format('truetype'); +} + body { font-size: 10pt; } @@ -21,10 +68,11 @@ body { max-height: 5cm; } -.wcag-link { +a.wcag-link, +a.wcag-link:visited { text-decoration: underline; background-color: transparent; - color: #00e; + color: #191970; padding: 0; font-size: inherit; border-radius: 0; @@ -37,3 +85,112 @@ body { content: 'Page ' counter(page) ' of ' counter(pages); } } + +/** + * a11y-dark theme for JavaScript, CSS, and HTML + * Based on the okaidia theme: https://github.com/PrismJS/prism/blob/gh-pages/themes/prism-okaidia.css + * @author ericwbailey + */ + +code[class*='language-'], +pre[class*='language-'] { + color: #f8f8f2; + background: none; + font-family: 'Noto Sans Mono', monospace; + text-align: left; + white-space: pre; + word-spacing: normal; + word-break: normal; + word-wrap: normal; + line-height: 1.5; + tab-size: 4; + hyphens: none; +} + +pre[class*='language-'] { + padding: 1em; + margin: 0.5em 0; + overflow: auto; + border-radius: 0.3em; +} + +:not(pre) > code[class*='language-'], +pre[class*='language-'] { + background: #2b2b2b; +} + +:not(pre) > code[class*='language-'] { + padding: 0.1em; + border-radius: 0.3em; + white-space: normal; +} + +.token.comment, +.token.prolog, +.token.doctype, +.token.cdata { + color: #d4d0ab; +} + +.token.punctuation { + color: #fefefe; +} + +.token.property, +.token.tag, +.token.constant, +.token.symbol, +.token.deleted { + color: #ffa07a; +} + +.token.boolean, +.token.number { + color: #00e0e0; +} + +.token.selector, +.token.attr-name, +.token.string, +.token.char, +.token.builtin, +.token.inserted { + color: #abe338; +} + +.token.operator, +.token.entity, +.token.url, +.language-css .token.string, +.style .token.string, +.token.variable { + color: #00e0e0; +} + +.token.atrule, +.token.attr-value, +.token.function { + color: #ffd700; +} + +.token.keyword { + color: #00e0e0; +} + +.token.regex, +.token.important { + color: #ffd700; +} + +.token.important, +.token.bold { + font-weight: bold; +} + +.token.italic { + font-style: italic; +} + +.token.entity { + cursor: help; +} diff --git a/src/assets/styles/report.css b/src/assets/styles/report.css index 788c690..8f8c0d3 100644 --- a/src/assets/styles/report.css +++ b/src/assets/styles/report.css @@ -1,53 +1,3 @@ -@font-face { - font-display: swap; - font-family: 'Noto Sans Mono'; - font-style: normal; - font-weight: normal; - src: - url('../fonts/noto-sans-mono-v30-latin-regular.woff2') format('woff2'), - url('../fonts/noto-sans-mono-v30-latin-regular.ttf') format('truetype'); -} - -@font-face { - font-display: swap; - font-family: 'Noto Serif'; - font-style: normal; - font-weight: normal; - src: - url('../fonts/noto-serif-v23-latin-regular.woff2') format('woff2'), - url('../fonts/noto-serif-v23-latin-regular.ttf') format('truetype'); -} - -@font-face { - font-display: swap; - font-family: 'Noto Serif'; - font-style: italic; - font-weight: normal; - src: - url('../fonts/noto-serif-v23-latin-italic.woff2') format('woff2'), - url('../fonts/noto-serif-v23-latin-italic.ttf') format('truetype'); -} - -@font-face { - font-display: swap; - font-family: 'Noto Serif'; - font-style: normal; - font-weight: bold; - src: - url('../fonts/noto-serif-v23-latin-700.woff2') format('woff2'), - url('../fonts/noto-serif-v23-latin-700.ttf') format('truetype'); -} - -@font-face { - font-display: swap; - font-family: 'Noto Serif'; - font-style: italic; - font-weight: bold; - src: - url('../fonts/noto-serif-v23-latin-700italic.woff2') format('woff2'), - url('../fonts/noto-serif-v23-latin-700italic.ttf') format('truetype'); -} - * { box-sizing: border-box; } diff --git a/src/assets/styles/screen.css b/src/assets/styles/screen.css index 65d96d5..441e75b 100644 --- a/src/assets/styles/screen.css +++ b/src/assets/styles/screen.css @@ -1,3 +1,53 @@ +@font-face { + font-display: swap; + font-family: 'Noto Sans Mono'; + font-style: normal; + font-weight: normal; + src: + url('../fonts/noto-sans-mono-v30-latin-regular.woff2') format('woff2'), + url('../fonts/noto-sans-mono-v30-latin-regular.ttf') format('truetype'); +} + +@font-face { + font-display: swap; + font-family: 'Noto Serif'; + font-style: normal; + font-weight: normal; + src: + url('../fonts/noto-serif-v23-latin-regular.woff2') format('woff2'), + url('../fonts/noto-serif-v23-latin-regular.ttf') format('truetype'); +} + +@font-face { + font-display: swap; + font-family: 'Noto Serif'; + font-style: italic; + font-weight: normal; + src: + url('../fonts/noto-serif-v23-latin-italic.woff2') format('woff2'), + url('../fonts/noto-serif-v23-latin-italic.ttf') format('truetype'); +} + +@font-face { + font-display: swap; + font-family: 'Noto Serif'; + font-style: normal; + font-weight: bold; + src: + url('../fonts/noto-serif-v23-latin-700.woff2') format('woff2'), + url('../fonts/noto-serif-v23-latin-700.ttf') format('truetype'); +} + +@font-face { + font-display: swap; + font-family: 'Noto Serif'; + font-style: italic; + font-weight: bold; + src: + url('../fonts/noto-serif-v23-latin-700italic.woff2') format('woff2'), + url('../fonts/noto-serif-v23-latin-700italic.ttf') format('truetype'); +} + @media (width < 48em) { .issue header { align-items: flex-start;