From 9b15efa3d6b37e8a34dfe7f883eb59a38822b17a Mon Sep 17 00:00:00 2001
From: Pascal Wengerter <pascal@wengerter.info>
Date: Fri, 11 Mar 2022 17:33:44 +0100
Subject: [PATCH] Unify appSwitcher/userMenu/contextMenu hover styling

---
 changelog/unreleased/enhancement-design-improvements   |  7 +++++++
 .../web-app-files/src/components/AppBar/AppBar.vue     |  1 +
 .../src/components/FilesList/ContextActions.vue        | 10 ++++++----
 .../src/components/Topbar/ApplicationsMenu.vue         |  2 ++
 .../web-runtime/src/components/Topbar/UserMenu.vue     |  2 ++
 5 files changed, 18 insertions(+), 4 deletions(-)
 create mode 100644 changelog/unreleased/enhancement-design-improvements

diff --git a/changelog/unreleased/enhancement-design-improvements b/changelog/unreleased/enhancement-design-improvements
new file mode 100644
index 00000000000..66051d22532
--- /dev/null
+++ b/changelog/unreleased/enhancement-design-improvements
@@ -0,0 +1,7 @@
+Enhancement: Design improvements
+
+We've fixed various design glitches and improved the overall look-and-feel of the UI.
+
+https://github.com/owncloud/web/issues/6492
+https://github.com/owncloud/web/issues/6555
+https://github.com/owncloud/web/pulls/6584
diff --git a/packages/web-app-files/src/components/AppBar/AppBar.vue b/packages/web-app-files/src/components/AppBar/AppBar.vue
index c498e9f5756..c30f26373f9 100644
--- a/packages/web-app-files/src/components/AppBar/AppBar.vue
+++ b/packages/web-app-files/src/components/AppBar/AppBar.vue
@@ -18,6 +18,7 @@
           id="files-breadcrumb"
           data-testid="files-breadcrumbs"
           class="oc-py-s"
+          context-menu-padding="small"
           :items="breadcrumbs"
         >
           <template #contextMenu>
diff --git a/packages/web-app-files/src/components/FilesList/ContextActions.vue b/packages/web-app-files/src/components/FilesList/ContextActions.vue
index cff383fefc5..bf2ae489462 100644
--- a/packages/web-app-files/src/components/FilesList/ContextActions.vue
+++ b/packages/web-app-files/src/components/FilesList/ContextActions.vue
@@ -208,14 +208,11 @@ export default {
   text-align: left;
   white-space: normal;
 
-  li {
-    padding: 6px;
+  > li {
     &:hover {
       background-color: var(--oc-color-background-hover);
     }
-  }
 
-  > li {
     a,
     button,
     span {
@@ -227,6 +224,11 @@ export default {
       vertical-align: top;
       width: 100%;
       text-align: left;
+
+      &:hover {
+        color: var(--oc-color-swatch-passive-default);
+        text-decoration: none !important;
+      }
     }
   }
 
diff --git a/packages/web-runtime/src/components/Topbar/ApplicationsMenu.vue b/packages/web-runtime/src/components/Topbar/ApplicationsMenu.vue
index 0f28bdde3b0..ed381a4608c 100644
--- a/packages/web-runtime/src/components/Topbar/ApplicationsMenu.vue
+++ b/packages/web-runtime/src/components/Topbar/ApplicationsMenu.vue
@@ -82,6 +82,8 @@ export default {
 
     &:focus,
     &:hover {
+      background-color: var(--oc-color-background-hover);
+      color: var(--oc-color-swatch-passive-default);
       text-decoration: none;
     }
 
diff --git a/packages/web-runtime/src/components/Topbar/UserMenu.vue b/packages/web-runtime/src/components/Topbar/UserMenu.vue
index d2594c16fb6..85d9f41e4c2 100644
--- a/packages/web-runtime/src/components/Topbar/UserMenu.vue
+++ b/packages/web-runtime/src/components/Topbar/UserMenu.vue
@@ -155,6 +155,8 @@ export default {
 
     &:focus,
     &:hover {
+      background-color: var(--oc-color-background-hover);
+      color: var(--oc-color-swatch-passive-default);
       text-decoration: none;
     }