@@ -13,19 +13,33 @@ interface Props {
13
13
const styles = {
14
14
page :{
15
15
margin :0 ,
16
- width :window . innerWidth - 20 , // 220
17
- height :window . innerHeight - 20 , // 655
18
16
backgroundColor :'white' ,
19
17
} ,
20
18
}
21
19
22
- console . log ( 'page styles' )
23
- console . log ( JSON . stringify ( styles . page ) )
24
-
25
20
const Routes = ( { state} :Props ) => {
21
+ const [ dimensions , setDimensions ] = React . useState ( {
22
+ width :window . innerWidth - 20 ,
23
+ height :window . innerHeight - 20 ,
24
+ } )
25
+
26
+ // solution for windows getting off size
27
+ // without adding multiple listeners
28
+ React . useEffect ( ( ) => {
29
+ const dimensionsInterval = setInterval ( ( ) => {
30
+ setDimensions ( {
31
+ width :window . innerWidth - 20 ,
32
+ height :window . innerHeight - 20 ,
33
+ } )
34
+ } , 5000 )
35
+ return ( ) => {
36
+ clearInterval ( dimensionsInterval )
37
+ }
38
+ } )
39
+
26
40
// TODO: refactor cond to user <Router><Route> and accept first route as if/else if
27
41
return (
28
- < div style = { styles . page } >
42
+ < div style = { { ... styles . page , ... dimensions } } >
29
43
< Cond state = { state } path = "SelectTutorial.Startup" >
30
44
< Loading />
31
45
</ Cond >