diff --git a/include/style/article.styl b/include/style/article.styl index 4ea7a22..ddd4864 100644 --- a/include/style/article.styl +++ b/include/style/article.styl @@ -5,6 +5,33 @@ $article-font-size ?= 1.1rem article &.media + color: $text-light + + a + color: inherit + + &:hover + color: $primary + + .image + width: 64px + height: 64px + + img + object-fit: cover + width: 100% + height: 100% + + .title + @extend .is-size-6 + margin-bottom: .25em + + .date, .categories + @extend .is-size-7 + + .categories + @extend .is-uppercase + .media-content color: $text-light @@ -60,10 +87,11 @@ article footer strong + cite margin-left: .5em - + .message.message-immersive border-radius: 0 - margin: 0 0-($card-content-padding) $card-content-padding 0-($card-content-padding) + margin: 0 0 - $card-content-padding $card-content-padding 0 - $card-content-padding + .message-body border: none @@ -116,7 +144,7 @@ article content: '\f25e' font-size: 200px font-family: 'Font Awesome 5 Brands' - opacity: 0.1 + opacity: .1 .level-left flex-wrap: wrap @@ -130,7 +158,7 @@ article @extend .mb-1 a - @extend .size-small, .has-text-grey + @extend .is-size-7, .has-text-grey .licensing-meta .level-item @@ -144,8 +172,8 @@ article vertical-align: bottom h6 - @extend .size-small - + @extend .is-size-7 + a color: inherit @@ -156,6 +184,7 @@ a flex-shrink: 1 word-wrap: break-word white-space: normal + &.article-nav-next span text-align: right diff --git a/include/style/base.styl b/include/style/base.styl index c0093a7..6c3bbb9 100644 --- a/include/style/base.styl +++ b/include/style/base.styl @@ -9,6 +9,9 @@ $body-background-color ?= #f7f7f7 $family-sans-serif ?= Ubuntu, Roboto, 'Open Sans', 'Microsoft YaHei', sans-serif $family-code ?= 'Source Code Pro', monospace, 'Microsoft YaHei' +$size-7 ?= .85rem +$size-small ?= .75rem + $primary ?= $blue $custom-colors ?= { grey-lightest: { diff --git a/include/style/donate.styl b/include/style/donate.styl index 82499fa..b5324fd 100644 --- a/include/style/donate.styl +++ b/include/style/donate.styl @@ -5,6 +5,15 @@ $donate-qrcode-max-width ?= 280px $donate-qrcode-shadow ?= $card-shadow $donate-qrcode-box-radius ?= $card-radius +$donate-button-colors ?= { + 'afdian': rgb(136, 95, 217), + 'alipay': rgb(0, 160, 232), + 'buymeacoffee': rgb(255, 221, 0), + 'paypal': rgb(254, 183, 0), + 'patreon': rgb(255, 66, 77), + 'wechat': rgb(26, 173, 25), +} + .donate position: relative @@ -32,3 +41,18 @@ $donate-qrcode-box-radius ?= $card-radius &:last-child:not(:first-child) .qrcode right: -.75rem + + for $name, $color in $donate-button-colors + &[data-type={'"' + $name + '"'}] + color: findColorInvert($color) + background-color: $color + border-color: transparent + + &:active + background-color: darken($color, 5%) + + &:hover + background-color: darken($color, 2.5%) + + &:focus:not(:active) + box-shadow: 0 0 0 .125em rgba($color, .25) diff --git a/include/style/helper.styl b/include/style/helper.styl index dbc74ff..84f1141 100644 --- a/include/style/helper.styl +++ b/include/style/helper.styl @@ -138,15 +138,6 @@ for n in (0 .. 5) &:hover color: $primary !important -/* --------------------------------- - * Font helpers - * --------------------------------- */ -.size-small - font-size: .85rem !important - -.line-height-inherit - line-height: inherit !important - /* --------------------------------- * Image helpers * --------------------------------- */ diff --git a/include/style/pagination.styl b/include/style/pagination.styl index 28428c7..33d21d0 100644 --- a/include/style/pagination.styl +++ b/include/style/pagination.styl @@ -6,6 +6,9 @@ $pagination-background-color ?= $button-background-color $post-navigation-fg ?= $grey .pagination + @extend .pagination.is-centered + margin-top: 1.5rem + .pagination-link, .pagination-ellipsis, .pagination-previous, diff --git a/include/style/widget.styl b/include/style/widget.styl new file mode 100644 index 0000000..172a7bf --- /dev/null +++ b/include/style/widget.styl @@ -0,0 +1,27 @@ +.widget + .menu-list + li + ul + margin-right: 0 + + .level + margin-bottom: 0 + + .level-left, .level-right, .level-item + flex-shrink: 1 + + .level-left, .level-right + align-items: flex-start + + .tag + background: $light-grey + color: $white-invert + + .tags + .tag:first-child + background: $primary + color: $primary-invert + + .tag:last-child + background: $light-grey + color: $white-invert diff --git a/layout/common/article.jsx b/layout/common/article.jsx index 3deba8f..020d96c 100644 --- a/layout/common/article.jsx +++ b/layout/common/article.jsx @@ -40,7 +40,7 @@ module.exports = class extends Component { : null} {/* Metadata */}
- {page.layout !== 'page' ?
+ {page.layout !== 'page' ?
{/* Creation Date */} {page.date && : null} {/* Tags */} - {!index && page.tags && page.tags.length ?
+ {!index && page.tags && page.tags.length ?
# {page.tags.map(tag => { return ; })}
: null} {/* "Read more" button */} - {index && page.excerpt ? {__('article.more')} : null} + {index && page.excerpt ? {__('article.more')} : null} {/* Share button */} {!index ? : null}
diff --git a/layout/common/footer.jsx b/layout/common/footer.jsx index deebda3..9027107 100644 --- a/layout/common/footer.jsx +++ b/layout/common/footer.jsx @@ -33,7 +33,7 @@ class Footer extends Component { -

+

  Powered by Hexo &  Icarus diff --git a/layout/widget/profile.jsx b/layout/widget/profile.jsx index bd5002f..bb6d2cb 100644 --- a/layout/widget/profile.jsx +++ b/layout/widget/profile.jsx @@ -29,7 +29,7 @@ class Profile extends Component { followTitle, socialLinks } = this.props; - return

+ return