From 2d3d7ca4335c74e5b110eb788feb341c49f125ad Mon Sep 17 00:00:00 2001
From: Mikal Stordal <mikalstordal@gmail.com>
Date: Sun, 6 Oct 2024 04:08:59 +0200
Subject: [PATCH] misc: add expert/advanced mode visual indicator

---
 Shokofin/Pages/Settings.html | 23 ++++++++++++++++++++++-
 1 file changed, 22 insertions(+), 1 deletion(-)

diff --git a/Shokofin/Pages/Settings.html b/Shokofin/Pages/Settings.html
index cd395c7d..63adbce5 100644
--- a/Shokofin/Pages/Settings.html
+++ b/Shokofin/Pages/Settings.html
@@ -1,7 +1,28 @@
 <div data-role="page" class="page type-interior pluginConfigurationPage withTabs" data-require="emby-input,emby-button,emby-select,emby-checkbox" data-controller="__plugin/Shoko.Settings.js">
     <div data-role="content">
         <div class="content-primary">
-            <style>form:not(.expert-mode) .expert-only { display: none !important; }</style>
+            <style>
+form:not(.expert-mode) .expert-only {
+    display: none !important;
+}
+
+.expert-only.inputContainer .inputLabel::after,
+.expert-only.selectContainer .selectLabel::after,
+.expert-only.checkboxContainer .checkboxLabel::after,
+.expert-only[is="checkbox-list"] .checkboxListLabel::after,
+.expert-only[is="sortable-checkbox-list"] .checkboxListLabel::after {
+  font-size: 50%;
+  color: red;
+  margin-inline-start: 0.25rem;
+  padding-inline: 0.25rem;
+  vertical-align: middle;
+  content: "ADVANCED";
+  border: red 1px solid;
+  border-radius: 1rem;
+  display: "inline";
+}
+
+</style>
             <form>
                 <div class="verticalSection verticalSection-extrabottompadding">
                     <div class="sectionTitleContainer flex align-items-center">