From 3901ad7dbe1a145c322b70bfc0e075963f8d0ab0 Mon Sep 17 00:00:00 2001
From: Lipis <lipiridis@gmail.com>
Date: Sun, 26 Jan 2020 12:19:21 +0200
Subject: [PATCH] Adjust context menu and use open colors (#553)

* Adjust context menu and use open colors

* word wrap

* revert colors & padding

Co-authored-by: David Luzar <luzar.david@gmail.com>
---
 src/components/ContextMenu.css | 8 +++-----
 src/components/ContextMenu.tsx | 6 +-----
 2 files changed, 4 insertions(+), 10 deletions(-)

diff --git a/src/components/ContextMenu.css b/src/components/ContextMenu.css
index 3b91d2f6..6a3c10a8 100644
--- a/src/components/ContextMenu.css
+++ b/src/components/ContextMenu.css
@@ -11,19 +11,17 @@
   border: 1px solid #bcbcbc;
 }
 
-.context-menu__option {
-  width: 9.5rem;
-}
-
 .context-menu-option {
   position: relative;
   width: 100%;
+  min-width: 9.5rem;
   margin: 0;
+  padding: 0.25rem 1rem 0.25rem 1.25rem;
   text-align: left;
   border-radius: 0;
-  padding-left: 1.25rem;
   background-color: #f2f2f2;
   border: none;
+  white-space: nowrap;
 }
 
 .context-menu-option:hover {
diff --git a/src/components/ContextMenu.tsx b/src/components/ContextMenu.tsx
index 4d0e2212..ab0e1390 100644
--- a/src/components/ContextMenu.tsx
+++ b/src/components/ContextMenu.tsx
@@ -26,11 +26,7 @@ function ContextMenu({ options, onCloseRequest, top, left }: Props) {
     >
       <ul className="context-menu" onContextMenu={e => e.preventDefault()}>
         {options.map((option, idx) => (
-          <li
-            key={idx}
-            className="context-menu__option"
-            onClick={onCloseRequest}
-          >
+          <li key={idx} onClick={onCloseRequest}>
             <ContextMenuOption {...option} />
           </li>
         ))}