fix: html code block presentation style issue

This commit is contained in:
jeffreytse 2020-07-15 18:24:52 +08:00
parent 38ad8244d8
commit 9a76b450ac

View file

@ -152,9 +152,10 @@ blockquote {
pre, pre,
code { code {
@include relative-font-size(0.9375); @include relative-font-size(0.9375);
color: $text-color;
} }
code { *:not(pre) > code {
padding: 1px 5px; padding: 1px 5px;
border-radius: 3px; border-radius: 3px;
color: #fff; color: #fff;
@ -164,7 +165,9 @@ code {
pre { pre {
overflow-x: auto; overflow-x: auto;
position: relative; position: relative;
background-color: #f0f0f0;
// code language badge
&:before { &:before {
content: attr(data-lang); content: attr(data-lang);
color: #fff; color: #fff;
@ -180,9 +183,10 @@ pre {
} }
> code { > code {
border: 0; display: inline-block;
padding: 20px!important; padding: 20px!important;
background-color: transparent; background-color: transparent;
border: 0;
} }
} }