chore(deps): update sanitize.css to v13

- Closes !28

themes/chameleon/package.json

@@ -9,7 +9,7 @@
     "autoprefixer": "^10.0.0",
     "postcss": "^8.0.6",
     "postcss-normalize": "^10.0.0",
-    "sanitize.css": "^12.0.0"
+    "sanitize.css": "^13.0.0"
   },
   "engines": {
     "node": ">= 12.13.0"

themes/chameleon/source/css/chameleon.css

@@ -2,12 +2,13 @@
 /* Document
  * ========================================================================== */
 /**
- * Add border box sizing in all browsers (opinionated).
+ * 1. Add border box sizing in all browsers (opinionated).
+ * 2. Backgrounds do not repeat by default (opinionated).
  */
 *,
 ::before,
 ::after {
-  box-sizing: border-box;
+  box-sizing: border-box; /* 1 */
 }
 /**
  * 1. Add text decoration inheritance in all browsers (opinionated).
@@ -21,107 +22,83 @@
 /**
  * 1. Use the default cursor in all browsers (opinionated).
  * 2. Change the line height in all browsers (opinionated).
- * 3. Use a 4-space tab width in all browsers (opinionated).
+ * 3. Breaks words to prevent overflow in all browsers (opinionated).
- * 4. Remove the grey highlight on links in iOS (opinionated).
+ * 4. Use a 4-space tab width in all browsers (opinionated).
- * 5. Prevent adjustments of font size after orientation changes in
+ * 5. Remove the grey highlight on links in iOS (opinionated).
- *    IE on Windows Phone and in iOS.
+ * 6. Prevent adjustments of font size after orientation changes in iOS.
- * 6. Breaks words to prevent overflow in all browsers (opinionated).
  */
-html {
+:where(:root) {
   cursor: default; /* 1 */
   line-height: 1.5; /* 2 */
-  -moz-tab-size: 4; /* 3 */
+  overflow-wrap: break-word; /* 3 */
+  -moz-tab-size: 4; /* 4 */
   -o-tab-size: 4;
-     tab-size: 4; /* 3 */
+     tab-size: 4; /* 4 */
-  -webkit-tap-highlight-color: transparent /* 4 */;
+  -webkit-tap-highlight-color: transparent; /* 5 */
-  -ms-text-size-adjust: 100%; /* 5 */
+  -webkit-text-size-adjust: 100%; /* 6 */
-  -webkit-text-size-adjust: 100%; /* 5 */
-  word-break: break-word; /* 6 */
 }
 /* Sections
  * ========================================================================== */
 /**
  * Remove the margin in all browsers (opinionated).
  */
-body {
+:where(body) {
   margin: 0;
 }
 /**
  * Correct the font size and margin on `h1` elements within `section` and
  * `article` contexts in Chrome, Edge, Firefox, and Safari.
  */
-h1 {
+:where(h1) {
   font-size: 2em;
   margin: 0.67em 0;
 }
 /* Grouping content
  * ========================================================================== */
 /**
- * Remove the margin on nested lists in Chrome, Edge, IE, and Safari.
+ * Remove the margin on nested lists in Chrome, Edge, and Safari.
  */
-dl dl,
+:where(dl, ol, ul) :where(dl, ol, ul) {
-dl ol,
-dl ul,
-ol dl,
-ul dl {
-  margin: 0;
-}
-/**
- * Remove the margin on nested lists in Edge 18- and IE.
- */
-ol ol,
-ol ul,
-ul ol,
-ul ul {
   margin: 0;
 }
 /**
  * 1. Correct the inheritance of border color in Firefox.
  * 2. Add the correct box sizing in Firefox.
- * 3. Show the overflow in Edge 18- and IE.
  */
-hr {
+:where(hr) {
   color: inherit; /* 1 */
   height: 0; /* 2 */
-  overflow: visible; /* 3 */
-}
-/**
- * Add the correct display in IE.
- */
-main {
-  display: block;
 }
 /**
  * Remove the list style on navigation lists in all browsers (opinionated).
  */
-nav ol,
+:where(nav) :where(ol, ul) {
-nav ul {
+  list-style-type: none;
-  list-style: none;
   padding: 0;
 }
 /**
  * Prevent VoiceOver from ignoring list semantics in Safari (opinionated).
  */
-nav li::before {
+:where(nav li)::before {
   content: "\200B";
+  float: left;
 }
 /**
  * 1. Correct the inheritance and scaling of font size in all browsers.
  * 2. Correct the odd `em` font sizing in all browsers.
  * 3. Prevent overflow of the container in all browsers (opinionated).
  */
-pre {
+:where(pre) {
   font-family: monospace, monospace; /* 1 */
   font-size: 1em; /* 2 */
   overflow: auto; /* 3 */
-  -ms-overflow-style: scrollbar; /* 3 */
 }
 /* Text-level semantics
  * ========================================================================== */
 /**
- * Add the correct text decoration in Edge 18-, IE, and Safari.
+ * Add the correct text decoration in Safari.
  */
-abbr[title] {
+:where(abbr[title]) {
   text-decoration: underline;
   -webkit-text-decoration: underline dotted;
           text-decoration: underline dotted;
@@ -129,24 +106,21 @@ abbr[title] {
 /**
  * Add the correct font weight in Chrome, Edge, and Safari.
  */
-b,
+:where(b, strong) {
-strong {
   font-weight: bolder;
 }
 /**
  * 1. Correct the inheritance and scaling of font size in all browsers.
  * 2. Correct the odd `em` font sizing in all browsers.
  */
-code,
+:where(code, kbd, samp) {
-kbd,
-samp {
   font-family: monospace, monospace; /* 1 */
   font-size: 1em; /* 2 */
 }
 /**
  * Add the correct font size in all browsers.
  */
-small {
+:where(small) {
   font-size: 80%;
 }
 /* Embedded content
@@ -154,32 +128,21 @@ small {
 /*
  * Change the alignment on media elements in all browsers (opinionated).
  */
-audio,
+:where(audio, canvas, iframe, img, svg, video) {
-canvas,
-iframe,
-img,
-svg,
-video {
   vertical-align: middle;
 }
 /**
  * Remove the border on iframes in all browsers (opinionated).
  */
-iframe {
+:where(iframe) {
   border-style: none;
 }
 /**
  * Change the fill color to match the text color in all browsers (opinionated).
  */
-svg:not([fill]) {
+:where(svg:not([fill])) {
   fill: currentColor;
 }
-/**
- * Hide the overflow in IE.
- */
-svg:not(:root) {
-  overflow: hidden;
-}
 /* Tabular data
  * ========================================================================== */
 /**
@@ -187,7 +150,7 @@ svg:not(:root) {
  * 2. Correct table border color inheritance in all Chrome, Edge, and Safari.
  * 3. Remove text indentation from table contents in Chrome, Edge, and Safari.
  */
-table {
+:where(table) {
   border-collapse: collapse; /* 1 */
   border-color: inherit; /* 2 */
   text-indent: 0; /* 3 */
@@ -197,82 +160,40 @@ table {
 /**
  * Remove the margin on controls in Safari.
  */
-button,
+:where(button, input, select) {
-input,
-select {
   margin: 0;
 }
-/**
- * 1. Show the overflow in IE.
- * 2. Remove the inheritance of text transform in Edge 18-, Firefox, and IE.
- */
-button {
-  overflow: visible; /* 1 */
-  text-transform: none; /* 2 */
-}
 /**
  * Correct the inability to style buttons in iOS and Safari.
  */
-button,
+:where(button, [type="button" i], [type="reset" i], [type="submit" i]) {
-[type="button"],
-[type="reset"],
-[type="submit"] {
   -webkit-appearance: button;
 }
 /**
- * 1. Change the inconsistent appearance in all browsers (opinionated).
+ * Change the inconsistent appearance in all browsers (opinionated).
- * 2. Correct the padding in Firefox.
  */
-fieldset {
+:where(fieldset) {
-  border: 1px solid #a0a0a0; /* 1 */
+  border: 1px solid #a0a0a0;
-  padding: 0.35em 0.75em 0.625em; /* 2 */
 }
 /**
- * Show the overflow in Edge 18- and IE.
+ * Add the correct vertical alignment in Chrome, Edge, and Firefox.
  */
-input {
+:where(progress) {
-  overflow: visible;
+  vertical-align: baseline;
-}
-/**
- * 1. Correct the text wrapping in Edge 18- and IE.
- * 2. Correct the color inheritance from `fieldset` elements in IE.
- */
-legend {
-  color: inherit; /* 2 */
-  display: table; /* 1 */
-  max-width: 100%; /* 1 */
-  white-space: normal; /* 1 */
-}
-/**
- * 1. Add the correct display in Edge 18- and IE.
- * 2. Add the correct vertical alignment in Chrome, Edge, and Firefox.
- */
-progress {
-  display: inline-block; /* 1 */
-  vertical-align: baseline; /* 2 */
-}
-/**
- * Remove the inheritance of text transform in Firefox.
- */
-select {
-  text-transform: none;
 }
 /**
  * 1. Remove the margin in Firefox and Safari.
- * 2. Remove the default vertical scrollbar in IE.
  * 3. Change the resize direction in all browsers (opinionated).
  */
-textarea {
+:where(textarea) {
   margin: 0; /* 1 */
-  overflow: auto; /* 2 */
   resize: vertical; /* 3 */
-  resize: block; /* 3 */
 }
 /**
  * 1. Correct the odd appearance in Chrome, Edge, and Safari.
  * 2. Correct the outline style in Safari.
  */
-[type="search"] {
+:where([type="search" i]) {
   -webkit-appearance: textfield; /* 1 */
   outline-offset: -2px; /* 2 */
 }
@@ -304,41 +225,15 @@ textarea {
   -webkit-appearance: button; /* 1 */
   font: inherit; /* 2 */
 }
-/**
- * Remove the inner border and padding of focus outlines in Firefox.
- */
-::-moz-focus-inner {
-  border-style: none;
-  padding: 0;
-}
-/**
- * Restore the focus outline styles unset by the previous rule in Firefox.
- */
-:-moz-focusring {
-  outline: 1px dotted ButtonText;
-}
-/**
- * Remove the additional :invalid styles in Firefox.
- */
-:-moz-ui-invalid {
-  box-shadow: none;
-}
 /* Interactive
  * ========================================================================== */
 /*
- * Add the correct display in Edge 18- and IE.
+ * Add the correct styles in Safari.
  */
-details {
+:where(dialog) {
-  display: block;
-}
-/*
- * Add the correct styles in Edge 18-, IE, and Safari.
- */
-dialog {
   background-color: white;
   border: solid;
   color: black;
-  display: block;
   height: -moz-fit-content;
   height: -webkit-fit-content;
   height: fit-content;
@@ -351,69 +246,44 @@ dialog {
   width: -webkit-fit-content;
   width: fit-content;
 }
-dialog:not([open]) {
+:where(dialog:not([open])) {
   display: none;
 }
 /*
- * Add the correct display in all browsers.
+ * Add the correct display in Safari.
  */
-summary {
+:where(details > summary:first-of-type) {
   display: list-item;
 }
-/* Scripting
- * ========================================================================== */
-/**
- * Add the correct display in IE.
- */
-template {
-  display: none;
-}
-/* User interaction
- * ========================================================================== */
-/*
- * Remove the tapping delay in IE 10.
- */
-a,
-area,
-button,
-input,
-label,
-select,
-summary,
-textarea,
-[tabindex] {
-  -ms-touch-action: manipulation;
-}
 /* Accessibility
  * ========================================================================== */
 /**
  * Change the cursor on busy elements in all browsers (opinionated).
  */
-[aria-busy="true"] {
+:where([aria-busy="true" i]) {
   cursor: progress;
 }
 /*
  * Change the cursor on control elements in all browsers (opinionated).
  */
-[aria-controls] {
+:where([aria-controls]) {
   cursor: pointer;
 }
 /*
  * Change the cursor on disabled, not-editable, or otherwise
  * inoperable elements in all browsers (opinionated).
  */
-[aria-disabled="true"],
+:where([aria-disabled="true" i], [disabled]) {
-[disabled] {
   cursor: not-allowed;
 }
 /*
  * Change the display on visually hidden accessible elements
  * in all browsers (opinionated).
  */
-[aria-hidden="false"][hidden] {
+:where([aria-hidden="false" i][hidden]) {
   display: initial;
 }
-[aria-hidden="false"][hidden]:not(:focus) {
+:where([aria-hidden="false" i][hidden]:not(:focus)) {
   clip: rect(0, 0, 0, 0);
   position: absolute;
 }
@@ -421,10 +291,7 @@ textarea,
  * 1. Change the inconsistent appearance in all browsers (opinionated).
  * 2. Add typography inheritance in all browsers (opinionated).
  */
-button,
+:where(button, input, select, textarea) {
-input,
-select,
-textarea {
   background-color: transparent; /* 1 */
   border: 1px solid WindowFrame; /* 1 */
   color: inherit; /* 1 */
@@ -435,39 +302,21 @@ textarea {
 /**
  * Change the inconsistent appearance in all browsers (opinionated).
  */
-select {
+:where(select) {
-  -moz-appearance: none;
   -webkit-appearance: none;
-  background: no-repeat right center / 1em;
+     -moz-appearance: none;
+          appearance: none;
+  background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='4'%3E%3Cpath d='M4 0h6L7 4'/%3E%3C/svg%3E") no-repeat right center / 1em;
   border-radius: 0;
   padding-right: 1em;
 }
-/**
- * Change the inconsistent appearance in all browsers (opinionated).
- */
-select:not([multiple]):not([size]) {
-  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='4'%3E%3Cpath d='M4 0h6L7 4'/%3E%3C/svg%3E");
-}
 /**
  * Remove the border and padding in all browsers (opinionated).
  */
-[type="color"],
+:where([type="color" i], [type="range" i]) {
-[type="range"] {
   border-width: 0;
   padding: 0;
 }
-/**
- * Change the inconsistent appearance in IE (opinionated).
- */
-::-ms-expand {
-  display: none;
-}
-/**
- * Correct the inconsistent appearance in IE (opinionated).
- */
-:-ms-input-placeholder {
-  color: rgba(0, 0, 0, 0.54);
-}
 
 :root {
   --main-bg-color: black;