Comments: improve appearance

This commit is contained in:
Rico Sta. Cruz 2017-09-02 03:51:45 +08:00
parent 0f10ef2979
commit 7e7f71bb96
No known key found for this signature in database
GPG Key ID: CAAD38AE2962619A
4 changed files with 17 additions and 16 deletions

View File

@ -3,13 +3,13 @@
<details class='comments-details'> <details class='comments-details'>
<summary> <summary>
<strong class='count'> <strong class='count'>
<span class='disqus-comment-count' data-disqus-url='{{ site.url }}{{ include.page.url | remove: '.html' }}#disqus_thread'></span> <span class='disqus-comment-count' data-disqus-url='{{ site.url }}{{ include.page.url | remove: '.html' }}#disqus_thread'>Comments</span>
</strong> </strong>
</summary> </summary>
<div class='comments-section'> <div class='comments-section'>
<div class='comments'> <div class='comments'>
<div id='disqus_thread'></div> <div id='disqus_thread'></div>
<noscript data-js-disqus='{"host":"{{ site.disqus_host }}","url":"{{ site.url }}{{ include.page.url | remove: '.html' }}","identifier": "{{ include.page.url | remove: '.html' | remove_first: '/' }}"}'></noscript> <noscript data-js-disqus='{"host":"{{ site.disqus_host }}","url":"{{ site.url }}{{ include.page.url | remove: '.html' }}","identifier":"{{ include.page.url | remove: '.html' | remove_first: '/' }}"}'></noscript>
</div> </div>
</div> </div>
</details> </details>
@ -17,4 +17,3 @@
</section> </section>
<script id='dsq-count-scr' src='//{{ site.disqus_host }}/count.js' async></script> <script id='dsq-count-scr' src='//{{ site.disqus_host }}/count.js' async></script>

View File

@ -26,12 +26,12 @@ type: article
</main> </main>
</div> </div>
<div class='pre-footer'><i class='icon'></i></div>
{% if site.disqus_host %} {% if site.disqus_host %}
{% include 2017/comments-area.html page=page %} {% include 2017/comments-area.html page=page %}
{% endif %} {% endif %}
<div class='pre-footer'><i class='icon'></i></div>
{% include 2017/search-footer.html %} {% include 2017/search-footer.html %}
{% include 2017/related-posts.html page=page %} {% include 2017/related-posts.html page=page %}
{% include 2017/foot.html %} {% include 2017/foot.html %}

View File

@ -4,13 +4,23 @@
.comments-area { .comments-area {
& { & {
margin: 32px 0; margin: 32px 0 16px 0;
} }
// Container
& > .container { & > .container {
@include gutter(padding-left); @include gutter(padding-left);
@include gutter(padding-right); @include gutter(padding-right);
max-width: $area-width; max-width: $area-width;
margin: 0 auto; margin: 0 auto;
} }
// Horizontal line
& > .container::before {
content: '';
display: block;
background: linear-gradient(to right, $dark-line-color 50%, transparent);
margin-bottom: 16px;
height: 1px;
}
} }

View File

@ -7,15 +7,7 @@
margin-bottom: 16px; margin-bottom: 16px;
white-space: nowrap; white-space: nowrap;
cursor: pointer; cursor: pointer;
color: $base-text; color: $base-head;
}
& > summary::after {
content: '';
display: block;
background: linear-gradient(to right, $dark-line-color 50%, transparent);
margin-top: 16px;
height: 1px;
} }
& > summary:hover, & > summary:hover,
@ -25,7 +17,7 @@
& > summary > strong { & > summary > strong {
@include font-size(1); @include font-size(1);
font-weight: normal; font-weight: bold;
} }
& > summary > strong::before { & > summary > strong::before {