hitide: Plans for hitide? v1 PROPOSED

Matthias Beyer: 2
 Make comments lightly colored
 Style submission part of post

 3 files changed, 48 insertions(+), 24 deletions(-)

Hi,

folling up on yesterdays discussion, here's two (RFC) patches for some style
tweaks.
If you like them, I'd follow with some more tweaks here and there in the same
direction.

Coloring is held lightly in general, with the light blue as "main theme" (so to
speak).

I hope you like what you see!

Matthias

Matthias Beyer (2):
  Make comments lightly colored
  Style submission part of post

 res/main.css        | 20 +++++++++++++++++
 src/routes/posts.rs | 52 ++++++++++++++++++++++++---------------------
 2 files changed, 48 insertions(+), 24 deletions(-)

Using a background color here feels out of place somehow, but I do like
the idea of improving visual distinction for comments & post content.

Just pushed an attempt at doing this more subtly, what do you think?

[RFC PATCH hitide v1 1/2] Make comments lightly colored Export this patch

This improves the readability because one can distinguish between
comments more easily.

Signed-off-by: Matthias Beyer <mail@beyermatthias.de>
Tested-by: Matthias Beyer <mail@beyermatthias.de>
---
 res/main.css | 1 +
 1 file changed, 1 insertion(+)

diff --git a/res/main.css b/res/main.css
index 36359f5..9bf4562 100644
--- a/res/main.css
+++ b/res/main.css
@@ -102,6 +102,7 @@ body {
 
 .comment > .content {
 	overflow-x: auto;
+	background-color: aliceblue;
 }
 
 .commentList {
-- 
2.29.2

[RFC PATCH hitide v1 2/2] Style submission part of post Export this patch

This patch adds a bit of style to the submission part of the post.
It therefore adds some more css classes in the HTML-generating code plus
some style tweaks in the CSS.

Signed-off-by: Matthias Beyer <mail@beyermatthias.de>
Tested-by: Matthias Beyer <mail@beyermatthias.de>
---
 res/main.css        | 19 +++++++++++++++++
 src/routes/posts.rs | 52 ++++++++++++++++++++++++---------------------
 2 files changed, 47 insertions(+), 24 deletions(-)

diff --git a/res/main.css b/res/main.css
index 9bf4562..91b67c6 100644
--- a/res/main.css
+++ b/res/main.css
@@ -135,6 +135,25 @@ textarea {
 	height: 7em;
 }
 
+.submission {
+	background-color: aliceblue;
+	padding-bottom: 0.5em;
+}
+
+.submission .submissionSource {
+	background-color: #81D4FA;
+	padding-top: 0.5em;
+	padding-bottom: 0.5em;
+}
+
+.submission .submissionContent {
+	margin-left: 0.5em;
+}
+
+.submission .submissionDelete {
+	margin-left: 0.5em;
+}
+
 @media (max-width: 768px) {
 	.communitySidebar {
 		display: none; /* TODO still show this somewhere */
diff --git a/src/routes/posts.rs b/src/routes/posts.rs
index 7ad0385..398fa30 100644
--- a/src/routes/posts.rs
+++ b/src/routes/posts.rs
@@ -145,34 +145,38 @@ async fn page_post_inner(
                     }
                 }
             </div>
-            <p>
-                {lang.tr("submitted", None)}
-                {" "}<TimeAgo since={chrono::DateTime::parse_from_rfc3339(&post.as_ref().created)?} lang={&lang} />
-                {" "}{lang.tr("by", None)}{" "}<UserLink user={post.as_ref().author.as_ref()} />
-                {" "}{lang.tr("to", None)}{" "}<CommunityLink community={&post.as_ref().community} />
-            </p>
-            {
-                match &post.as_ref().href {
-                    None => None,
-                    Some(href) => {
+            <div class={"submission"}>
+                <p class={"submissionSource"}>
+                    {lang.tr("submitted", None)}
+                    {" "}<TimeAgo since={chrono::DateTime::parse_from_rfc3339(&post.as_ref().created)?} lang={&lang} />
+                    {" "}{lang.tr("by", None)}{" "}<UserLink user={post.as_ref().author.as_ref()} />
+                    {" "}{lang.tr("to", None)}{" "}<CommunityLink community={&post.as_ref().community} />
+                </p>
+                {
+                    match &post.as_ref().href {
+                        None => None,
+                        Some(href) => {
+                            Some(render::rsx! {
+                                <p><a href={href.as_ref()}>{href.as_ref()}</a></p>
+                            })
+                        }
+                    }
+                }
+                <div class={"submissionContent"}>
+                    <Content src={&post} />
+                </div>
+                {
+                    if author_is_me(&post.as_ref().author, &base_data.login) || (post.local && base_data.is_site_admin()) {
                         Some(render::rsx! {
-                            <p><a href={href.as_ref()}>{href.as_ref()}</a></p>
+                            <p class={"submissionDelete"}>
+                                <a href={format!("/posts/{}/delete", post_id)}>{lang.tr("delete", None)}</a>
+                            </p>
                         })
+                    } else {
+                        None
                     }
                 }
-            }
-            <Content src={&post} />
-            {
-                if author_is_me(&post.as_ref().author, &base_data.login) || (post.local && base_data.is_site_admin()) {
-                    Some(render::rsx! {
-                        <p>
-                            <a href={format!("/posts/{}/delete", post_id)}>{lang.tr("delete", None)}</a>
-                        </p>
-                    })
-                } else {
-                    None
-                }
-            }
+            </div>
             <div>
                 <h2>{lang.tr("comments", None)}</h2>
                 {
-- 
2.29.2