Optimize darkmode kbd color

This commit is contained in:
Mimi 2020-06-06 16:15:23 +08:00
parent f055e389d3
commit 6d5d471424
3 changed files with 17 additions and 19 deletions

View File

@ -88,15 +88,3 @@ dd {
margin: 0;
padding: 0;
}
kbd {
background-color: $whitesmoke;
background-image: linear-gradient($gainsboro, white, $gainsboro);
border: 1px solid $grey-light;
border-radius: .2em;
box-shadow: .1em .1em .2em rgba(0, 0, 0, .1);
color: $code-foreground;
font-family: inherit;
padding: .1em .3em;
white-space: nowrap;
}

View File

@ -8,10 +8,14 @@ if (hexo-config('darkmode')) {
@import 'copy-code' if (hexo-config('codeblock.copy_button.enable'));
// Placeholder: $code-block
$code-block {
// Placeholder: $code-inline $code-block
$code-inline {
background: var(--highlight-background);
color: var(--highlight-foreground);
}
$code-block {
@extend $code-inline;
line-height: $line-height-code-block;
margin: 0 auto 20px;
}
@ -21,13 +25,22 @@ pre, code {
}
code {
background: $code-background;
@extend $code-inline;
border-radius: 3px;
color: $code-foreground;
padding: 2px 4px;
word-wrap();
}
kbd {
@extend $code-inline;
border: 1px solid $grey-light;
border-radius: .2em;
box-shadow: .1em .1em .2em rgba(0, 0, 0, .1);
font-family: inherit;
padding: .1em .3em;
white-space: nowrap;
}
.highlight {
@extend $code-block;
position: relative;
@ -105,7 +118,6 @@ pre {
code {
background: none;
color: var(--highlight-foreground);
font-size: $table-font-size;
padding: 0;
text-shadow: none;

View File

@ -132,8 +132,6 @@ $table-row-hover-bg-color-dark = #363636;
// Code & Code Blocks
// --------------------------------------------------
$code-font-family = $font-family-monospace;
$code-background = var(--body-bg-color);
$code-foreground = var(--text-color);
$highlight-background = convert(hexo-config('highlight.light.background'));
$highlight-foreground = convert(hexo-config('highlight.light.foreground'));