hexo-theme-stellar/source/css/_layout/md.styl

168 lines
3.2 KiB
Stylus

.md-text
max-width: 100%
padding: 1rem
&:first-child
margin-top: 0
color: var(--text-p1)
line-height: 1.7
word-break: break-word
.md-text.excerpt
p
font-size: $fs-14
margin: 1em 0
h1.article-title
margin-top: .5em
margin-bottom: 1em
line-height: 1.2
color: var(--text-p0)
.md-text.content
position: relative
padding-bottom: 2rem
overflow: hidden
>:first-child:not(h1)
margin-top: 0
h1:not(:first-child)
margin-top: 1em
h2
margin-bottom: 1rem
h3,h4,h5,h6
margin-bottom: .5rem
h2,h3,h4,h5,h6
color: var(--text-p0)
padding-top: 1rem
line-height: 1.8
&:hover
a.headerlink:before
opacity: 1
blockquote, .tag-plugin
h2,h3,h4,h5,h6
margin-top: 0.25em
margin-bottom: 0.25em
padding-top: 0
.l_body[text-indent] .md-text.content
>p:not([class])
text-indent: 'calc(%s * 2)' % var(--fs-p)
text-align: convert(hexo-config('style.text-align'))
a
text-indent: 0
h1,h2,h3,h4,h5,h6
text-align: center
>h2:not([class])
border-bottom: none
.md-text.content:first-child
padding-top: 0
.md-text
ul:not(:last-child),
ol:not(:last-child)
padding-bottom: .5rem
margin: 0
blockquote,ul,ol
p,ul,ol
font-size: $fs-14
line-height: 1.5
code
font-size: inherit
padding: 0
background: none
p,blockquote,.tag-plugin,ul,ol,.highlight,table
*
--gap-p: var(--gap-p-compact)
p,ul,ol
margin-top: 'calc(%s - 4px)' % var(--gap-p)
margin-bottom: 'calc(%s - 4px)' % var(--gap-p)
.tag-plugin,iframe
margin-top: var(--gap-p)
margin-bottom: var(--gap-p)
iframe
display: block
// titles
.md-text.content
a.headerlink:before
opacity: 0
content: '#'
position: absolute
margin-left: -0.6em
h2
margin-top: 2rem
border-bottom: 1px solid var(--block-border)
font-weight: 400
h3
margin-top: 1.5rem
font-weight: 400
h4,h5,h6
font-weight: 500
h1+h2
margin-top: -0.5rem
h2+h3
margin-top: -0.5rem
h3+h4
margin-top: -0.5rem
h4+h5
margin-top: -0.5rem
h5+h6
margin-top: -0.5rem
.md-text p
font-size: var(--fs-p)
.md-text pre
-webkit-font-smoothing: auto
-moz-osx-font-smoothing: auto
.md-text
.center
align-self: center
// div
.md-text>div
margin: var(--gap-p) 0
.md-text img
border-radius: $border-image
margin: auto
display: block
.md-text
p:not([class]), li:not([class])
a:not([class])
position: relative
padding: 2px 0
text-decoration: none
line-height: 1.2
&:before
content: ''
position: absolute
border-radius: 2px
bottom: 0
left: 0
right: 0
height: 1px
if hexo-config('style.link.underline') == true
opacity: 0.8
else
opacity: 0
background: var(--theme-link)
trans1: all
&:hover
border-bottom: none
color: var(--theme-link)
z-index 0
&:before
height: 100%
opacity: 0.2
z-index -1
bottom: 0
left: -2px
right: -2px
&:has(img)
&:before
content: none