Merge branch 'develop' into feature/MFA

src/public/stylesheets/style.css

@@ -307,6 +307,7 @@ button kbd {
     background-color: var(--menu-background-color) !important;
     user-select: none;
     -webkit-user-select: none;
+    --bs-dropdown-zindex: 999;
 }
 
 body.desktop .dropdown-menu {

src/public/stylesheets/theme-next-dark.css

@@ -191,9 +191,9 @@
     --right-pane-item-hover-color: white;
 
     --scrollbar-thumb-color: #fdfdfd5c;
-    --scrollbar-thumb-color-hover: #ffffff7d;
+    --scrollbar-thumb-hover-color: #ffffff7d;
+    --scrollbar-background-color: transparent;
     --scrollbar-border-color: unset; /* Deprecated */
-    --scrollbar-background-color: unset; /* Deprecated */
 
     --link-color: lightskyblue;
 

src/public/stylesheets/theme-next-light.css

@@ -190,9 +190,9 @@
     --right-pane-item-hover-color: inherit;
 
     --scrollbar-thumb-color: #0000005c;
-    --scrollbar-thumb-color-hover: #00000066;
+    --scrollbar-thumb-hover-color: #00000066;
+    --scrollbar-background-color: transparent;
     --scrollbar-border-color: unset; /* Deprecated */
-    --scrollbar-background-color: unset; /* Deprecated */
 
     --link-color: blue;
 

src/public/stylesheets/theme-next/base.css

@@ -95,8 +95,8 @@
     font-size: 0.9rem !important;
 }
 
-.dropdown-menu::-webkit-scrollbar-track {
-    background: var(--menu-background-color);
+.dropdown-menu {
+    --scrollbar-background-color: var(--menu-background-color);
 }
 
 body.mobile .dropdown-menu {

src/public/stylesheets/theme-next/forms.css

@@ -674,6 +674,10 @@ input[type="range"] {
 
 /* Scrollbar's body */
 
+::-webkit-scrollbar-track {
+    background-color: var(--scrollbar-background-color);
+}
+
 ::-webkit-scrollbar:vertical {
     width: var(--scrollbar-thickness) !important;
 }
@@ -707,10 +711,12 @@ input[type="range"] {
 
 ::-webkit-scrollbar-thumb:hover {
     --s-thumb-thickness: var(--scrollbar-thumb-hover-thickness);
-    --s-thumb-color: var(--scrollbar-thumb-color-hover);
+    --s-thumb-color: var(--scrollbar-thumb-hover-color);
 }
 
-/* Scrollbar's increment/decrement buttons (repurposed as a scrollbar start/end gap) */
+/* Scrollbar's increment/decrement buttons (repurposed as a scrollbar start/end gap).
+ * This gap is useful also to avoid breaking the rounded corners of a container when a
+ * custom scrollbar background color is used. */
 
 ::-webkit-scrollbar-button:vertical {
     height: var(--scrollbar-start-end-gap);
@@ -724,7 +730,7 @@ input[type="range"] {
  * Firefox scrollbars
  *
  * Unsupported features: --scrollbar-thumb-thickness, --scrollbar-thumb-hover-thickness,
- *                       --scrollbar-start-end-gap, --scrollbar-thumb-color-hover.
+ *                       --scrollbar-start-end-gap, --scrollbar-thumb-hover-color.
  */
 
 :root {

src/public/stylesheets/theme-next/notes/text.css

@@ -42,14 +42,9 @@ html .note-detail-editable-text :not(figure, .include-note, hr):first-child {
     overflow: auto;
 }
 
-.ck-content pre code::-webkit-scrollbar {
-    height: 6px;
-}
-
-.ck-content pre code::-webkit-scrollbar-thumb {
-    height: 4px;
-    border: none !important;
-    background: gray !important;
+.ck-content pre code {
+    --scrollbar-thumb-color: gray;
+    --scrollbar-thumb-hover-color: gray;
 }
 
 .ck-content pre code::-webkit-scrollbar-track,

src/public/stylesheets/theme-next/shell.css

@@ -46,7 +46,7 @@ body.background-effects.platform-win32 {
 }
 
 @media (prefers-color-scheme: dark) {
-    body.background-effects.platform-win32 #launcher-pane {
+    body.background-effects.platform-win32 {
         --launcher-pane-horiz-border-color: rgba(0, 0, 0, 0.5);
         --launcher-pane-horiz-background-color: rgba(255, 255, 255, 0.09);
     }
@@ -897,6 +897,21 @@ body.layout-horizontal .tab-row-container {
     padding-top: calc((var(--tab-bar-height) - var(--tab-height)));
 }
 
+/* Define extra drag areas for Electron windows */
+body.layout-horizontal .tab-row-container,
+body.layout-vertical .tab-row-widget,
+body.layout-vertical #left-pane .quick-search {
+    -webkit-app-region: drag;
+}
+
+/* Limit the drag area for the previous elements to include just to the element itself
+   and not its descendants also */
+body.layout-horizontal .tab-row-container > *,
+body.layout-vertical .tab-row-widget > *,
+body.layout-vertical #left-pane .quick-search > * {
+    -webkit-app-region: no-drag;
+}
+
 body.layout-horizontal .tab-row-widget-container {
     margin-top: 0;
     position: relative;