fix(outline): Make sure the outline is always in foreground

Add a border shadow around the outline. Also, make it overlay the editor content (e.g. on small screens). Required e.g. for Collectives. Fixes: #4276 Signed-off-by: Jonas <[email protected]>
nextcloud · Nov 7, 2023 · 3d898bc · 3d898bc
1 parent a6e212f
commit 3d898bc
Showing 1 changed file with 5 additions and 1 deletion.
diff --git a/src/components/Editor/EditorOutline.vue b/src/components/Editor/EditorOutline.vue
@@ -61,10 +61,14 @@ export default {
 	// 204px = 50px nc header + 60px collectives titlebar + 44px menubar + 50px bottom margin
 	max-height: calc(100% - 204px);
 
+	border-radius: var(--border-radius-large);
+	box-shadow: 0 1px 10px var(--color-box-shadow);
+	background-color: var(--color-main-background);
+	z-index: 10021;
+
 	&-mobile {
 		box-shadow: 8px 0 17px -19px var(--color-box-shadow);
 		background-color: var(--color-main-background-translucent);
-		z-index: 1;
 	}
 
 	&__header {