diff --git a/__tests__/src/components/WorkspaceElastic.test.js b/__tests__/src/components/WorkspaceElastic.test.js index 9efa1145efdb0192ca3d6d06d5b2979f08f147d7..c25985fb7dcfb334c368f8bc85c75ca1363efeeb 100644 --- a/__tests__/src/components/WorkspaceElastic.test.js +++ b/__tests__/src/components/WorkspaceElastic.test.js @@ -9,6 +9,7 @@ function createWrapper(props) { <WorkspaceElastic windows={{}} workspace={{ + focusedWindowId: 2, viewportPosition: { x: 20, y: 20, @@ -70,6 +71,11 @@ describe('WorkspaceElastic', () => { height: 400, }); }); + describe('focused window', () => { + it('adds a class to the focused window', () => { + expect(wrapper.find(Rnd).at(2).hasClass('mirador-workspace-focused-window')); + }); + }); describe('window behaviour', () => { it('when windows are dragged', () => { const mockDragStop = jest.fn(); diff --git a/src/components/WorkspaceElastic.js b/src/components/WorkspaceElastic.js index 65de11c19693ac3567cfcba6aaed850c3d346357..0f1baee72e1e2417ac1d2f1205043caf59fc2bc5 100644 --- a/src/components/WorkspaceElastic.js +++ b/src/components/WorkspaceElastic.js @@ -61,6 +61,9 @@ class WorkspaceElastic extends React.Component { }); }} dragHandleClassName={ns('window-top-bar')} + className={ + workspace.focusedWindowId === window.id ? ns('workspace-focused-window') : null + } > <Window window={window} diff --git a/src/styles/index.scss b/src/styles/index.scss index 8ff74cc5528efa470072c704a48bf781aa9cf16e..67df89db700f1e0829e52f365d3a954f52126bb5 100644 --- a/src/styles/index.scss +++ b/src/styles/index.scss @@ -68,6 +68,10 @@ z-index: 10000; } + &-workspace-focused-window { + z-index: 9000; + } + &-workspace-add { height: 100%; overflow: auto;