diff --git a/source/css/_common/outline/header/site-meta.styl b/source/css/_common/outline/header/site-meta.styl index 2c7c749..54dabc0 100644 --- a/source/css/_common/outline/header/site-meta.styl +++ b/source/css/_common/outline/header/site-meta.styl @@ -19,7 +19,7 @@ border-bottom: 0; color: var(--brand-color); display: inline-block; - padding: 0 40px; + padding: $brand-padding; &:hover { color: var(--brand-hover-color); @@ -37,7 +37,7 @@ .site-subtitle { color: $subtitle-color; font-size: $font-size-subtitle; - margin: 10px 0; + margin: $site-subtitle-margin; } .use-motion { diff --git a/source/css/_mixins.styl b/source/css/_mixins.styl index f99e5d3..e12b4cf 100644 --- a/source/css/_mixins.styl +++ b/source/css/_mixins.styl @@ -111,6 +111,10 @@ main-container() { margin: 0 auto; width: $content-desktop; + +mobile() { + width: auto; + } + +desktop-large() { width: $content-desktop-large; } diff --git a/source/css/_schemes/Mist/_header.styl b/source/css/_schemes/Mist/_header.styl index 2d6543f..2e08af6 100644 --- a/source/css/_schemes/Mist/_header.styl +++ b/source/css/_schemes/Mist/_header.styl @@ -19,8 +19,6 @@ line-height: normal; .brand { - padding: 2px 1px; - +mobile() { display: block; } diff --git a/source/css/_schemes/Muse/_layout.styl b/source/css/_schemes/Muse/_layout.styl index 1aa9783..6ffabaf 100644 --- a/source/css/_schemes/Muse/_layout.styl +++ b/source/css/_schemes/Muse/_layout.styl @@ -4,6 +4,7 @@ .main-inner { main-container(); + padding-bottom: $content-padding-bottom; +mobile() { padding-left: 20px; @@ -11,18 +12,8 @@ } } -.header, .main-inner, .footer-inner { - +mobile() { - width: auto; - } -} - // Page - Container // -------------------------------------------------- -.main-inner { - padding-bottom: $content-padding-bottom; -} - .post-block:first-of-type { padding-top: $posts-first-padding; diff --git a/source/css/_schemes/Pisces/_header.styl b/source/css/_schemes/Pisces/_header.styl index 566ee52..6716886 100644 --- a/source/css/_schemes/Pisces/_header.styl +++ b/source/css/_schemes/Pisces/_header.styl @@ -20,14 +20,6 @@ padding: 20px 0; } -.brand { - padding: 0; -} - -.site-subtitle { - margin: 10px 10px 0; -} - .site-nav-toggle, .site-nav-right { +tablet() { flex-column(); diff --git a/source/css/_variables/Mist.styl b/source/css/_variables/Mist.styl index 1eb7e52..c0d5ca2 100644 --- a/source/css/_variables/Mist.styl +++ b/source/css/_variables/Mist.styl @@ -15,6 +15,7 @@ $menu-item-bg-color = $grey-lighter; $brand-color = $black-deep; $brand-hover-color = $brand-color; +$brand-padding = 2px 1px; $posts-collapse-left = 0; diff --git a/source/css/_variables/Pisces.styl b/source/css/_variables/Pisces.styl index 7442ea8..7ec4253 100644 --- a/source/css/_variables/Pisces.styl +++ b/source/css/_variables/Pisces.styl @@ -26,6 +26,9 @@ $border-radius = initial; // Header // -------------------------------------------------- $subtitle-color = $grey-lighter; +$brand-padding = 0; +$site-subtitle-margin = 10px 10px 0; + // Sidebar // -------------------------------------------------- diff --git a/source/css/_variables/base.styl b/source/css/_variables/base.styl index 271b1ea..96515f8 100644 --- a/source/css/_variables/base.styl +++ b/source/css/_variables/base.styl @@ -213,6 +213,9 @@ $brand-color = white; $brand-hover-color = white; $brand-color-dark = $grey-lighter; $brand-hover-color-dark = $grey-lighter; +$brand-padding = 0 40px; + +$site-subtitle-margin = 10px 0; $font-size-title = (hexo-config('font.enable') and hexo-config('font.title.size') is a 'unit') ? unit(hexo-config('font.title.size'), em) : 1.375em; $font-size-subtitle = $font-size-smaller;