hexo-theme-volantis/source/css/_defines/layout.styl

Elegant and powerful theme for Hexo.

// device defines
$device-mobile-s = 320px
$device-mobile-m = 375px
$device-mobile-l = 425px
$device-mobile = 500px
$device-tablet = 768px
$device-laptop = 1024px
$device-desktop = 1440px
$device-2k = 2048px
$device-4k = 2560px


// site layout
$layout-width = convert(hexo-config('custom_css.max_width')) || 1080px
$sidebar = 240px
$modal-threshold = 680px
$navbar-height = convert(hexo-config('custom_css.navbar.height')) || 64px

// gap
$gap = convert(hexo-config('custom_css.gap.base')) || 16px // base gap
$gap-h2 = convert(hexo-config('custom_css.gap.h2')) || 48px
$gap-h3 = convert(hexo-config('custom_css.gap.h3')) || 32px
$gap-h4 = convert(hexo-config('custom_css.gap.h4')) || 16px
// 新的段落间距，以实际字体大小为基准
$gap-p = convert(hexo-config('custom_css.gap.p')) || 1em



// border width
$border-line = 2px

// border radius
$border-card = convert(hexo-config('custom_css.border_radius.card')) || 12px
$border-codeblock = convert(hexo-config('custom_css.border_radius.codeblock')) || 4px
$border-searchbar = convert(hexo-config('custom_css.border_radius.searchbar')) || 8px
$border-button = convert(hexo-config('custom_css.border_radius.button')) || 2px

// text align
$textalign-h1 = convert(hexo-config('custom_css.body.text_align.h1')) || left
$textalign-h2 = convert(hexo-config('custom_css.body.text_align.h2')) || left
$textalign-h3 = convert(hexo-config('custom_css.body.text_align.h3')) || left
$textalign-h4 = convert(hexo-config('custom_css.body.text_align.h4')) || left
$textalign-p = convert(hexo-config('custom_css.body.text_align.p')) || justify