From b78508ee151275cdba6208feefc0d2282c365bb7 Mon Sep 17 00:00:00 2001
From: trisua <tri@swmff.org>
Date: Wed, 9 Apr 2025 19:25:41 -0400
Subject: [PATCH] add: mirror other user's theme when viewing other user
 profiles fix: community/profile name sizing

---
 Cargo.lock                                    |  8 +++---
 crates/app/Cargo.toml                         |  2 +-
 crates/app/src/public/css/style.css           |  7 ++---
 .../app/src/public/html/communities/base.html |  2 +-
 .../src/public/html/communities/settings.html | 24 ++++++++++-------
 crates/app/src/public/html/components.html    | 20 ++++++++++++--
 crates/app/src/public/html/profile/base.html  |  2 +-
 .../app/src/public/html/profile/settings.html | 26 ++++++++++++-------
 crates/app/src/public/js/atto.js              |  5 ++++
 crates/core/Cargo.toml                        |  2 +-
 crates/l10n/Cargo.toml                        |  2 +-
 crates/shared/Cargo.toml                      |  2 +-
 example/tetratto.toml                         |  2 +-
 13 files changed, 70 insertions(+), 34 deletions(-)

diff --git a/Cargo.lock b/Cargo.lock
index 10a2ce1..f9ad075 100644
--- a/Cargo.lock
+++ b/Cargo.lock
@@ -3155,7 +3155,7 @@ dependencies = [
 
 [[package]]
 name = "tetratto"
-version = "0.1.0"
+version = "1.0.0"
 dependencies = [
  "axum",
  "axum-extra",
@@ -3179,7 +3179,7 @@ dependencies = [
 
 [[package]]
 name = "tetratto-core"
-version = "0.1.0"
+version = "1.0.0"
 dependencies = [
  "async-recursion",
  "bb8-postgres",
@@ -3198,7 +3198,7 @@ dependencies = [
 
 [[package]]
 name = "tetratto-l10n"
-version = "0.1.0"
+version = "1.0.0"
 dependencies = [
  "pathbufd",
  "serde",
@@ -3207,7 +3207,7 @@ dependencies = [
 
 [[package]]
 name = "tetratto-shared"
-version = "0.1.0"
+version = "1.0.0"
 dependencies = [
  "ammonia",
  "chrono",
diff --git a/crates/app/Cargo.toml b/crates/app/Cargo.toml
index f637c1c..e3adc21 100644
--- a/crates/app/Cargo.toml
+++ b/crates/app/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "tetratto"
-version = "0.1.0"
+version = "1.0.0"
 edition = "2024"
 
 [features]
diff --git a/crates/app/src/public/css/style.css b/crates/app/src/public/css/style.css
index c82d85d..b26dd19 100644
--- a/crates/app/src/public/css/style.css
+++ b/crates/app/src/public/css/style.css
@@ -158,15 +158,16 @@ p {
 }
 
 .name {
-    max-width: 200px;
+    max-width: 250px;
     overflow: hidden;
-    overflow-wrap: break-word;
+    /* overflow-wrap: break-word; */
+    overflow-wrap: anywhere;
     text-overflow: ellipsis;
 }
 
 @media screen and (min-width: 901px) {
     .name.shorter {
-        max-width: 180px;
+        max-width: 215px;
     }
 
     .name.lg\:long {
diff --git a/crates/app/src/public/html/communities/base.html b/crates/app/src/public/html/communities/base.html
index c9a2130..8b5c2ee 100644
--- a/crates/app/src/public/html/communities/base.html
+++ b/crates/app/src/public/html/communities/base.html
@@ -38,7 +38,7 @@
         <div class="w-full flex gap-4 flex-collapse">
             <div
                 class="lhs flex flex-col gap-2 sm:w-full"
-                style="width: 20rem; min-width: 20rem"
+                style="width: 22rem; min-width: 22rem"
             >
                 <div class="card-nest w-full">
                     <div class="card flex gap-2" id="community_avatar_and_name">
diff --git a/crates/app/src/public/html/communities/settings.html b/crates/app/src/public/html/communities/settings.html
index d987d88..22d5904 100644
--- a/crates/app/src/public/html/communities/settings.html
+++ b/crates/app/src/public/html/communities/settings.html
@@ -190,20 +190,26 @@
             </div>
 
             <form
-                class="card flex gap-2 flex-row flex-wrap items-center"
+                class="card flex flex-col gap-2"
                 method="post"
                 enctype="multipart/form-data"
                 onsubmit="upload_banner(event)"
             >
-                <input
-                    id="banner_file"
-                    name="file"
-                    type="file"
-                    accept="image/png,image/jpeg,image/avif,image/webp"
-                    class="w-content"
-                />
+                <div class="flex gap-2 flex-row flex-wrap items-center">
+                    <input
+                        id="banner_file"
+                        name="file"
+                        type="file"
+                        accept="image/png,image/jpeg,image/avif,image/webp"
+                        class="w-content"
+                    />
 
-                <button class="primary">{{ icon "check" }}</button>
+                    <button class="primary">{{ icon "check" }}</button>
+                </div>
+
+                <span class="fade"
+                    >Use an image of 1100x350px for the best results.</span
+                >
             </form>
         </div>
     </div>
diff --git a/crates/app/src/public/html/components.html b/crates/app/src/public/html/components.html
index 6c1248d..a11b776 100644
--- a/crates/app/src/public/html/components.html
+++ b/crates/app/src/public/html/components.html
@@ -30,7 +30,7 @@ border_radius="var(--radius)") -%}
     title="{{ username }}'s banner"
     src="/api/v1/auth/user/{{ username }}/banner"
     alt="@{{ username }}'s banner"
-    class="banner shadow"
+    class="banner shadow w-full"
     loading="lazy"
     style="border-radius: {{ border_radius }};"
 />
@@ -294,7 +294,7 @@ show_community and post.community != config.town_square %}
                 {{ icon "check" }}
                 <span>{{ text "notifs:action.mark_as_read" }}</span>
             </button>
-            {% endif %}
+            {% endif %}b
 
             <button
                 class="red tertiary"
@@ -464,4 +464,20 @@ user.settings.theme_hue %}
         --lit: {{ user.settings.theme_lit }} !important;
     }
 </style>
+
+<script>
+    function match_user_theme() {
+        const pref = "{{ profile.settings.theme_preference }}".toLowercase();
+
+        if (pref === "auto") {
+            return;
+        }
+
+        document.documentElement.className = pref;
+    }
+
+    setTimeout(() => {
+        match_user_theme();
+    }, 150);
+</script>
 {% endif %} {%- endmacro %}
diff --git a/crates/app/src/public/html/profile/base.html b/crates/app/src/public/html/profile/base.html
index 410755e..20cd72b 100644
--- a/crates/app/src/public/html/profile/base.html
+++ b/crates/app/src/public/html/profile/base.html
@@ -38,7 +38,7 @@
         <div class="w-full flex gap-4 flex-collapse">
             <div
                 class="lhs flex flex-col gap-2 sm:w-full"
-                style="width: 20rem; min-width: 20rem"
+                style="width: 22rem; min-width: 22rem"
             >
                 <div class="card-nest w-full">
                     <div class="card flex gap-2" id="user_avatar_and_name">
diff --git a/crates/app/src/public/html/profile/settings.html b/crates/app/src/public/html/profile/settings.html
index 1b8a73f..b368884 100644
--- a/crates/app/src/public/html/profile/settings.html
+++ b/crates/app/src/public/html/profile/settings.html
@@ -256,20 +256,26 @@
                 </div>
 
                 <form
-                    class="card flex gap-2 flex-row flex-wrap items-center"
+                    class="card flex flex-col gap-2"
                     method="post"
                     enctype="multipart/form-data"
                     onsubmit="upload_banner(event)"
                 >
-                    <input
-                        id="banner_file"
-                        name="file"
-                        type="file"
-                        accept="image/png,image/jpeg,image/avif,image/webp"
-                        class="w-content"
-                    />
+                    <div class="flex gap-2 flex-row flex-wrap items-center">
+                        <input
+                            id="banner_file"
+                            name="file"
+                            type="file"
+                            accept="image/png,image/jpeg,image/avif,image/webp"
+                            class="w-content"
+                        />
 
-                    <button class="primary">{{ icon "check" }}</button>
+                        <button class="primary">{{ icon "check" }}</button>
+                    </div>
+
+                    <span class="fade"
+                        >Use an image of 1100x350px for the best results.</span
+                    >
                 </form>
             </div>
         </div>
@@ -654,6 +660,7 @@
             ui.generate_settings_ui(
                 profile_settings,
                 [
+                    [[], "Privacy", "title"],
                     [
                         [
                             "private_profile",
@@ -675,6 +682,7 @@
                         "{{ profile.settings.private_last_seen }}",
                         "checkbox",
                     ],
+                    [[], "Theme", "title"],
                     [
                         ["theme_hue", "Theme hue (integer 0-255)"],
                         "{{ profile.settings.theme_hue }}",
diff --git a/crates/app/src/public/js/atto.js b/crates/app/src/public/js/atto.js
index ea4866b..f166945 100644
--- a/crates/app/src/public/js/atto.js
+++ b/crates/app/src/public/js/atto.js
@@ -751,6 +751,11 @@ media_theme_pref();
     });
 
     self.define("render_settings_ui_field", (_, into_element, option) => {
+        if (option.input_element_type === "title") {
+            into_element.innerHTML += `<hr class="margin" /><b>${option.value}</b>`;
+            return;
+        }
+
         if (option.input_element_type === "checkbox") {
             into_element.innerHTML += `<div class="card flex gap-2">
                 <input
diff --git a/crates/core/Cargo.toml b/crates/core/Cargo.toml
index fa7cfe0..3fb3bf5 100644
--- a/crates/core/Cargo.toml
+++ b/crates/core/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "tetratto-core"
-version = "0.1.0"
+version = "1.0.0"
 edition = "2024"
 
 [features]
diff --git a/crates/l10n/Cargo.toml b/crates/l10n/Cargo.toml
index 1b0e473..784b9ab 100644
--- a/crates/l10n/Cargo.toml
+++ b/crates/l10n/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "tetratto-l10n"
-version = "0.1.0"
+version = "1.0.0"
 edition = "2024"
 authors.workspace = true
 repository.workspace = true
diff --git a/crates/shared/Cargo.toml b/crates/shared/Cargo.toml
index 94bb5cd..0813b84 100644
--- a/crates/shared/Cargo.toml
+++ b/crates/shared/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "tetratto-shared"
-version = "0.1.0"
+version = "1.0.0"
 edition = "2024"
 authors.workspace = true
 repository.workspace = true
diff --git a/example/tetratto.toml b/example/tetratto.toml
index f97e9cc..839e344 100644
--- a/example/tetratto.toml
+++ b/example/tetratto.toml
@@ -3,8 +3,8 @@ description = "🐇 tetratto!"
 color = "#c9b1bc"
 port = 4118
 banned_hosts = []
-no_track = []
 host = "http://localhost:4118"
+no_track = []
 banned_usernames = [
     "admin",
     "owner",