kjuulh/dagger
Archived
1
0
Fork 0
Code Issues 1 Pull Requests 1 Projects Releases Wiki Activity

docs: 💄fix color contrast of admonitions

Browse Source 
Color contrast of in adomonitions is so low:

* [Light mode] : `<code>`
* [Dark modr] : `<div class="admonition-content">`

This happens because custom style for `<code>` overrides original colors.
Fix this.

Signed-off-by: satotake <doublequotation@gmail.com>
This commit is contained in:
satotake 2022-01-02 19:58:02 +09:00
parent 7e523c7c39
commit 5c57eb9550
1 changed files with 4 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
website/src/css/custom.scss
View File

@ -103,6 +103,9 @@ h2 {
code { code {
margin: 0 1px; margin: 0 1px;
color: var(--ifm-code-color); color: var(--ifm-code-color);
.alert & {
color: var(--ifm-alert-foreground-color);
}
} }
.markdown { .markdown {
@ -618,7 +621,7 @@ img[alt="github-contribute"] {
.admonition-#{$name} .admonition-icon::before { .admonition-#{$name} .admonition-icon::before {
mask: url($path); mask: url($path);
content: ""; content: "";
background-color: var(--ifm-color-primary-dark); background-color: var(--ifm-alert-foreground-color);
display: block; display: block;
width: 22px; width: 22px;
height: 22px; height: 22px;
@ -636,14 +639,3 @@ img[alt="github-contribute"] {
$alert: secondary, success, info, warning, danger; $alert: secondary, success, info, warning, danger;
@each $name in $alert {
$color: if(
$name==danger,
var(--ifm-color-primary-light),
var(--ifm-color-primary-dark)
);
.admonition.alert--#{$name} {
color: $color;
}
}