571 lines
9.5 KiB
Stylus
571 lines
9.5 KiB
Stylus
*
|
|
margin 0
|
|
padding 0
|
|
|
|
body, html
|
|
color #2e2f30
|
|
letter-spacing 0.5px
|
|
font-family 'Source Sans Pro', 'Playfair Display', PingFang SC, Lantinghei SC, Microsoft Yahei, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, Arial, sans-serif
|
|
height 100%
|
|
width 100%
|
|
background-color #fff
|
|
|
|
#__nuxt, .content
|
|
width 100%
|
|
height 100%
|
|
max-width 1040px
|
|
margin 0 auto
|
|
position relative
|
|
box-sizing border-box
|
|
|
|
a, a:visited
|
|
color #333333
|
|
|
|
a:focus, a:hover
|
|
color #cd0216
|
|
|
|
a, a:focus, a:hover, a:visited
|
|
text-decoration none
|
|
|
|
/* Opera Fix */
|
|
body:before
|
|
content ''
|
|
height 100%
|
|
float left
|
|
width 0
|
|
margin-top -32767px
|
|
|
|
footer
|
|
text-align center
|
|
position relative
|
|
margin-top -35px
|
|
height 35px
|
|
clear both
|
|
font-size 9px
|
|
margin-bottom 5px
|
|
|
|
.footer
|
|
padding-top 10px
|
|
|
|
.page-enter-active, .page-leave-active
|
|
transition opacity 0.5s
|
|
|
|
.page-enter, .page-leave-active
|
|
opacity 0
|
|
|
|
.container
|
|
min-height 100%
|
|
margin 0 auto
|
|
|
|
.articelAbstractContent p, .articelAbstractContent h1, .articelAbstractContent h2, .articelAbstractContent h3, .articelAbstractContent h4, .articelAbstractContent h5, .articelAbstractContent h6, .articelContent p, .articelContent h1, .articelContent h2, .articelContent h3, .articelContent h4, .articelContent h5, .articelContent h6
|
|
margin-top 1em
|
|
|
|
.articelAbstractContent, .articelContent
|
|
word-wrap break-word
|
|
|
|
img
|
|
max-width 100%
|
|
display block
|
|
vertical-align middle
|
|
margin auto
|
|
width auto
|
|
height auto
|
|
|
|
ul, ol
|
|
margin-left 60px
|
|
|
|
// 点击滑动到顶部那个按钮的样式
|
|
.scroll-top
|
|
transition all 0.4s ease-in-out
|
|
width 25px
|
|
height 25px
|
|
line-height 25px
|
|
text-align center
|
|
opacity 0.6
|
|
background-color #000000
|
|
color #ffffff
|
|
position fixed
|
|
right 8px
|
|
bottom 8px
|
|
z-index 998
|
|
padding 4px
|
|
|
|
i
|
|
color #fff
|
|
|
|
.articleImgs
|
|
overflow hidden
|
|
|
|
position relative
|
|
img
|
|
width 100%
|
|
cursor pointer
|
|
|
|
.Info
|
|
background-color #fff
|
|
box-shadow 0 0 2px 1px rgba(0, 0, 0, 0.06), 0 1px 5px rgba(0, 0, 0, 0.1)
|
|
margin-bottom 50px
|
|
text-align center
|
|
padding 40px
|
|
font-size responsive
|
|
font-weight 300
|
|
|
|
.btn-footer
|
|
margin-top 50px
|
|
font-size 12px
|
|
color #333
|
|
float left
|
|
|
|
i
|
|
margin 10px
|
|
|
|
.btn-next
|
|
float right
|
|
|
|
.btn-disable
|
|
color #dfdede !important
|
|
user-select none
|
|
cursor not-allowed
|
|
|
|
footer .footer
|
|
color #a2a2a2
|
|
text-align left
|
|
line-height 1.5
|
|
margin 20px 0
|
|
|
|
.page-container
|
|
width 100%
|
|
height 100%
|
|
|
|
.page-container::after
|
|
content ' '
|
|
display block
|
|
height 0
|
|
visibility hidden
|
|
clear both
|
|
|
|
#LeftMenu
|
|
overflow-y auto
|
|
overflow-x hidden
|
|
display block
|
|
background-color #fff
|
|
height 100%
|
|
width 295px
|
|
float left
|
|
box-shadow 8px 0px 11px 0px #fff
|
|
|
|
#rightContent
|
|
margin-left 300px
|
|
padding 0 50px
|
|
height 100%
|
|
|
|
.header
|
|
display none
|
|
|
|
.articleList
|
|
border-bottom 1px solid #F0F0F0
|
|
margin-bottom 30px
|
|
|
|
::-webkit-input-placeholder
|
|
font-weight 300
|
|
|
|
::-moz-placeholder /* firefox 19+ */
|
|
font-weight 300
|
|
|
|
/* firefox 19+ */
|
|
:-ms-input-placeholder /* ie */
|
|
font-weight 300
|
|
|
|
/* ie */
|
|
input:-moz-placeholder
|
|
font-weight 300
|
|
|
|
#leftcontent
|
|
color #777777
|
|
opacity 1
|
|
height 100%
|
|
padding 0 40px
|
|
box-sizing border-box
|
|
width 295px
|
|
visibility visible
|
|
-webkit-transition opacity 0.24s ease-in-out
|
|
-moz-transition opacity 0.24s ease-in-out
|
|
transition opacity 0.24s ease-in-out
|
|
|
|
#wrap
|
|
min-height 100%
|
|
|
|
#leftMain
|
|
overflow auto
|
|
|
|
.title
|
|
text-align center
|
|
font-weight 300
|
|
color #000000
|
|
margin-top 40px
|
|
|
|
.widget
|
|
margin-bottom 10px
|
|
|
|
.links
|
|
margin-bottom 20px
|
|
font-weight 300
|
|
|
|
li
|
|
margin-top 5px
|
|
|
|
.widgetTitle
|
|
font-size 18px
|
|
line-height 100%
|
|
text-align center
|
|
padding 10px 0 6px 0
|
|
margin 0 0 30px 0
|
|
position relative
|
|
border 0
|
|
outline 0
|
|
vertical-align baseline
|
|
box-sizing border-box
|
|
|
|
label
|
|
color #333333
|
|
font-weight 300
|
|
background-color #fff
|
|
display inline-block
|
|
padding 5px 10px
|
|
position relative
|
|
z-index 1
|
|
margin 0
|
|
font-size 100%
|
|
font-family inherit
|
|
vertical-align baseline
|
|
box-sizing border-box
|
|
|
|
.widgetTitle:after
|
|
height 1px
|
|
content ''
|
|
margin-top 2px
|
|
border-top 1px solid #aaa
|
|
position absolute
|
|
top 50%
|
|
left 0
|
|
right 0
|
|
border-top 1px solid #aaaaaa
|
|
|
|
.avatar
|
|
margin-bottom 40px
|
|
|
|
> img
|
|
width 100%
|
|
|
|
.aboutMe
|
|
font-size 9px
|
|
line-height 1.5
|
|
margin-top 10px
|
|
|
|
.social
|
|
margin 15px 5px
|
|
height 20px
|
|
font-size 12px
|
|
font-weight 300
|
|
|
|
.social-info-box
|
|
border 1px solid #d0d0d0
|
|
width 100%
|
|
height 30px
|
|
line-height 30px
|
|
text-align center
|
|
font-size 14px
|
|
margin-bottom 20px
|
|
|
|
ul
|
|
height 30px
|
|
list-style none
|
|
|
|
> li:first-child
|
|
font-size 14px
|
|
margin-top -1px
|
|
margin-left 0
|
|
|
|
> li
|
|
a
|
|
color #948d8d
|
|
|
|
a:hover
|
|
color #cd0216
|
|
|
|
color #948d8d
|
|
float left
|
|
height 30px
|
|
margin-left 11px
|
|
cursor pointer
|
|
|
|
> li:hover
|
|
color #cd0216
|
|
|
|
.navication
|
|
margin-bottom 40px
|
|
font-size 15px
|
|
font-weight 300
|
|
top 25px
|
|
width 215px
|
|
|
|
ul
|
|
margin-left 20px
|
|
list-style circle
|
|
|
|
> li
|
|
margin-left 11px
|
|
line-height 1.8
|
|
|
|
.search-box
|
|
border 1px solid #cccccc
|
|
margin-top 30px
|
|
padding 8px
|
|
position relative
|
|
color #cccccc
|
|
|
|
.search
|
|
border none
|
|
border-right solid 1px #ccc
|
|
width 160px
|
|
|
|
.fa-search
|
|
position absolute
|
|
top 11px
|
|
right 13px
|
|
cursor pointer
|
|
|
|
.fa-search:hover
|
|
color #cd0216
|
|
|
|
.comment
|
|
font-size 12px
|
|
font-weight 300
|
|
margin-bottom 40px
|
|
overflow hidden
|
|
|
|
ul > li
|
|
width 100%
|
|
line-height 140%
|
|
margin-bottom 15px
|
|
padding-bottom 15px
|
|
border-bottom 1px solid #f0f0f0
|
|
|
|
ul > li:last-child
|
|
margin-bottom 0
|
|
padding-bottom 0
|
|
border-bottom none
|
|
|
|
.meta
|
|
margin-top 10px
|
|
overflow hidden
|
|
white-space nowrap
|
|
text-overflow ellipsis
|
|
|
|
img
|
|
width 100%
|
|
|
|
.posts
|
|
margin-bottom 40px
|
|
|
|
ul > li
|
|
width 100%
|
|
line-height 140%
|
|
margin-bottom 15px
|
|
padding-bottom 15px
|
|
border-bottom 1px solid #f0f0f0
|
|
|
|
ul > li:last-child
|
|
margin-bottom 0
|
|
padding-bottom 0
|
|
border-bottom none
|
|
|
|
.thumbnail
|
|
width 60px
|
|
float left
|
|
padding-top 3px
|
|
|
|
> img
|
|
max-width 100%
|
|
height auto
|
|
|
|
.detail
|
|
margin-left 70px
|
|
font-weight 300
|
|
font-size 12px
|
|
|
|
.tags
|
|
margin-bottom 500px
|
|
|
|
.tagcloud
|
|
width 100%
|
|
|
|
a
|
|
display inline-block
|
|
font-size 12px !important
|
|
font-weight 400
|
|
line-height 1
|
|
text-transform uppercase
|
|
margin 0 5px 10px 0
|
|
padding 5px
|
|
border 1px solid #c0c0c0
|
|
color #666666
|
|
|
|
&:hover
|
|
color #00897b
|
|
|
|
// 文章列表
|
|
.pageList
|
|
.articleList
|
|
background-color #fff
|
|
margin-top 30px
|
|
|
|
.articleImgs
|
|
width 100%
|
|
|
|
img
|
|
width 100%
|
|
|
|
.articleAbstract
|
|
padding 50px 10px
|
|
|
|
pre
|
|
text-align 0.16rem
|
|
overflow-x auto
|
|
line-height 1
|
|
|
|
code
|
|
padding 16px
|
|
|
|
code
|
|
color #24292e
|
|
background-color rgba(27, 31, 35, 0.05)
|
|
border-radius 3px
|
|
font-size 85%
|
|
padding 2px 5px
|
|
|
|
.articleTitle
|
|
text-align center
|
|
font-size 24px
|
|
|
|
.articalMeta
|
|
text-align center
|
|
padding 20px 0
|
|
font-size 12px
|
|
color #a1887f
|
|
|
|
ul
|
|
list-style none
|
|
padding-right 20px
|
|
|
|
> li
|
|
display inline-block
|
|
margin-left 20px
|
|
line-height 2
|
|
|
|
> i
|
|
margin-right 8px
|
|
|
|
> span a
|
|
color #a1887f
|
|
margin-left 10px
|
|
|
|
a span
|
|
color #a1887f
|
|
|
|
> span a:first-child
|
|
margin-left 0
|
|
|
|
> li :first-child
|
|
margin-left 0
|
|
|
|
.articelAbstractContent
|
|
margin-top 20px
|
|
line-height 2
|
|
font-weight 300
|
|
font-size responsive
|
|
|
|
.readMore
|
|
text-align center
|
|
margin 50px auto 20px auto
|
|
|
|
.readMoreBtn
|
|
padding 10px
|
|
border 1px solid #795548
|
|
color #795548
|
|
|
|
&:hover
|
|
color #cd0216
|
|
border 1px solid #cd0216
|
|
|
|
.mobileToc
|
|
transition all 0.4s ease-in-out
|
|
width 25px
|
|
height 25px
|
|
line-height 25px
|
|
text-align center
|
|
font-size 9px
|
|
opacity 0.6
|
|
background-color #000000
|
|
color #ffffff
|
|
position fixed
|
|
right 8px
|
|
bottom 42px
|
|
z-index 999
|
|
padding 4px
|
|
|
|
@media (max-width 768px)
|
|
.header
|
|
position fixed
|
|
z-index 99999
|
|
width 100%
|
|
display block
|
|
box-sizing border-box
|
|
top 0
|
|
height 70px
|
|
background-color #fff
|
|
padding 5px 20px
|
|
|
|
.title
|
|
text-align right
|
|
color #505153
|
|
font-weight 300
|
|
line-height 60px
|
|
font-size 35px
|
|
margin 0
|
|
|
|
.svg
|
|
display block
|
|
float left
|
|
line-height 60px
|
|
padding-top 6px
|
|
cursor pointer
|
|
|
|
#LeftMenu
|
|
display none
|
|
|
|
#rightContent
|
|
margin-left 0
|
|
padding 0 20px
|
|
|
|
.pageList
|
|
.articleList
|
|
margin-top 50px
|
|
|
|
.articleAbstract
|
|
padding 20px
|
|
|
|
blockquote
|
|
margin-top 10px
|
|
margin-bottom 10px
|
|
padding-left 10px
|
|
padding-right 10px
|
|
border-left 3px solid #ccc
|
|
background-color #f1f1f1
|
|
|
|
.articelContent
|
|
a
|
|
color #de8787
|
|
|
|
.toasted-container
|
|
z-index 9999999 !important |