mirror of https://github.com/jkjoy/sunpeiwen.git
197 lines
4.0 KiB
Stylus
197 lines
4.0 KiB
Stylus
|
:root
|
||
|
|
--global-font-size: $font-size
|
||
|
|
--global-bg: $body-bg
|
||
|
|
--font-color: $font-black
|
||
|
|
--hr-border: lighten($theme-hr-color, 50%)
|
||
|
|
--hr-before-color: lighten($theme-hr-color, 30%)
|
||
|
|
--search-bg: $search-bg
|
||
|
|
--search-input-color: $search-input-color
|
||
|
|
--search-a-color: $search-a-color
|
||
|
|
--preloader-bg: $preloader-bg
|
||
|
|
--preloader-color: $preloader-word-color
|
||
|
|
--tab-border-color: $tab-border-color
|
||
|
|
--tab-botton-bg: $tab-botton-bg
|
||
|
|
--tab-botton-color: $tab-botton-color
|
||
|
|
--tab-button-hover-bg: $tab-button-hover-bg
|
||
|
|
--tab-button-active-bg: $tab-button-active-bg
|
||
|
|
--card-bg: $card-bg
|
||
|
|
--sidebar-bg: $sidebar-background
|
||
|
|
--btn-hover-color: $button-hover-color
|
||
|
|
--btn-color: $button-color
|
||
|
|
--btn-bg: $button-bg
|
||
|
|
--text-bg-hover: rgba($text-bg-hover, .7)
|
||
|
|
--light-grey: $light-grey
|
||
|
|
--dark-grey: $dark-grey
|
||
|
|
--white: $white
|
||
|
|
--text-highlight-color: $text-highlight-color
|
||
|
|
--blockquote-color: $blockquote-color
|
||
|
|
--blockquote-bg: $blockquote-background-color
|
||
|
|
--reward-pop: $reward-pop-up-bg
|
||
|
|
--toc-link-color: $toc-link-color
|
||
|
|
--card-box-shadow: 0 3px 8px 6px rgba(7, 17, 27, .05)
|
||
|
|
--card-hover-box-shadow: 0 3px 8px 6px rgba(7, 17, 27, .09)
|
||
|
|
--pseudo-hover: $pseudo-hover
|
||
|
|
--headline-presudo: #a0a0a0
|
||
|
|
--scrollbar-color: $scrollbar-color
|
||
|
|
--default-bg-color: $theme-color
|
||
|
|
--zoom-bg: #fff
|
||
|
|
--mark-bg: alpha($dark-black, .3)
|
||
|
|
|
||
|
|
body
|
||
|
|
position: relative
|
||
|
|
min-height: 100%
|
||
|
|
background: var(--global-bg)
|
||
|
|
color: var(--font-color)
|
||
|
|
font-size: var(--global-font-size)
|
||
|
|
font-family: $font-family
|
||
|
|
line-height: $text-line-height
|
||
|
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0)
|
||
|
|
|
||
|
|
if !hexo-config('copy.enable')
|
||
|
|
user-select: none
|
||
|
|
|
||
|
|
// scrollbar - chrome/safari
|
||
|
|
*::-webkit-scrollbar
|
||
|
|
width: 5px
|
||
|
|
height: 5px
|
||
|
|
|
||
|
|
*::-webkit-scrollbar-thumb
|
||
|
|
background: var(--scrollbar-color)
|
||
|
|
|
||
|
|
*::-webkit-scrollbar-track
|
||
|
|
background-color: transparent
|
||
|
|
|
||
|
|
// scrollbar - firefox
|
||
|
|
*
|
||
|
|
scrollbar-width: thin
|
||
|
|
scrollbar-color: var(--scrollbar-color) transparent
|
||
|
|
|
||
|
|
input::placeholder
|
||
|
|
color: var(--font-color)
|
||
|
|
|
||
|
|
if $web-bg
|
||
|
|
#web_bg
|
||
|
|
position: fixed
|
||
|
|
z-index: -999
|
||
|
|
width: 100%
|
||
|
|
height: 100%
|
||
|
|
background: $web-bg
|
||
|
|
background-attachment: local
|
||
|
|
background-position: center
|
||
|
|
background-size: cover
|
||
|
|
background-repeat: no-repeat
|
||
|
|
|
||
|
|
h1,
|
||
|
|
h2,
|
||
|
|
h3,
|
||
|
|
h4,
|
||
|
|
h5,
|
||
|
|
h6
|
||
|
|
position: relative
|
||
|
|
margin: 20px 0 14px
|
||
|
|
color: var(--text-highlight-color)
|
||
|
|
font-weight: bold
|
||
|
|
|
||
|
|
code
|
||
|
|
font-size: inherit !important
|
||
|
|
|
||
|
|
*
|
||
|
|
box-sizing: border-box
|
||
|
|
|
||
|
|
.table-wrap
|
||
|
|
overflow-x: scroll
|
||
|
|
margin: 0 0 20px
|
||
|
|
|
||
|
|
table
|
||
|
|
display: table
|
||
|
|
width: 100%
|
||
|
|
border-spacing: 0
|
||
|
|
border-collapse: collapse
|
||
|
|
empty-cells: show
|
||
|
|
|
||
|
|
thead
|
||
|
|
background: alpha($table-thead-bg, 10%)
|
||
|
|
|
||
|
|
th,
|
||
|
|
td
|
||
|
|
padding: 6px 12px
|
||
|
|
border: 1px solid var(--light-grey)
|
||
|
|
vertical-align: middle
|
||
|
|
|
||
|
|
*::selection
|
||
|
|
background: $theme-text-selection-color
|
||
|
|
color: #F7F7F7
|
||
|
|
|
||
|
|
button
|
||
|
|
padding: 0
|
||
|
|
outline: 0
|
||
|
|
border: none
|
||
|
|
background: none
|
||
|
|
cursor: pointer
|
||
|
|
touch-action: manipulation
|
||
|
|
|
||
|
|
a
|
||
|
|
color: $a-link-color
|
||
|
|
text-decoration: none
|
||
|
|
word-wrap: break-word
|
||
|
|
transition: all .2s
|
||
|
|
overflow-wrap: break-word
|
||
|
|
|
||
|
|
&:hover
|
||
|
|
color: $light-blue
|
||
|
|
|
||
|
|
// font
|
||
|
|
if $site-name-font
|
||
|
|
#site-title,
|
||
|
|
#site-subtitle,
|
||
|
|
.site-name,
|
||
|
|
#aside-content .author-info__name,
|
||
|
|
#aside-content .author-info__description
|
||
|
|
font-family: $site-name-font
|
||
|
|
|
||
|
|
.is-center
|
||
|
|
text-align: center
|
||
|
|
|
||
|
|
.pull-left
|
||
|
|
float: left
|
||
|
|
|
||
|
|
.pull-right
|
||
|
|
float: right
|
||
|
|
|
||
|
|
img
|
||
|
|
&[src=''],
|
||
|
|
&:not([src])
|
||
|
|
opacity: 0
|
||
|
|
|
||
|
|
// lazyload blur
|
||
|
|
if hexo-config('lazyload.enable') && hexo-config('lazyload.blur') && !hexo-config('lazyload.placeholder')
|
||
|
|
img
|
||
|
|
&[data-lazy-src]:not(.loaded)
|
||
|
|
filter: blur(8px) brightness(1)
|
||
|
|
|
||
|
|
&[data-lazy-src].error
|
||
|
|
filter: none
|
||
|
|
|
||
|
|
.img-alt
|
||
|
|
margin: -10px 0 10px
|
||
|
|
color: #858585
|
||
|
|
|
||
|
|
&:hover
|
||
|
|
text-decoration: none !important
|
||
|
|
|
||
|
|
blockquote
|
||
|
|
margin: 0 0 20px
|
||
|
|
padding: 12px 15px
|
||
|
|
border-left: 3px solid $blockquote-padding-color
|
||
|
|
background-color: var(--blockquote-bg)
|
||
|
|
color: var(--blockquote-color)
|
||
|
|
|
||
|
|
footer
|
||
|
|
cite
|
||
|
|
&:before
|
||
|
|
padding: 0 5px
|
||
|
|
content: '—'
|
||
|
|
|
||
|
|
& > :last-child
|
||
|
|
margin-bottom: 0 !important
|