diff --git a/assets/css/_common/components/post/post-followme.scss b/assets/css/_common/components/post/post-followme.scss index 5de4f6a..1461877 100644 --- a/assets/css/_common/components/post/post-followme.scss +++ b/assets/css/_common/components/post/post-followme.scss @@ -13,6 +13,10 @@ .social-item { margin: .5em 2em; + a:hover { + font-weight: bold; + } + @include tablet-mobile() { margin: .5em .75em; } diff --git a/assets/css/_common/scaffolding/comments.scss b/assets/css/_common/scaffolding/comments.scss index ef1b8db..a0402cd 100644 --- a/assets/css/_common/scaffolding/comments.scss +++ b/assets/css/_common/scaffolding/comments.scss @@ -39,9 +39,10 @@ } .post-comments { - @if $scheme != 'Gemini' { + @if $scheme !='Gemini' { margin-top: 60px; } + overflow: hidden; .comment-head { @@ -54,54 +55,101 @@ font-size: 1.4em; } - .comment-switch { - display: inline-block; - float: right; - margin: 2px auto; - padding: 4px 16px; - width: max-content; - border-radius: 8px; - background: #eee; - - .switch-btn { - position: relative; + @if $two_comments_enable { + .comment-switch { display: inline-block; - margin: -4px 8px 0; - width: 42px; - height: 22px; - border-radius: 34px; - vertical-align: middle; - cursor: pointer; - -webkit-transition: .4s; - -moz-transition: .4s; - -o-transition: .4s; - -ms-transition: .4s; - transition: .4s; + float: right; + margin: 2px auto; + padding: 4px 16px; + width: max-content; + border-radius: 8px; + background: #eee; - &:before { - position: absolute; - bottom: 4px; - left: 4px; - width: 14px; - height: 14px; - border-radius: 50%; - content: ''; - background-color: #fff; + .first-comment { + color: $first_comment_color; + + @if $two_comments_actived==$first_comment_name { + font-weight: bold; + } + } + + .second-comment { + color: $second_comment_color; + + @if $two_comments_actived==$second_comment_name { + font-weight: bold; + } + } + + $switch_btn_bg_color: $first_comment_color; + + .switch-btn { + position: relative; + display: inline-block; + margin: -4px 8px 0; + width: 42px; + height: 22px; + border-radius: 34px; + vertical-align: middle; + cursor: pointer; -webkit-transition: .4s; -moz-transition: .4s; -o-transition: .4s; -ms-transition: .4s; - transition: .4s - } + transition: .4s; - &.move:before { - -webkit-transform: translateX(20px); - -moz-transform: translateX(20px); - -o-transform: translateX(20px); - -ms-transform: translateX(20px); - transform: translateX(20px); + @if $two_comments_actived==$second_comment_name { + $switch_btn_bg_color: $second_comment_color; + } + + background-color: $switch_btn_bg_color; + + &:before { + position: absolute; + bottom: 4px; + left: 4px; + width: 14px; + height: 14px; + border-radius: 50%; + content: ''; + background-color: #fff; + -webkit-transition: .4s; + -moz-transition: .4s; + -o-transition: .4s; + -ms-transition: .4s; + transition: .4s + } + + &.move:before { + -webkit-transform: translateX(20px); + -moz-transform: translateX(20px); + -o-transform: translateX(20px); + -ms-transform: translateX(20px); + transform: translateX(20px); + } } } } } -} + + @if $two_comments_enable { + $first_comment_display: none; + $second_comment_display: none; + + @if $two_comments_actived==$first_comment_name { + $first_comment_display: block; + } + + @if $two_comments_actived==$second_comment_name { + $second_comment_display: block; + } + + .comment-wrap>div:nth-child(1) { + display: $first_comment_display; + } + + .comment-wrap>div:nth-child(2) { + display: $second_comment_display; + } + } +} \ No newline at end of file diff --git a/assets/css/main.scss b/assets/css/main.scss index c0f162c..9d5da10 100644 --- a/assets/css/main.scss +++ b/assets/css/main.scss @@ -121,6 +121,18 @@ $disqusjs_enable: {{ $P.disqusjs.enable }}; $livere_enable: {{ $P.livere.enable }}; $utterances_enable: {{ $P.utterances.enable }}; $waline_enable: {{ $P.waline.enable }}; +{{- with .Site.Params.comments }} +{{ $tce := and (isset . "nav") (and .storage (gt (len .nav) 1)) }} +$two_comments_enable: {{ $tce }}; +{{- if $tce }} +{{- $sortNav := sort .nav "weight" }} +$two_comments_actived: {{ .active }}; +$first_comment_color: {{ (index $sortNav 0).color }}; +$first_comment_name: {{ lower (index $sortNav 0).name }}; +$second_comment_color: {{ (index $sortNav 1).color }}; +$second_comment_name: {{ lower (index $sortNav 1).name }}; +{{- end }} +{{- end }} // // Variables Layer diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index efefffc..c28859c 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -4,8 +4,6 @@ {{- $pluginVen := .Site.Params.vendors.plugins -}} {{- $pluginCDN := index $vendors $pluginVen -}} {{- .Scratch.Set "pluginCDN" $pluginCDN -}} -{{ $posts := len (where .Page.Site.RegularPages "Section" "in" .Site.Params.mainSections) }} -{{- .Scratch.Set "posts" $posts -}} diff --git a/layouts/partials/comments.html b/layouts/partials/comments.html index 79f8044..694a149 100644 --- a/layouts/partials/comments.html +++ b/layouts/partials/comments.html @@ -16,23 +16,6 @@ {{- $sn = (sort .nav "weight") }} {{- $fc = index $sn 0 }} {{- $sc = index $sn 1 }} -