diff --git a/src/components/FileMenu/FileMenu.styles.js b/src/components/FileMenu/FileMenu.styles.js index d08ba2e8e..67e9bf22c 100644 --- a/src/components/FileMenu/FileMenu.styles.js +++ b/src/components/FileMenu/FileMenu.styles.js @@ -7,10 +7,11 @@ export const fileMenuStyles = css` position: relative; align-items: center; justify-content: center; - font-size: 15px; + font-size: 14px; font-weight: 400; text-transform: none; padding: 6px 8px; + border-radius: 3px; color: ${colors.grey900}; min-width: 64px; box-sizing: border-box; @@ -22,14 +23,23 @@ export const fileMenuStyles = css` } .menu-toggle:hover:enabled { - background-color: ${colors.grey300}; - opacity: 0.8; + background-color: ${colors.grey200}; } .menu-toggle:disabled { color: ${colors.grey400}; + cursor: not-allowed; + } + + .menu-toggle:active { + background-color: ${colors.grey300}; } - .menu-toggle:focus { + + .menuButton:focus { + outline: 2px solid ${colors.blue600}; + } + + .menuButton:focus:not(:focus-visible) { outline: none; } `