diff --git a/src/components/helpers/InterceptOverlay.tsx b/src/components/helpers/InterceptOverlay.tsx index c4cb4b98f98259b22ed091c9245cae7a73fc6b4b..50b20917fe47190ad28dba0959e007074d13162a 100644 --- a/src/components/helpers/InterceptOverlay.tsx +++ b/src/components/helpers/InterceptOverlay.tsx @@ -13,14 +13,12 @@ import {Dimmer} from "semantic-ui-react"; export interface MyProps { //readonly test: string - readonly opacity?: number } const mapStateToProps = (rootState: RootState , props: MyProps) => { return { //test0: rootState... //test: props.test - opacity: props.opacity, } } @@ -41,8 +39,8 @@ type Props = typeof stateProps & typeof dispatchProps; class InterceptOverlay extends React.Component<Props, any> { render(): JSX.Element { return ( - <div> - <Dimmer active inverted style={{opacity: this.props.opacity}} > + <div className="interception-overlay"> + <Dimmer active inverted> { this.props.children } @@ -52,4 +50,4 @@ class InterceptOverlay extends React.Component<Props, any> { } } -export default connect(mapStateToProps, mapDispatchToProps)(InterceptOverlay) \ No newline at end of file +export default connect(mapStateToProps, mapDispatchToProps)(InterceptOverlay) diff --git a/src/components/sites/doExerciseSite/doExerciseSite.tsx b/src/components/sites/doExerciseSite/doExerciseSite.tsx index 8d43505ce99bf04e7589dd05001ec36e8e62d259..5208a0f6cd6bcafa7a4c5316b49ba26fa2342b8c 100644 --- a/src/components/sites/doExerciseSite/doExerciseSite.tsx +++ b/src/components/sites/doExerciseSite/doExerciseSite.tsx @@ -578,6 +578,8 @@ class doExerciseSite extends React.Component<Props & RouteComponentProps<Matched /** * called when the tab changed (or when minimized) * but NOT when the user changes windows focus + * + * the interception overlay is sometimes not working (especially if the do exercise sit loaded) and then we click outside...) */ onPageVisibilityChanged(): void { @@ -976,7 +978,7 @@ class doExerciseSite extends React.Component<Props & RouteComponentProps<Matched } { - //first display got focus again interception overlay than this + //first display got focus again interception overlay then this this.props.lockSolutionsFlagAndIsStillOpen && this.props.isOnGotFocusInterceptionOverlayDisplayed === false && <LockSolutionOverlay> <p className="fg-colored" style={{fontSize: '16px'}}> diff --git a/src/styles/behaviors.styl b/src/styles/behaviors.styl index 2790d5ceeeaeccdb6a6a4900c433f906d96f9a62..9505f63907689f970b2e49d87c0e34dfcda1183a 100644 --- a/src/styles/behaviors.styl +++ b/src/styles/behaviors.styl @@ -91,6 +91,10 @@ bool ? clickable-toggled : clickable cursor pointer } +.interception-overlay .ui.active.dimmer{ + z-index 2000 //others dimmers/overlays have 1000 +} + // ---- printing ---