blog/docs/.vuepress/theme/styles/theme.styl

223 lines
4.2 KiB
Stylus

@require './code'
@require './custom-blocks'
@require './arrow'
@require './wrapper'
@require './toc'
html, body
padding 0
margin 0
body
font-family Ubuntu, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif
-webkit-font-smoothing antialiased
-moz-osx-font-smoothing grayscale
font-size 15px
color var(--text-color)
background-color var(--background-color)
.page, .password-wrapper-in
overflow-x: hidden
margin-left $sidebarWidth
.navbar
position fixed
z-index 20
top 0
left 0
right 0
height $navbarHeight
box-sizing border-box
.sidebar-mask
position fixed
z-index 9
top 0
left 0
width 100vw
height 100vh
display none
background-color: rgba(0,0,0,.65);
.sidebar
font-size 16px
background-color var(--background-color)
width $sidebarWidth
position fixed
z-index 10
margin 0
top $navbarHeight
left 0
bottom 0
box-sizing border-box
border-right 1px solid var(--border-color)
overflow-y auto
.content__default:not(.custom)
@extend $wrapper
a:hover
text-decoration underline
p.demo
padding 1rem 1.5rem
border 1px solid #ddd
border-radius 4px
img
max-width 100%
*:first-child
margin-top 0
.content__default.custom
padding 0
margin 0
img
max-width 100%
.abstract
img
max-width 100%
a
font-weight 500
color $accentColor
text-decoration none
p a code
font-weight 400
color $accentColor
kbd
background #eee
border solid 0.15rem #ddd
border-bottom solid 0.25rem #ddd
border-radius 0.15rem
padding 0 0.15em
blockquote
font-size .9rem
color #999
border-left .25rem solid #999
background-color var(--code-color)
margin 0.5rem 0
padding .25rem 0 .25rem 1rem
& > p
margin 0
ul, ol
padding-left 1.2em
strong
font-weight 600
h1, h2, h3, h4, h5, h6
font-weight 500
line-height 1.25
.content__default:not(.custom) > &
margin-top (2.1rem - $navbarHeight)
padding-top $navbarHeight
margin-bottom 1rem
&:first-child
margin-top -3.5rem
h1
font-size 1.6rem
h2
font-size 1.4rem
h3
font-size 1.2rem
a.header-anchor
font-size 0.85em
float left
margin-left -0.87em
padding-right 0.23em
margin-top 0.125em
opacity 0
&:hover
text-decoration none
code, kbd, .line-number
font-family source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace
p, ul, ol
line-height 2.2
hr
border 0
border-top 1px solid var(--border-color)
table
border-collapse collapse
margin 1rem 0
display: block
overflow-x: auto
tr
border-top 1px solid var(--border-color)
&:nth-child(2n)
background-color var(--code-color)
th, td
border 1px solid var(--border-color)
padding .6em 1em
.theme-container
&.sidebar-open
.sidebar-mask
display: block
&.no-navbar
.content__default:not(.custom) > h1, h2, h3, h4, h5, h6
margin-top 1.5rem
padding-top 0
.sidebar
top 0
@media (min-width: ($MQMobile + 1px))
.theme-container.no-sidebar
.sidebar
display none
.page, .password-wrapper-in
margin-left 0
@require 'mobile.styl'
.iconfont
font-family: "iconfont",Ubuntu,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif !important
font-size: 13px;
color: var(--text-color-sub);
/************** **************/
::-webkit-scrollbar
width: 5px;
height: 5px;
::-webkit-scrollbar-track-piece
// background-color: rgba(0, 0, 0, 0.2);
::-webkit-scrollbar-thumb:vertical
height: 5px;
background-color: $accentColor;
::-webkit-scrollbar-thumb:horizontal
width: 5px;
background-color: $accentColor;
/************** **************/
.vuepress-flowchart
overflow: auto
/************** SW-Update Popup **************/
.sw-update-popup
border-radius: $borderRadius!important;
box-shadow: var(--box-shadow)!important;
color: var(--text-color)!important;
background: var(--background-color)!important;
border: none!important;
> button
background: $accentColor;
border-radius: $borderRadius;
color: #fff;
-webkit-tap-highlight-color:rgba(0, 0, 0, 0)
border: none;