@jinyaoma/vuepress-theme-mustom/styles/index.styl

Simple design theme for VuePress，Blog，耀 の 个人网站 | Mark の Personal Website (QQ Group: 595614161)

@import 'animation'
@import 'skin'

article, aside, blockquote, body, button, code, dd, details, div, dl, dt, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, input, legend, li, menu, nav, ol, p, pre, section, td, textarea, th, ul, a, :before, :after, i
  margin 0
  padding 0
  box-sizing border-box
  transition background 0.6s, opacity 0.6s

html
  font-size $fontSize
  line-height $lineHeight
  scroll-behavior smooth
  overflow-x hidden
  overflow-y scroll

body
  font-family -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif
  -webkit-font-smoothing antialiased
  font-weight 500

::-webkit-scrollbar
  webkitScrollbar()

::-webkit-scrollbar-thumb
  webkitScrollbarThumb()

.fade-enter-active
  transition opacity 0.2s ease

.fade-leave-active
  transition opacity 0.2s ease

.fade-enter, .fade-leave-to
  opacity 0

.slide-fade-enter-active
  transition all 0.2s ease

.slide-fade-leave-active
  transition all 0.2s ease

.slide-fade-enter, .slide-fade-leave-to
  transform translate3d(0, -100%, 0)
  opacity 0

.GlobalLayout
  color var(--txt)
  background var(--bg)
  ::selection
    color var(--bg)
    background var(--selection)

a
  text-decoration none
  color var(--link)
  position relative
  &:before
    content ''
    position absolute
    bottom -2px
    left 0
    height 2px
    width 0
    background var(--underline)
    transition width 0.6s
  &:hover:before
    width 100%

.card
  background var(--bg)
  margin $gap 0
  border-radius $borderRadius
  overflow hidden
  position relative
  transition background 0.6s, height 0.2s
  @media (max-width $smallestWidth)
    margin 0
    border-radius 0
  &.mini
    height 2.3rem !important
    @media (max-width $smallestWidth)
      height 3rem !important
    .minimize:before
      content '\f067'
  .icon
    margin-right 0.5rem

.caption
  font-size 0.8rem
  line-height 1
  background var(--bg)
  @media (max-width $smallestWidth)
    line-height 2
    background var(--highlight)
  padding 0.75rem
  user-select none

.minimize
  position absolute
  top 0
  right 0
  font-size 0.8rem
  line-height 1
  @media (max-width $smallestWidth)
    line-height 2
  padding 0.75rem
  width 2.25rem
  text-align center
  cursor pointer
  font-family 'Font Awesome 5 Free'
  font-weight 900
  @media (max-width $smallestWidth)
    width 100%
    text-align right
  &:before
    content '\f068'

#live2d-widget
  @media (max-width $largeWidth)
    opacity 0.789 !important

.NO_LIVE2D
  #live2d-widget
    display none !important
    opacity 0 !important
    transition opacity 0.6s