Comments: improve appearance
This commit is contained in:
parent
0f10ef2979
commit
7e7f71bb96
|
@ -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>
|
||||||
|
|
||||||
|
|
|
@ -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 %}
|
||||||
|
|
|
@ -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;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -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 {
|
||||||
|
|
Loading…
Reference in New Issue