Skip to content

Commit

Permalink
docs: style fixes (#5437)
Browse files Browse the repository at this point in the history
* add underline styles to admonition content

* add hover underline on smaller breakpoints

* adjust hue & transparency of `code` so dotted underline shows through
  • Loading branch information
jaffrepaul committed Aug 24, 2023
1 parent fef636c commit 47865db
Show file tree
Hide file tree
Showing 2 changed files with 21 additions and 0 deletions.
3 changes: 3 additions & 0 deletions src/css/custom.scss
Original file line number Diff line number Diff line change
Expand Up @@ -111,6 +111,9 @@ html[data-theme='light'] {
--ifm-link-color: var(--cypress-color-indigo-500);

--ifm-toc-border-color: var(--ifm-color-gray-100);

// adjust hue & transparency of `code` so dotted underline shows through in light mode
--ifm-code-background: #dadada33;
}

html[data-theme='dark'] {
Expand Down
18 changes: 18 additions & 0 deletions src/css/markdown.scss
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,16 @@ div.markdown {
// add border bottom to code tags that are in a link
a:has(> code) {
border-bottom: 1px dotted var(--ifm-link-color);

&:hover {
border-bottom: 1px solid var(--ifm-link-color);
}
}

// ensure text links in admonitions have underline
.alert a {
border-bottom: 1px dotted var(--ifm-link-color);

&:hover {
border-bottom: 1px solid var(--ifm-link-color);
}
Expand Down Expand Up @@ -71,11 +81,19 @@ div.markdown {
@media screen and (max-width: 1024px) and (orientation: landscape) {
a {
border-bottom: 1px dotted var(--ifm-link-color);

&:hover {
border-bottom: 1px solid var(--ifm-link-color);
}
}
}
@media screen and (max-width: 1024px) and (orientation: portrait) {
a {
border-bottom: 1px dotted var(--ifm-link-color);

&:hover {
border-bottom: 1px solid var(--ifm-link-color);
}
}
}
}
Expand Down

0 comments on commit 47865db

Please sign in to comment.