style: optimize gitalk plugin dark mode style

This commit is contained in:
XPoet 2020-10-29 17:44:27 +08:00
parent 18958d0cb1
commit 9f2990253e
2 changed files with 13 additions and 12 deletions

View File

@ -174,11 +174,10 @@ $gt-size-avatar-mobi := em(32px)
&-login &-login
margin-right: 0 margin-right: 0
&-preview &-preview
background-color: $gt-color-btn background-color: var(--background-color)
color: $gt-color-main color: $gt-color-main
&:hover &:hover
background-color: darken($gt-color-btn, 5%) background-color: var(--magic-background-color)
border-color: lighten($gt-color-main, 20%)
&-public &-public
&:hover &:hover
background-color: lighten($gt-color-main, 20%) background-color: lighten($gt-color-main, 20%)
@ -298,20 +297,21 @@ $gt-size-avatar-mobi := em(32px)
min-height: em(82px) min-height: em(82px)
max-height: em(240px) max-height: em(240px)
border-radius: $gt-size-border-radius border-radius: $gt-size-border-radius
border: 1px solid $gt-color-input-border border: 1px solid var(--border-color)
font-size: em(14px) font-size: em(14px)
word-wrap: break-word word-wrap: break-word
resize: vertical resize: vertical
background-color: $gt-color-input-bg color: var(--normal-text-color)
background-color: var(--fourth-text-color)
outline: none outline: none
transition: all 0.25s ease transition: all 0.25s ease
&:hover &:hover
background-color: lighten($gt-color-input-bg, 50%) background-color: var(--background-color)
&-preview &-preview
padding: em(12px) padding: em(12px)
border-radius: $gt-size-border-radius border-radius: $gt-size-border-radius
border: 1px solid $gt-color-input-border border: 1px solid var(--border-color)
background-color: $gt-color-input-bg background-color: var(--background-color)
&-controls &-controls
position: relative position: relative
margin: em(12px) 0 0 margin: em(12px) 0 0
@ -419,7 +419,8 @@ $gt-size-avatar-mobi := em(32px)
top: 0 top: 0
right: 0 right: 0
&-body &-body
color: $gt-color-comment-txt !important //color: $gt-color-comment-txt !important
color: var(--second-text-color) !important
.email-hidden-toggle a .email-hidden-toggle a
display: inline-block; display: inline-block;
height: 12px; height: 12px;
@ -446,10 +447,10 @@ $gt-size-avatar-mobi := em(32px)
display: block display: block
&-admin &-admin
.gt-comment-content .gt-comment-content
background-color: $gt-color-comment-adminbg background-color: var(--fourth-text-color)
@keyframes gt-kf-rotate @keyframes gt-kf-rotate
0% 0%
transform: rotate(0) transform: rotate(0)
100% 100%
transform: rotate(360deg) transform: rotate(360deg)

View File

@ -97,9 +97,9 @@ $default-font-weight = 400;
--magic-background-color: $magic-background-color; --magic-background-color: $magic-background-color;
--primary-color: $primary-color; --primary-color: $primary-color;
--first-text-color: $first-text-color; --first-text-color: $first-text-color;
--fourth-text-color: $fourth-text-color;
--second-text-color: $second-text-color; --second-text-color: $second-text-color;
--third-text-color: $third-text-color; --third-text-color: $third-text-color;
--fourth-text-color: $fourth-text-color;
--normal-text-color: $normal-text-color; --normal-text-color: $normal-text-color;
--border-color: $border-color; --border-color: $border-color;
--selection-color: $selection-color; --selection-color: $selection-color;