jyapayne/nimforum
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Make mobile viewing more friendly

Browse source
This commit is contained in:
Joey Yakimowich-Payne 2020-03-05 17:14:02 -07:00
commit eee155f343
3 changed files with 20 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

10
public/css/nimforum.scss
View file

@ -51,6 +51,7 @@ $logo-height: $navbar-height - 20px;
// Unfortunately we must colour the controls in the navbar manually. // Unfortunately we must colour the controls in the navbar manually.
.search-input { .search-input {
@extend .form-input; @extend .form-input;
min-width: 120px;
border-color: $navbar-border-color-dark; border-color: $navbar-border-color-dark;
} }
@ -128,6 +129,9 @@ $logo-height: $navbar-height - 20px;
} }
.category-status { .category-status {
font-size: small;
font-weight: bold;
.topic-count { .topic-count {
margin-left: 5px; margin-left: 5px;
opacity: 0.7; opacity: 0.7;
@ -258,7 +262,7 @@ $threads-meta-color: #545d70;
.category-color { .category-color {
width: 0; width: 0;
height: 0; height: 0;
border: 0.3rem solid $default-category-color; border: 0.25rem solid $default-category-color;
display: inline-block; display: inline-block;
margin-right: 5px; margin-right: 5px;
} }
@ -297,6 +301,10 @@ $threads-meta-color: #545d70;
} }
} }
.thread-replies, .thread-time, .thread-users, .views-text, .centered-header {
text-align: center;
}
.thread-time { .thread-time {
color: $threads-meta-color; color: $threads-meta-color;

2
src/frontend/category.nim
View file

@ -36,7 +36,7 @@ when defined(js):
tdiv(class="category-color", tdiv(class="category-color",
style=style( style=style(
(StyleAttr.border, (StyleAttr.border,
kstring"0.3rem solid #" & category.color) kstring"0.25rem solid #" & category.color)
)) ))
span(class="category-name"): span(class="category-name"):
text category.name text category.name

23
src/frontend/threadlist.nim
View file

@ -74,7 +74,7 @@ when defined(js):
return true return true
proc genUserAvatars(users: seq[User]): VNode = proc genUserAvatars(users: seq[User]): VNode =
result = buildHtml(td): result = buildHtml(td(class="thread-users")):
for user in users: for user in users:
render(user, "avatar avatar-sm", showStatus=true) render(user, "avatar avatar-sm", showStatus=true)
text " " text " "
@ -114,14 +114,13 @@ when defined(js):
if thread.isSolved: if thread.isSolved:
italic(class="fas fa-check-square fa-xs", italic(class="fas fa-check-square fa-xs",
title="Thread has a solution") title="Thread has a solution")
a(href=makeUri("/t/" & $thread.id), a(href=makeUri("/t/" & $thread.id), onClick=anchorCB):
onClick=anchorCB):
text thread.topic text thread.topic
td(class=class({"d-none": not displayCategory})): tdiv(class=class({"d-none": not displayCategory})):
render(thread.category) render(thread.category)
genUserAvatars(thread.users) genUserAvatars(thread.users)
td(): text $thread.replies td(class="thread-replies"): text $thread.replies
td(class=class({ td(class="hide-sm" & class({
"views-text": thread.views < 999, "views-text": thread.views < 999,
"popular-text": thread.views > 999 and thread.views < 5000, "popular-text": thread.views > 999 and thread.views < 5000,
"super-popular-text": thread.views > 5000 "super-popular-text": thread.views > 5000
@ -209,12 +208,10 @@ when defined(js):
thead(): thead():
tr: tr:
th(text "Topic") th(text "Topic")
th(class=class({"d-none": not displayCategory})): th(class="centered-header"): text "Users"
text "Category" th(class="centered-header"): text "Replies"
th(style=style((StyleAttr.width, kstring"8rem"))): text "Users" th(class="hide-sm centered-header"): text "Views"
th(text "Replies") th(class="centered-header"): text "Activity"
th(text "Views")
th(text "Activity")
tbody(): tbody():
for i in 0 ..< list.threads.len: for i in 0 ..< list.threads.len:
let thread = list.threads[i] let thread = list.threads[i]