399 lines
5.2 KiB
Stylus
399 lines
5.2 KiB
Stylus
@import "~highlight.js/styles/night-owl.css"
|
|
|
|
margin-y($top, $bottom = $top)
|
|
margin-top $top
|
|
margin-bottom $bottom
|
|
|
|
.post
|
|
position relative
|
|
padding 30px 60px
|
|
font-size 14px
|
|
line-height 1.8
|
|
color #282c33
|
|
font-weight 400
|
|
hyphens auto
|
|
|
|
.post-layout &
|
|
min-height 100%
|
|
margin-bottom -192px
|
|
|
|
&::after
|
|
content ""
|
|
display block
|
|
height 192px
|
|
|
|
.post-layout.no-links &
|
|
margin-bottom -58px
|
|
|
|
.no-links &::after
|
|
height 58px
|
|
|
|
.one-demo
|
|
margin 1em 0 1.25em
|
|
|
|
.one-details
|
|
margin-bottom 5px
|
|
|
|
[data-markdown]
|
|
h1
|
|
h1&
|
|
margin-y(0, 1.25em)
|
|
font-size 36px
|
|
|
|
small
|
|
vertical-align 0.1em
|
|
color #999
|
|
|
|
h2
|
|
h2&
|
|
margin-y(1.3em, 1.2em)
|
|
font-size 30px
|
|
|
|
&::before
|
|
content "#"
|
|
margin-right 5px
|
|
color #ccc
|
|
|
|
& + h3
|
|
margin-top 2em
|
|
|
|
h3
|
|
h3&
|
|
margin-y(1.25em, 1.15em)
|
|
font-size 24px
|
|
|
|
h4
|
|
h4&
|
|
margin-y(1.15em, 1.1em)
|
|
font-size 18px
|
|
|
|
h5
|
|
h5&
|
|
margin-y(1.05em)
|
|
font-size 14px
|
|
|
|
h6
|
|
h6&
|
|
margin-y(1em)
|
|
font-size 12px
|
|
|
|
h1
|
|
h1&
|
|
h2
|
|
h2&
|
|
h3
|
|
h3&
|
|
font-weight 500
|
|
clear both
|
|
|
|
h1
|
|
h1&
|
|
h2
|
|
h2&
|
|
h3
|
|
h3&
|
|
h4
|
|
h4&
|
|
h5
|
|
h5&
|
|
h6
|
|
h6&
|
|
color #333
|
|
line-height 1
|
|
|
|
br
|
|
br&
|
|
clear both
|
|
|
|
p
|
|
p&
|
|
margin-y(0.5em)
|
|
|
|
ul
|
|
ul&
|
|
ol
|
|
ol&
|
|
padding-left 1.5em
|
|
|
|
blockquote
|
|
blockquote&
|
|
margin 1em 0
|
|
padding-left 1em
|
|
border-left 5px solid #f1f1f1
|
|
color #666
|
|
transition color 0.2s, border-color 0.2s
|
|
|
|
&:hover
|
|
color #333
|
|
border-left-color #d3d3d3
|
|
|
|
table
|
|
table&
|
|
width 100%
|
|
border-collapse collapse
|
|
border 1px solid #f1f1f1
|
|
border-radius 4px
|
|
margin-y(1.5em)
|
|
|
|
thead
|
|
position sticky
|
|
top -1px
|
|
background #f3f6f988
|
|
backdrop-filter blur(4px)
|
|
|
|
th
|
|
position relative
|
|
|
|
&::after
|
|
content ""
|
|
position absolute
|
|
bottom 0
|
|
width 100%
|
|
height 1px
|
|
left 0
|
|
background #f1f1f1
|
|
|
|
// pre
|
|
// table
|
|
// max-width 480px
|
|
|
|
th
|
|
td
|
|
min-width 90px
|
|
padding 8px 14px
|
|
border 1px solid #f1f1f1
|
|
border-style solid none
|
|
text-align left
|
|
vertical-align top
|
|
|
|
& > :first-child
|
|
margin-top 0
|
|
|
|
& > :last-child
|
|
margin-bottom 0
|
|
|
|
pre
|
|
font-size 90%
|
|
|
|
table
|
|
margin-y(0.2em, 0.5em)
|
|
|
|
td:first-child
|
|
white-space nowrap
|
|
|
|
a:link
|
|
a&:link
|
|
a:visited
|
|
a&:visited
|
|
text-decoration none
|
|
color #0052cc
|
|
transition color 0.2s
|
|
|
|
&:hover
|
|
color #06f
|
|
|
|
&:active
|
|
color #0046ad
|
|
|
|
code
|
|
code&
|
|
font-size 90%
|
|
hyphens none
|
|
font-family Menlo, consolas, monospace
|
|
|
|
&:not(pre > code)
|
|
padding 2px 4px
|
|
background-color #0066ff16
|
|
overflow visible
|
|
border-radius 3px
|
|
|
|
hr
|
|
hr&
|
|
height 1px
|
|
margin 2em 0
|
|
padding 0
|
|
background-color #eff0f1
|
|
border 0
|
|
clear both
|
|
|
|
figure
|
|
figure&
|
|
float right
|
|
width 60%
|
|
margin 0 0 30px 20px
|
|
|
|
& + h1
|
|
& + h2
|
|
& + h3
|
|
& + h4
|
|
& + h5
|
|
& + h6
|
|
margin-top 0
|
|
|
|
img
|
|
display block
|
|
margin auto
|
|
|
|
.preview
|
|
padding 20px
|
|
overflow hidden
|
|
border 1px solid #e5e5e5
|
|
transition box-shadow 0.2s
|
|
cursor pointer
|
|
text-align center
|
|
|
|
&:hover
|
|
box-shadow 0 0 5px rgba(0, 0, 0, 0.2)
|
|
|
|
&.hero
|
|
width 100%
|
|
float none
|
|
|
|
figcaption
|
|
figcaption&
|
|
margin-top 10px
|
|
font-size 12px
|
|
|
|
p
|
|
margin 0
|
|
line-height 20px
|
|
|
|
.caption
|
|
font-weight 500
|
|
|
|
.desc
|
|
color #999
|
|
|
|
img
|
|
img&
|
|
max-width 100%
|
|
max-height 100%
|
|
|
|
pre
|
|
pre&
|
|
border-radius 4px
|
|
white-space pre
|
|
overflow auto
|
|
line-height 1.6
|
|
|
|
code
|
|
border none
|
|
padding 18px 24px
|
|
|
|
var
|
|
font-family "PT Serif", Georgia, serif
|
|
|
|
kbd
|
|
display inline-block
|
|
padding 3px 5px 6px
|
|
font-size 90%
|
|
line-height 10px
|
|
color #444d56
|
|
vertical-align 1px
|
|
background-color #fafbfc
|
|
border solid 1px #c6cbd1
|
|
border-bottom-color #959da5
|
|
border-radius 3px
|
|
box-shadow inset 0 -1px 0 #959da5
|
|
|
|
.custom-block
|
|
.custom-block&
|
|
border 1px solid
|
|
border-radius 4px
|
|
margin 1em 0
|
|
padding 0.75em 1em
|
|
|
|
& > :first-child
|
|
margin-top 0
|
|
|
|
& > :last-child
|
|
margin-bottom 0
|
|
|
|
.veui-alert
|
|
.veui-alert&
|
|
margin 1em 0
|
|
|
|
p:first-child
|
|
margin-top 0
|
|
|
|
p:last-child
|
|
margin-bottom 0
|
|
|
|
.badges
|
|
.badges&
|
|
border none
|
|
padding 0
|
|
|
|
code
|
|
padding 2px 3px
|
|
background #333
|
|
border-radius 3px
|
|
color #fff
|
|
font-size 80%
|
|
|
|
.oss-badges&
|
|
border none
|
|
padding 0
|
|
|
|
a
|
|
margin-right 10px
|
|
|
|
.hljs-attr
|
|
color #c5e478
|
|
|
|
[data-target]
|
|
animation target-blink 6s ease 1 both
|
|
|
|
.meta
|
|
display flex
|
|
justify-content center
|
|
|
|
.one-edit-link
|
|
margin-top 40px
|
|
|
|
@keyframes target-blink
|
|
0%
|
|
background-color #f2f7ff
|
|
|
|
3%
|
|
9%
|
|
background-color #fff
|
|
|
|
6%
|
|
12%
|
|
80%
|
|
background-color #f2f7ff
|
|
|
|
@media (max-width 480px)
|
|
.post
|
|
padding 30px
|
|
|
|
[data-markdown]
|
|
h1
|
|
h1&
|
|
font-size 24px
|
|
|
|
h2
|
|
h2&
|
|
font-size 20px
|
|
|
|
h3
|
|
h3&
|
|
font-size 18px
|
|
|
|
h4
|
|
h4&
|
|
font-size 16px
|
|
h5
|
|
h5&
|
|
font-size 14px
|
|
|
|
table
|
|
display block
|
|
max-width 100%
|
|
width fit-content
|
|
overflow-x auto
|
|
|
|
table
|
|
display table
|