styling & structure fixes to apps/dash/_parts/_applets.html, _dash.scss & _palette-picker.scss

src/static_src/scss/_dashboard.scss

@@ -72,7 +72,6 @@ body.page-dashboard {
 
     #id_applet_palette {
         padding: 0;
-        border-color: rgba(var(--secUser), 1);
 
         .palette-scroll {
             display: flex;
@@ -82,6 +81,13 @@ body.page-dashboard {
             height: 100%;
             scrollbar-width: none;
             &::-webkit-scrollbar { display: none; }
+            mask-image: linear-gradient(
+                to right,
+                transparent 0%,
+                black 8%,
+                black 92%,
+                transparent 100%
+            );
         }
     }
 

src/static_src/scss/_palette-picker.scss

@@ -7,13 +7,7 @@
     -webkit-overflow-scrolling: touch;
     gap: 0.75rem;
     padding-bottom: 0.5rem;
-    mask-image: linear-gradient(
+
-        to right,
-        transparent 0%,
-        black 8%,
-        black 92%,
-        transparent 100%
-    );
 }
 
 .palette-item {
@@ -26,15 +20,15 @@
 }
 
 .swatch {
-    width: 75%;
+    width: 100%;
     aspect-ratio: 1;
     border-radius: 0.5rem;
     background: linear-gradient(
         to bottom,
         rgba(var(--priUser), 1) 0%,
         rgba(var(--priUser), 1) 33%,
-        rgba(var(--secUser), 1) 33%,
+        rgba(var(--terUser), 1) 33%,
-        rgba(var(--secUser), 1) 66%,
+        rgba(var(--terUser), 1) 66%,
         rgba(var(--quiUser), 1) 66%,
         rgba(var(--quiUser), 1) 100%
     );

src/templates/apps/dashboard/_partials/_applets.html

@@ -57,14 +57,18 @@
                     <form method="POST" action="{% url "set_profile" %}">
                         {% csrf_token %}
                         <div class="username-field">
-                            <span class="username-at">@</span>
+                            <span class="username-at"><h1>@</h1></span>
                             <input
                                 id="id_new_username"
                                 name="username"
                                 required
                                 value="{{ user.username|default:'' }}"
+                                autocomplete="off"
+                                data-original="{{ user.username|default:'' }}"
+                                oninput="this.closest('form').querySelector('.save-btn').hidden = (this.value === this.dataset.original)"
                             >
                         </div>
+                        <button type="submit" class="btn btn-confirm save-btn" hidden>OK</button>
                     </form>
                 </section>
             {% elif entry.applet.slug == "palette" %}