Add bottom border line to menubar

Better visual separation of menubar and editor content, especially when scrolling long content. Signed-off-by: Jonas <[email protected]>
nextcloud · Sep 15, 2024 · 90696a2 · 90696a2
1 parent 40c2f75
commit 90696a2
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 0 deletions.
diff --git a/src/components/Menu/MenuBar.vue b/src/components/Menu/MenuBar.vue
@@ -227,6 +227,7 @@ export default {
 		background-color: var(--color-main-background-translucent);
 		backdrop-filter: var(--background-blur);
 		max-height: var(--default-clickable-area); // important for mobile so that the buttons are always inside the container
+		border-bottom: 1px solid var(--color-border);
 		padding-top:3px;
 		padding-bottom: 3px;
 

diff --git a/src/components/Menu/ReadonlyBar.vue b/src/components/Menu/ReadonlyBar.vue
@@ -49,6 +49,9 @@ export default defineComponent({
 <style scoped>
 .text-readonly-bar {
 	display: flex;
+	border-bottom: 1px solid var(--color-border);
+	padding-top: 3px;
+	padding-bottom: 3px;
 }
 .text-readonly-bar__entries {
 	display: flex;