diff options
author | Chris Swithinbank | 2024-05-18 15:17:54 +0200 |
---|---|---|
committer | GitHub | 2024-05-18 15:17:54 +0200 |
commit | 01de9be89c85bcd0022e87465182ee1aba501687 (patch) | |
tree | c5b131d772062c058f839b76b47a931855100049 | |
parent | 5cf88fa6d57c96e7d4c49e4f69531d176a845e60 (diff) | |
download | IT.starlight-01de9be89c85bcd0022e87465182ee1aba501687.tar.gz IT.starlight-01de9be89c85bcd0022e87465182ee1aba501687.tar.bz2 IT.starlight-01de9be89c85bcd0022e87465182ee1aba501687.zip |
Micro-optimization: clean up `<details>` CSS (#1892)
-rw-r--r-- | .changeset/silly-tools-drop.md | 5 | ||||
-rw-r--r-- | packages/starlight/style/markdown.css | 8 |
2 files changed, 8 insertions, 5 deletions
diff --git a/.changeset/silly-tools-drop.md b/.changeset/silly-tools-drop.md new file mode 100644 index 00000000..0746887d --- /dev/null +++ b/.changeset/silly-tools-drop.md @@ -0,0 +1,5 @@ +--- +'@astrojs/starlight': patch +--- + +Internal refactor: simplify some CSS for the `<details>` element diff --git a/packages/starlight/style/markdown.css b/packages/starlight/style/markdown.css index 7d057de8..b1b4bc73 100644 --- a/packages/starlight/style/markdown.css +++ b/packages/starlight/style/markdown.css @@ -121,13 +121,14 @@ /* <details> and <summary> styles */ .sl-markdown-content details:not(:where(.not-content *)) { --sl-details-border-color: var(--sl-color-gray-5); + --sl-details-border-color--hover: var(--sl-color-text-accent); border-inline-start: 2px solid var(--sl-details-border-color); padding-inline-start: 1rem; } .sl-markdown-content details:not([open]):hover:not(:where(.not-content *)), .sl-markdown-content details:has(> summary:hover):not(:where(.not-content *)) { - --sl-details-border-color: var(--sl-color-text-accent); + border-color: var(--sl-details-border-color--hover); } .sl-markdown-content summary:not(:where(.not-content *)) { color: var(--sl-color-white); @@ -182,8 +183,5 @@ /* <details> styles inside asides */ .sl-markdown-content .starlight-aside details:not(:where(.not-content *)) { --sl-details-border-color: var(--sl-color-asides-border); -} -.sl-markdown-content .starlight-aside details:not([open]):hover:not(:where(.not-content *)), -.sl-markdown-content .starlight-aside details:has(> summary:hover):not(:where(.not-content *)) { - --sl-details-border-color: var(--sl-color-asides-text-accent); + --sl-details-border-color--hover: var(--sl-color-asides-text-accent); } |