forked from shadowfacts/shadowfacts.net
Tweak comment styles
This commit is contained in:
parent
43a3fc1a69
commit
1f28d6263c
|
@ -42,6 +42,7 @@ body {
|
|||
article {
|
||||
margin-bottom: 75px;
|
||||
color: var(--content-text-color);
|
||||
border-bottom: 1px solid var(--accent-color);
|
||||
|
||||
@media (min-width: 768px) {
|
||||
a::before { content: "["; }
|
||||
|
@ -81,14 +82,6 @@ article {
|
|||
color: var(--secondary-ui-text-color);
|
||||
}
|
||||
|
||||
&::after {
|
||||
content: "";
|
||||
width: calc(100% - 2 * 30px); // account for .container padding, don't overflow
|
||||
height: 1px;
|
||||
background-color: var(--accent-color);
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.article-title {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 0;
|
||||
|
@ -147,26 +140,31 @@ article {
|
|||
}
|
||||
|
||||
#comments-container {
|
||||
.comments-list {
|
||||
margin-top: 0px;
|
||||
padding-left: 0px;
|
||||
}
|
||||
border-bottom: 1px solid var(--accent-color);
|
||||
padding-bottom: 55px;
|
||||
|
||||
.comment-user-avatar {
|
||||
width: 50px;
|
||||
border-radius: 5px;
|
||||
float: left;
|
||||
margin-right: 10px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.comment-info {
|
||||
margin-top: 0px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
.comments-list {
|
||||
margin-top: 0px;
|
||||
padding-left: 0px;
|
||||
}
|
||||
|
||||
.comment-children {
|
||||
margin-left: 50px;
|
||||
margin-top: 20px;
|
||||
.comment-info {
|
||||
margin-top: 0px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.comment-children {
|
||||
margin-left: 60px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -399,21 +397,16 @@ figure {
|
|||
|
||||
// Footer
|
||||
.site-footer {
|
||||
padding-top: 20px;
|
||||
padding-bottom: 20px;
|
||||
margin-top: 75px;
|
||||
margin-bottom: 20px;
|
||||
background-color: var(--ui-background-color);
|
||||
font-size: 16px;
|
||||
|
||||
> div {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
flex-wrap: wrap;
|
||||
|
||||
padding-top: 10px;
|
||||
// border-top: 3px solid var(--accent-color);
|
||||
}
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.site-title {
|
||||
margin: 0;
|
||||
|
@ -463,6 +456,10 @@ figure {
|
|||
.pagination {
|
||||
text-align: center;
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.pagination-link {
|
||||
color: var(--accent-color);
|
||||
|
||||
|
|
|
@ -69,7 +69,7 @@
|
|||
</div>
|
||||
|
||||
<footer class="site-footer container">
|
||||
<div>
|
||||
<!-- <div> -->
|
||||
<div>
|
||||
<h2 class="site-title">Shadowfacts</h2>
|
||||
<p class="ui-controls">
|
||||
|
@ -91,7 +91,7 @@
|
|||
<li><%- fancyLink("Mastodon", "https://social.shadowfacts.net/users/shadowfacts", "rel=me") %></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
|
||||
<script>
|
||||
(() => {
|
||||
|
|
Loading…
Reference in New Issue