From 0c820183a6fe9abc54c6a059561892400170f221 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Lera=20Elvo=C3=A9?= Date: Thu, 5 Jun 2025 11:02:59 +0300 Subject: [PATCH] new user page --- apps/users.lua | 17 ++++++ data/static/style.css | 44 +++++++++------ sass/style.scss | 46 ++++++++++------ views/user/user.etlua | 125 ++++++++++++++++++++++++------------------ 4 files changed, 144 insertions(+), 88 deletions(-) diff --git a/apps/users.lua b/apps/users.lua index 43620ac..64cb359 100644 --- a/apps/users.lua +++ b/apps/users.lua @@ -81,6 +81,23 @@ app:get("user", "/:username", function(self) end end + self.stats = db.query([[ + SELECT + COUNT(posts.id) AS post_count, + COUNT(DISTINCT threads.id) AS thread_count, + MAX(threads.title) FILTER (WHERE threads.created_at = latest.created_at) AS latest_thread_title, + MAX(threads.slug) FILTER (WHERE threads.created_at = latest.created_at) AS latest_thread_slug + FROM users + LEFT JOIN posts ON posts.user_id = users.id + LEFT JOIN threads ON threads.user_id = users.id + LEFT JOIN ( + SELECT user_id, MAX(created_at) AS created_at + FROM threads + GROUP BY user_id + ) latest ON latest.user_id = users.id + WHERE users.id = ? + ]], user.id)[1] + self.latest_posts = db.query([[ SELECT posts.id, posts.created_at, post_history.content, post_history.edited_at, threads.title AS thread_title, topics.name as topic_name, threads.slug as thread_slug diff --git a/data/static/style.css b/data/static/style.css index 1b3857f..77d1d34 100644 --- a/data/static/style.css +++ b/data/static/style.css @@ -145,6 +145,10 @@ body { overflow: hidden; } +.post-content.wider { + margin-right: 12.5%; +} + .post-inner { height: 100%; } @@ -218,35 +222,43 @@ blockquote { background-color: rgb(135.1928346457, 145.0974015748, 123.0025984252); } -.user-posts { +.user-info { display: grid; - grid-template-columns: 200px 1fr; + grid-template-columns: 300px 1fr; grid-template-rows: 1fr; gap: 0; - grid-auto-flow: row; - grid-template-areas: "user-page-usercard user-posts-container"; - border: 2px outset rgb(135.1928346457, 145.0974015748, 123.0025984252); + grid-template-areas: "user-page-usercard user-page-stats"; } .user-page-usercard { grid-area: user-page-usercard; - display: flex; - flex-direction: column; - align-items: center; padding: 20px 10px; border: 4px outset rgb(217.26, 220.38, 213.42); background-color: rgb(143.7039271654, 144.3879625984, 142.8620374016); border-right: solid 2px; } -.user-posts-container { - grid-area: user-posts-container; - display: grid; - grid-template-columns: 1fr; - grid-template-rows: 0.2fr 2.5fr; - gap: 0px 0px; - grid-auto-flow: row; - grid-template-areas: "post-info" "post-content"; +.user-page-stats { + grid-area: user-page-stats; + padding: 20px 30px; + border: 1px solid black; +} + +.user-stats-list { + list-style: none; + margin: 0 0 10px 0; +} + +.user-page-posts { + border-left: solid 1px black; + border-right: solid 1px black; + border-bottom: solid 1px black; + background-color: #c1ceb1; +} + +.user-page-post-preview { + max-height: 200px; + mask-image: linear-gradient(180deg, #000 60%, transparent); } .avatar { diff --git a/sass/style.scss b/sass/style.scss index aa54ac4..6fbef2d 100644 --- a/sass/style.scss +++ b/sass/style.scss @@ -189,6 +189,10 @@ body { overflow: hidden; } +.post-content.wider { + margin-right: 12.5%; +} + .post-inner { height: 100%; } @@ -264,38 +268,44 @@ blockquote { background-color: $dark2; } -.user-posts { +.user-info { display: grid; - grid-template-columns: 200px 1fr; + grid-template-columns: 300px 1fr; grid-template-rows: 1fr; gap: 0; - grid-auto-flow: row; grid-template-areas: - "user-page-usercard user-posts-container"; - border: 2px outset $dark2; + "user-page-usercard user-page-stats"; } .user-page-usercard { grid-area: user-page-usercard; - display: flex; - flex-direction: column; - align-items: center; padding: 20px 10px; border: 4px outset $light; background-color: $dark_bg; border-right: solid 2px; } -.user-posts-container { - grid-area: user-posts-container; - display: grid; - grid-template-columns: 1fr; - grid-template-rows: 0.2fr 2.5fr; - gap: 0px 0px; - grid-auto-flow: row; - grid-template-areas: - "post-info" - "post-content"; +.user-page-stats { + grid-area: user-page-stats; + padding: 20px 30px; + border: 1px solid black; +} + +.user-stats-list { + list-style: none; + margin: 0 0 10px 0; +} + +.user-page-posts { + border-left: solid 1px black; + border-right: solid 1px black; + border-bottom: solid 1px black; + background-color: $accent_color; +} + +.user-page-post-preview { + max-height: 200px; + mask-image: linear-gradient(180deg,#000 60%,transparent); } .avatar { diff --git a/views/user/user.etlua b/views/user/user.etlua index c73ee36..36a9893 100644 --- a/views/user/user.etlua +++ b/views/user/user.etlua @@ -2,10 +2,7 @@ <% render("views.common.infobox", infobox) %> <% end %>
-

Latest posts by <%= user.username %>

-
- User permission: <%= PermissionLevelString[user.permission] %> -
+

<%= user.username %>'s profile

<% if user_is_me then -%> + <% if user:is_guest() then %> +

You are a guest. A Moderator needs to approve your account before you will be able to post.

+ <% end %> + <% end %> + <% if me:is_mod() and not user:is_system() then %> +

Moderator controls

+ <% if user:is_guest() then %> +

This user is a guest. They signed up on <% render("views.common.timestamp", {timestamp = user.created_at}) -%>.

+
"> + +
+ <% else %> <% --[[ user is not guest ]] %> +

This user signed up on <% render("views.common.timestamp", {timestamp = user.created_at}) -%> and was confirmed on <% render("views.common.timestamp", {timestamp = user.confirmed_on}) %>.

+ <% if user.permission < me.permission then %> +
"> + +
+ <% end %> + <% if me:is_admin() and not user:is_mod() then %> +
"> + +
+ <% elseif user:is_mod() and user.permission < me.permission then %> +
"> + +
+ <% end %> + <% end %> <% end %>
-<% --[[ duplicating code, maybe i'll refactor the post subview later to work anywhere ]] %> -<% for i, post in ipairs(latest_posts) do %> -
-
+ +