aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/mixins/post.pug5
-rw-r--r--src/public/styles.css14
-rw-r--r--src/views/comments.pug6
3 files changed, 17 insertions, 8 deletions
diff --git a/src/mixins/post.pug b/src/mixins/post.pug
index 9dd0748..287c422 100644
--- a/src/mixins/post.pug
+++ b/src/mixins/post.pug
@@ -32,6 +32,9 @@ mixin post(p)
32 else if p.post_hint == "hosted:video" 32 else if p.post_hint == "hosted:video"
33 - var url = p.secure_media.reddit_video.scrubber_media_url 33 - var url = p.secure_media.reddit_video.scrubber_media_url
34 video(src=url data-dashjs-player width='100px' height='100px' onclick=`toggleDetails('${p.id}')`) 34 video(src=url data-dashjs-player width='100px' height='100px' onclick=`toggleDetails('${p.id}')`)
35 else if !p.selftext
36 a(href=p.url)
37 | ↗
35 38
36 if p.is_gallery && p.is_gallery == true 39 if p.is_gallery && p.is_gallery == true
37 if p.gallery_data 40 if p.gallery_data
@@ -65,7 +68,7 @@ mixin post(p)
65 - var url = p.secure_media.reddit_video.dash_url 68 - var url = p.secure_media.reddit_video.dash_url
66 video(src=url controls data-dashjs-player loading="lazy").post-media 69 video(src=url controls data-dashjs-player loading="lazy").post-media
67 button(onclick=`toggleDetails('${p.id}')`) close 70 button(onclick=`toggleDetails('${p.id}')`) close
68 else if p.post_hint == "link" && p.thumbnail && p.thumbnail != "self" && p.thumbnail != "default" 71 else if !p.post_hint || (p.post_hint == "link" && p.thumbnail && p.thumbnail != "self" && p.thumbnail != "default")
69 details(id=`${p.id}`) 72 details(id=`${p.id}`)
70 summary expand link 73 summary expand link
71 a(href=`${p.url}`) 74 a(href=`${p.url}`)
diff --git a/src/public/styles.css b/src/public/styles.css
index b9da7a1..4dc2740 100644
--- a/src/public/styles.css
+++ b/src/public/styles.css
@@ -3,6 +3,7 @@
3:root { 3:root {
4 /* Light mode colors */ 4 /* Light mode colors */
5 --bg-color: white; 5 --bg-color: white;
6 --bg-color-muted: #eee;
6 --text-color: black; 7 --text-color: black;
7 --text-color-muted: #999; 8 --text-color-muted: #999;
8 --blockquote-color: green; 9 --blockquote-color: green;
@@ -13,6 +14,7 @@
13@media (prefers-color-scheme: dark) { 14@media (prefers-color-scheme: dark) {
14 :root { 15 :root {
15 --bg-color: black; 16 --bg-color: black;
17 --bg-color-muted: #333;
16 --text-color: white; 18 --text-color: white;
17 --text-color-muted: #999; 19 --text-color-muted: #999;
18 --blockquote-color: green; 20 --blockquote-color: green;
@@ -230,7 +232,7 @@ hr {
230.post-media { 232.post-media {
231 display: block; 233 display: block;
232 margin: 0 auto; 234 margin: 0 auto;
233 max-width: 85%; 235 max-width: 95%;
234 padding: 5px; 236 padding: 5px;
235} 237}
236 238
@@ -249,6 +251,10 @@ hr {
249 text-decoration: none; 251 text-decoration: none;
250} 252}
251 253
254.title-container > a:hover {
255 text-decoration: underline;
256}
257
252.title-container > a:visited { 258.title-container > a:visited {
253 color: var(--text-color-muted) 259 color: var(--text-color-muted)
254} 260}
@@ -269,7 +275,7 @@ blockquote {
269} 275}
270 276
271pre, code { 277pre, code {
272 background: #eee; 278 background: var(--bg-color-muted);
273} 279}
274 280
275pre { 281pre {
@@ -308,17 +314,15 @@ a {
308 display: flex; 314 display: flex;
309 overflow-x: auto; 315 overflow-x: auto;
310 position: relative; 316 position: relative;
311 scroll-snap-type: x mandatory;
312 padding: 5px; 317 padding: 5px;
313} 318}
314 319
315.gallery-item { 320.gallery-item {
316 flex: 0 0 auto; 321 flex: 0 0 auto;
317 scroll-snap-align: start;
318 margin-right: 10px; 322 margin-right: 10px;
319} 323}
320 324
321.gallery img { 325.gallery img {
322 width: auto; 326 width: auto;
323 height: 300px; 327 max-height: 500px;
324} 328}
diff --git a/src/views/comments.pug b/src/views/comments.pug
index 9d02a01..8d5acf3 100644
--- a/src/views/comments.pug
+++ b/src/views/comments.pug
@@ -36,8 +36,8 @@ html
36 else if post.post_hint == 'hosted:video' 36 else if post.post_hint == 'hosted:video'
37 - var url = post.secure_media.reddit_video.dash_url 37 - var url = post.secure_media.reddit_video.dash_url
38 video(controls data-dashjs-player src=`${url}`).post-media 38 video(controls data-dashjs-player src=`${url}`).post-media
39 else if post.post_hint == "link" && post.thumbnail && post.thumbnail != "self" && post.thumbnail != "default" 39 else if !post.selftext
40 a(href=`${post.url}`) 40 a(href=post.url)
41 | #{post.url} 41 | #{post.url}
42 42
43 if post.selftext_html 43 if post.selftext_html
@@ -47,6 +47,8 @@ html
47 p 47 p
48 | #{fmtnum(post.ups)} ↑ 48 | #{fmtnum(post.ups)} ↑
49 |  ·  by u/#{post.author} 49 |  ·  by u/#{post.author}
50 |  · 
51 | #{timeDifference(Date.now(), post.created * 1000)}
50 52
51 hr 53 hr
52 54