From fd3c8eb57318ad7bdf2b73873650d20d1e69f7a6 Mon Sep 17 00:00:00 2001
From: elizavetaRa <svillyfly@mail.ru>
Date: Tue, 8 Mar 2022 21:29:54 +0100
Subject: [PATCH 1/2] hover with background-hover

---
 .../src/components/FilesList/ContextActions.vue        | 10 ++++------
 1 file changed, 4 insertions(+), 6 deletions(-)

diff --git a/packages/web-app-files/src/components/FilesList/ContextActions.vue b/packages/web-app-files/src/components/FilesList/ContextActions.vue
index 6279767e3f1..448a36ca1cd 100644
--- a/packages/web-app-files/src/components/FilesList/ContextActions.vue
+++ b/packages/web-app-files/src/components/FilesList/ContextActions.vue
@@ -210,6 +210,10 @@ export default {
 
   li {
     padding: 6px;
+    &:hover {
+      background-color: var(--oc-color-background-hover);
+      border-radius: 4px;
+    }
   }
 
   > li {
@@ -224,12 +228,6 @@ export default {
       vertical-align: top;
       width: 100%;
       text-align: left;
-
-      span:hover,
-      &:hover {
-        color: var(--oc-color-swatch-passive-hover) !important;
-        text-decoration: underline !important;
-      }
     }
   }
 

From dcb6c5488735735f5a6fdaf6c95146abb79248fb Mon Sep 17 00:00:00 2001
From: Pascal Wengerter <pascal@wengerter.info>
Date: Wed, 9 Mar 2022 12:41:10 +0100
Subject: [PATCH 2/2] Add changelog item && switch to rounded-corners helper
 class

---
 .../enhancement-contextmenu-hover-background  |  7 +++
 .../components/FilesList/ContextActions.vue   |  3 +-
 .../__snapshots__/ContextActions.spec.js.snap | 52 +++++++++----------
 3 files changed, 34 insertions(+), 28 deletions(-)
 create mode 100644 changelog/unreleased/enhancement-contextmenu-hover-background

diff --git a/changelog/unreleased/enhancement-contextmenu-hover-background b/changelog/unreleased/enhancement-contextmenu-hover-background
new file mode 100644
index 00000000000..106ed991521
--- /dev/null
+++ b/changelog/unreleased/enhancement-contextmenu-hover-background
@@ -0,0 +1,7 @@
+Enhancement: Contextmenu background hover
+
+We've added a background hover color for contextmenu actions.
+
+https://github.com/owncloud/web/pull/6553
+https://github.com/owncloud/web/pull/6559
+https://github.com/owncloud/web/issues/6560
diff --git a/packages/web-app-files/src/components/FilesList/ContextActions.vue b/packages/web-app-files/src/components/FilesList/ContextActions.vue
index 448a36ca1cd..cff383fefc5 100644
--- a/packages/web-app-files/src/components/FilesList/ContextActions.vue
+++ b/packages/web-app-files/src/components/FilesList/ContextActions.vue
@@ -12,7 +12,7 @@
           :key="`section-${section.name}-action-${actionIndex}`"
           :action="action"
           :items="items"
-          class="oc-files-context-action oc-px-s"
+          class="oc-files-context-action oc-px-s oc-rounded"
         />
       </oc-list>
     </template>
@@ -212,7 +212,6 @@ export default {
     padding: 6px;
     &:hover {
       background-color: var(--oc-color-background-hover);
-      border-radius: 4px;
     }
   }
 
diff --git a/packages/web-app-files/tests/unit/components/FilesList/__snapshots__/ContextActions.spec.js.snap b/packages/web-app-files/tests/unit/components/FilesList/__snapshots__/ContextActions.spec.js.snap
index 60e07dd023f..91a80fa24af 100644
--- a/packages/web-app-files/tests/unit/components/FilesList/__snapshots__/ContextActions.spec.js.snap
+++ b/packages/web-app-files/tests/unit/components/FilesList/__snapshots__/ContextActions.spec.js.snap
@@ -3,59 +3,59 @@
 exports[`ContextActions menu items renders a list of actions for a file 1`] = `
 <div id="oc-files-context-menu">
   <oc-list-stub id="oc-files-context-actions-context" class="oc-files-context-actions oc-pb-s oc-files-context-actions-border">
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-markdown-editor-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-markdown-editor-trigger" data-testid="action-handler">
         <oc-icon-stub name="file-text" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in editor</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-exampleName1-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-exampleName1-trigger" data-testid="action-handler">
         <oc-img-stub src="exampleIcon1" alt="" loadingtype="eager" data-testid="action-img" class="oc-icon oc-icon-m"></oc-img-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in exampleName1</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-exampleName2-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-exampleName2-trigger" data-testid="action-handler">
         <oc-img-stub src="exampleIcon2" alt="" loadingtype="eager" data-testid="action-img" class="oc-icon oc-icon-m"></oc-img-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in exampleName2</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-exampleName3-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-exampleName3-trigger" data-testid="action-handler">
         <oc-img-stub src="exampleIcon3" alt="" loadingtype="eager" data-testid="action-img" class="oc-icon oc-icon-m"></oc-img-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in exampleName3</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-download-file-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-download-file-trigger" data-testid="action-handler">
         <oc-icon-stub name="download" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Download</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-create-public-link-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-create-public-link-trigger" data-testid="action-handler">
         <oc-icon-stub name="links" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Create link</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-show-shares-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-show-shares-trigger" data-testid="action-handler">
         <oc-icon-stub name="group" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Share</span>
         <!---->
       </button></li>
   </oc-list-stub>
   <oc-list-stub id="oc-files-context-actions-actions" class="oc-files-context-actions oc-pb-s oc-pt-s oc-files-context-actions-border">
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-rename-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-rename-trigger" data-testid="action-handler">
         <oc-icon-stub name="pencil" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Edit</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-move-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-move-trigger" data-testid="action-handler">
         <oc-icon-stub name="folder-shared" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Move</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-copy-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-copy-trigger" data-testid="action-handler">
         <oc-icon-stub name="file-copy" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Copy</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-delete-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-delete-trigger" data-testid="action-handler">
         <oc-icon-stub name="delete-bin-5" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Delete</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-show-actions-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-show-actions-trigger" data-testid="action-handler">
         <oc-icon-stub name="slideshow" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">All actions</span>
         <!---->
       </button></li>
   </oc-list-stub>
   <oc-list-stub id="oc-files-context-actions-sidebar" class="oc-files-context-actions oc-pt-s">
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-show-details-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-show-details-trigger" data-testid="action-handler">
         <oc-icon-stub name="information" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Details</span>
         <!---->
       </button></li>
@@ -66,59 +66,59 @@ exports[`ContextActions menu items renders a list of actions for a file 1`] = `
 exports[`ContextActions menu items renders a list of actions for a folder 1`] = `
 <div id="oc-files-context-menu">
   <oc-list-stub id="oc-files-context-actions-context" class="oc-files-context-actions oc-pb-s oc-files-context-actions-border">
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-markdown-editor-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-markdown-editor-trigger" data-testid="action-handler">
         <oc-icon-stub name="file-text" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in editor</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-exampleName1-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-exampleName1-trigger" data-testid="action-handler">
         <oc-img-stub src="exampleIcon1" alt="" loadingtype="eager" data-testid="action-img" class="oc-icon oc-icon-m"></oc-img-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in exampleName1</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-exampleName2-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-exampleName2-trigger" data-testid="action-handler">
         <oc-img-stub src="exampleIcon2" alt="" loadingtype="eager" data-testid="action-img" class="oc-icon oc-icon-m"></oc-img-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in exampleName2</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-exampleName3-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-exampleName3-trigger" data-testid="action-handler">
         <oc-img-stub src="exampleIcon3" alt="" loadingtype="eager" data-testid="action-img" class="oc-icon oc-icon-m"></oc-img-stub> <span data-testid="action-label" class="oc-files-context-action-label">Open in exampleName3</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-download-file-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-download-file-trigger" data-testid="action-handler">
         <oc-icon-stub name="download" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Download</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-create-public-link-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-create-public-link-trigger" data-testid="action-handler">
         <oc-icon-stub name="links" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Create link</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-show-shares-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-show-shares-trigger" data-testid="action-handler">
         <oc-icon-stub name="group" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Share</span>
         <!---->
       </button></li>
   </oc-list-stub>
   <oc-list-stub id="oc-files-context-actions-actions" class="oc-files-context-actions oc-pb-s oc-pt-s oc-files-context-actions-border">
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-rename-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-rename-trigger" data-testid="action-handler">
         <oc-icon-stub name="pencil" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Edit</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-move-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-move-trigger" data-testid="action-handler">
         <oc-icon-stub name="folder-shared" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Move</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-copy-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-copy-trigger" data-testid="action-handler">
         <oc-icon-stub name="file-copy" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Copy</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-delete-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-delete-trigger" data-testid="action-handler">
         <oc-icon-stub name="delete-bin-5" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Delete</span>
         <!---->
       </button></li>
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-show-actions-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-show-actions-trigger" data-testid="action-handler">
         <oc-icon-stub name="slideshow" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">All actions</span>
         <!---->
       </button></li>
   </oc-list-stub>
   <oc-list-stub id="oc-files-context-actions-sidebar" class="oc-files-context-actions oc-pt-s">
-    <li class="oc-files-context-action oc-px-s"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-show-details-trigger" data-testid="action-handler">
+    <li class="oc-files-context-action oc-px-s oc-rounded"><button class="oc-button oc-button-m oc-button-justify-content-center oc-button-gap-m oc-button-passive oc-button-passive-raw oc-text-bold oc-files-actions-show-details-trigger" data-testid="action-handler">
         <oc-icon-stub name="information" filltype="line" accessiblelabel="" type="span" size="medium" variation="passive" color="" data-testid="action-icon"></oc-icon-stub> <span data-testid="action-label" class="oc-files-context-action-label">Details</span>
         <!---->
       </button></li>