diff --git a/src/components/LanguageSettings.js b/src/components/LanguageSettings.js index d5b456854..13fedf594 100644 --- a/src/components/LanguageSettings.js +++ b/src/components/LanguageSettings.js @@ -14,6 +14,7 @@ export function LanguageSettings({ handleClick, languages }) { { languages.map(language => ( { handleClick(language.locale); }} > diff --git a/src/components/NestedMenu.js b/src/components/NestedMenu.js index 6890586d9..cc3572b5f 100644 --- a/src/components/NestedMenu.js +++ b/src/components/NestedMenu.js @@ -21,7 +21,7 @@ export function NestedMenu({ return ( <> - + {icon && ({icon})} {label} diff --git a/src/components/ThumbnailCanvasGrouping.js b/src/components/ThumbnailCanvasGrouping.js index f01d39926..354379a5e 100644 --- a/src/components/ThumbnailCanvasGrouping.js +++ b/src/components/ThumbnailCanvasGrouping.js @@ -46,6 +46,8 @@ export class ThumbnailCanvasGrouping extends PureComponent { } = data; const currentGroupings = canvasGroupings[index]; const SPACING = 8; + const isSelected = currentGroupings.map(canvas => canvas.id).includes(currentCanvasId); + return (
canvas.id).includes(currentCanvasId) ? `2px solid ${theme.palette.primary.main}` : 0, - ...(currentGroupings.map(canvas => canvas.id).includes(currentCanvasId) && { + outline: isSelected ? `2px solid ${theme.palette.primary.main}` : 0, + ...isSelected && { outlineOffset: '3px', - }), + }, width: (position === 'far-bottom') ? 'auto' : `${style.width}px`, })} className={classNames( diff --git a/src/components/WindowTopBar.js b/src/components/WindowTopBar.js index fe3d7bf97..a298ed228 100644 --- a/src/components/WindowTopBar.js +++ b/src/components/WindowTopBar.js @@ -39,7 +39,7 @@ export function WindowTopBar({ removeWindow, windowId, toggleWindowSideBar, maximizeWindow = () => {}, maximized = false, minimizeWindow = () => {}, allowClose = true, allowMaximize = true, focusWindow = () => {}, allowFullscreen = false, allowTopMenuButton = true, allowWindowSideBar = true, - component = 'nav', + component = 'nav', sideBarOpen = false, }) { const { t } = useTranslation(); const ownerState = arguments[0]; // eslint-disable-line prefer-rest-params @@ -55,6 +55,7 @@ export function WindowTopBar({ > {allowWindowSideBar && ( { handleClick('workspaceSelection', e); }} aria-owns={selectedOption === 'workspaceSelection' ? 'workspace-selection' : undefined} > diff --git a/src/containers/WindowTopBar.js b/src/containers/WindowTopBar.js index 990007620..5d1b06570 100644 --- a/src/containers/WindowTopBar.js +++ b/src/containers/WindowTopBar.js @@ -2,7 +2,7 @@ import { compose } from 'redux'; import { connect } from 'react-redux'; import { withPlugins } from '../extend/withPlugins'; import * as actions from '../state/actions'; -import { getWindowConfig, isFocused } from '../state/selectors'; +import { getWindowConfig, isFocused, getWindow } from '../state/selectors'; import { WindowTopBar } from '../components/WindowTopBar'; /** mapStateToProps */ @@ -17,6 +17,7 @@ const mapStateToProps = (state, { windowId }) => { allowWindowSideBar: config.allowWindowSideBar, focused: isFocused(state, { windowId }), maximized: config.maximized, + sideBarOpen: (getWindow(state, { windowId }) || {}).sideBarOpen, }; };