From fc87f6484072ef44641862854c7a4cac07a4c892 Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Sat, 8 Mar 2025 19:32:56 +0200
Subject: [PATCH] style(next)/options: restyle the warning boxes

---
 .../app/widgets/type_widgets/options/password/password.ts  | 2 +-
 src/public/stylesheets/theme-next/settings.css             | 7 +++++++
 src/public/stylesheets/theme-next/shell.css                | 2 +-
 3 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/public/app/widgets/type_widgets/options/password/password.ts b/src/public/app/widgets/type_widgets/options/password/password.ts
index 3813d2aee..330c854be 100644
--- a/src/public/app/widgets/type_widgets/options/password/password.ts
+++ b/src/public/app/widgets/type_widgets/options/password/password.ts
@@ -9,7 +9,7 @@ const TPL = `
 <div class="options-section">
     <h4 class="password-heading">${t("password.heading")}</h4>
 
-    <div class="alert alert-warning" role="alert" style="font-weight: bold; color: red !important;">
+    <div class="alert alert-warning" role="alert">
       ${t("password.alert_message")} <a class="reset-password-button tn-link" href="javascript:">${t("password.reset_link")}</a>
     </div>
 
diff --git a/src/public/stylesheets/theme-next/settings.css b/src/public/stylesheets/theme-next/settings.css
index 31342c597..41b50cc39 100644
--- a/src/public/stylesheets/theme-next/settings.css
+++ b/src/public/stylesheets/theme-next/settings.css
@@ -100,6 +100,13 @@
     margin-bottom: 6px;
 }
 
+.options-section .alert {
+    margin-bottom: 8px;
+    background: var(--alert-bar-background) !important;
+    border-radius: 8px;
+    font-size: .85em;
+}
+
 /* Appeareance */
 
 .main-font-size-input-group,
diff --git a/src/public/stylesheets/theme-next/shell.css b/src/public/stylesheets/theme-next/shell.css
index c12055896..f19ca12d7 100644
--- a/src/public/stylesheets/theme-next/shell.css
+++ b/src/public/stylesheets/theme-next/shell.css
@@ -1904,7 +1904,7 @@ body.background-effects.zen #root-widget {
     }
 }
 
-#center-pane div.alert {
+#center-pane .note-split > div.alert {
     position: relative;
     margin: 8px 0 0 0;
     border: unset;