Horizontally squish comments

This commit is contained in:
spikecodes 2021-03-10 15:10:59 -08:00
parent f877face80
commit 4a51b7cfb0
No known key found for this signature in database
GPG Key ID: 004CECFF9B463BCB
2 changed files with 62 additions and 45 deletions

View File

@ -8,14 +8,14 @@ authors = ["spikecodes <19519553+spikecodes@users.noreply.github.com>"]
edition = "2018" edition = "2018"
[dependencies] [dependencies]
tide = { version = "0.16.0", default-features = false, features = ["h1-server", "cookies"] } askama = { version = "0.10.5", default-features = false }
async-recursion = "0.3.2"
async-std = { version = "1.9.0", features = ["attributes"] } async-std = { version = "1.9.0", features = ["attributes"] }
async-tls = { version = "0.11.0", default-features = false, features = ["client"] } async-tls = { version = "0.11.0", default-features = false, features = ["client"] }
cached = "0.23.0" cached = "0.23.0"
askama = { version = "0.10.5", default-features = false } clap = { version = "2.33.3", default-features = false }
regex = "1.4.3"
serde = { version = "1.0.124", features = ["derive"] } serde = { version = "1.0.124", features = ["derive"] }
serde_json = "1.0.64" serde_json = "1.0.64"
async-recursion = "0.3.2" tide = { version = "0.16.0", default-features = false, features = ["h1-server", "cookies"] }
regex = "1.4.3"
clap = { version = "2.33.3", default-features = false }
time = "0.2.25" time = "0.2.25"

View File

@ -1115,46 +1115,6 @@ td, th {
/* Mobile */ /* Mobile */
@media screen and (max-width: 480px) {
#version { display: none; }
.post {
grid-template: "post_header post_header post_thumbnail" auto
"post_title post_title post_thumbnail" 1fr
"post_media post_media post_thumbnail" auto
"post_body post_body post_thumbnail" auto
"post_score post_footer post_thumbnail" auto
/ auto 1fr fit-content(min(20%, 152px));
}
.post_score {
margin: 5px 0px 20px 15px;
padding: 0;
}
.compact .post_score { padding: 0; }
.post_score::before { content: "↑" }
.post_header { font-size: 14px; }
.post_footer { margin-left: 15px; }
.replies > .comment {
margin-left: -25px;
padding: 5px 0;
}
.comment_left {
min-width: 45px;
padding: 5px 0px;
}
.comment_author { margin-left: 10px; }
.comment_score { min-width: 35px; }
.comment_data::marker { font-size: 18px; }
.created { width: 100%; }
}
@media screen and (max-width: 800px) { @media screen and (max-width: 800px) {
body { padding-top: 120px } body { padding-top: 120px }
@ -1196,3 +1156,60 @@ td, th {
#logo, #links { margin-bottom: 5px; } #logo, #links { margin-bottom: 5px; }
#searchbox { width: calc(100vw - 35px); } #searchbox { width: calc(100vw - 35px); }
} }
@media screen and (max-width: 480px) {
body { padding-top: 100px; }
#version { display: none; }
.post {
grid-template: "post_header post_header post_thumbnail" auto
"post_title post_title post_thumbnail" 1fr
"post_media post_media post_thumbnail" auto
"post_body post_body post_thumbnail" auto
"post_score post_footer post_thumbnail" auto
/ auto 1fr fit-content(min(20%, 152px));
}
.post_score {
margin: 5px 0px 20px 15px;
padding: 0;
}
.compact .post_score { padding: 0; }
.post_score::before { content: "↑" }
.post_header { font-size: 14px; }
.post_footer { margin-left: 15px; }
.replies > .comment {
margin-left: -12px;
padding: 5px 0;
}
.comment_left {
min-width: auto;
padding: 5px 0px;
align-items: initial;
margin-top: -5px;
}
.line {
margin-left: 5px;
}
/* .thread { margin-left: -5px; } */
.comment_right { padding: 5px 0 10px 2px; }
.comment_author { margin-left: 5px; }
.comment_data { margin-left: 12px; }
.comment_data::marker { font-size: 22px; }
.created { width: 100%; }
.comment_score {
min-width: 32px;
height: 20px;
font-size: 15px;
padding: 7px 0px;
margin-right: -5px;
}
}