From 3c914b4dd1611364f97920807a19345ea90618bf Mon Sep 17 00:00:00 2001 From: Rohan Kumar Date: Mon, 6 Jun 2022 21:42:32 -0700 Subject: [PATCH] Support multiple
that share a
- Make sure their tap targets do not overlap - Use a regex to detect them in markup using an "OR" keyword - Implement them in one article. --- assets/css/main.css | 7 +++++++ content/posts/website-best-practices.md | 2 +- layouts/partials/processed-content.html | 9 ++++++++- 3 files changed, 16 insertions(+), 2 deletions(-) diff --git a/assets/css/main.css b/assets/css/main.css index a07871e..90cb1cc 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -120,6 +120,7 @@ html { li > a { padding: .75em .25em; } + /* Compensate for misalignment and wasted space caused by padding * and margin adjustments in nav children made to meet SC 2.5.5 * Also prevent overlapping outlines on focus */ @@ -153,6 +154,11 @@ html { display: inline-block; } + /* Multiple consecutive
that share a
shouldn't have tap targets overlap */ + dt + dt > a { + padding-top: 0; + } + nav li, ol li > a { margin: .25em; @@ -247,6 +253,7 @@ h1 { * try to maintain good perceptual contrast even for small text, but * I don't want toggling the theme to impact anything besides color so * I set the weight here. */ +dt, kbd { font-weight: bold; } diff --git a/content/posts/website-best-practices.md b/content/posts/website-best-practices.md index 7b21218..19a042a 100644 --- a/content/posts/website-best-practices.md +++ b/content/posts/website-best-practices.md @@ -1408,7 +1408,7 @@ These are the tools I use regularly. I've deliberately excluded tools that would [Chrom­ium's CSS Overview](https://developer.chrome.com/docs/devtools/css-overview/) : can show some basic accessibility violations, including contrast violations. I recommend enabling the APCA-based contrast algorithm in the DevTools experimental settings first. Note that this uses an earlier version of APCA and does not account for contrast that is too high. -[testssl.sh (cli)](https://testssl.sh/) or [SSL Labs' SSL Server Test (web, proprietary)](https://www.ssllabs.com/ssltest/) +[testssl.sh (cli)](https://testssl.sh/) OR [SSL Labs' SSL Server Test (web, proprietary)](https://www.ssllabs.com/ssltest/) : basically equivalent tools for auditing your TLS setup. I prefer testssl.sh. [Webbkoll](https://webbkoll.dataskydd.net/) diff --git a/layouts/partials/processed-content.html b/layouts/partials/processed-content.html index 3f4b16a..cf44009 100644 --- a/layouts/partials/processed-content.html +++ b/layouts/partials/processed-content.html @@ -24,6 +24,13 @@ ` -}} + +{{- $combinedTerm := `
(.*) OR (.*)
` -}} +{{- $splitTerm := `
$1
$2
` -}} +