File tree Expand file tree Collapse file tree 2 files changed +40
-3
lines changed Expand file tree Collapse file tree 2 files changed +40
-3
lines changed Original file line number Diff line number Diff line change 33 background-color : # 00d1b2 ;
44 color : # 333 ;
55}
6+
7+ .withPadding {
8+ padding-top : 30px ;
9+ }
10+
11+ .withoutPadding {
12+ padding-top : 0px ;
13+ }
14+
15+ @media screen and (max-width : 768px ) {
16+ .body-primary {
17+ padding-top : 30px ;
18+ }
19+ }
Original file line number Diff line number Diff line change @@ -7,6 +7,8 @@ class NavMenu extends React.Component
77 constructor ( props , context ) {
88 super ( props , context ) ;
99 this . toggleNavStatus = this . toggleNavStatus . bind ( this ) ;
10+ this . isMobile = this . isMobile . bind ( this ) ;
11+ this . isNotMobile = this . isNotMobile . bind ( this ) ;
1012 this . hide = this . hide . bind ( this ) ;
1113 this . state = {
1214 toggleNavStatus : ''
@@ -28,17 +30,38 @@ class NavMenu extends React.Component
2830 this . setState ( { toggleNavStatus : isActive } ) ;
2931 }
3032
33+ isMobile ( ) {
34+ if ( window . screen . width < 768 ) {
35+ return this . showOfflineInfo ( ) ;
36+ }
37+ return '' ;
38+ }
39+
40+ isNotMobile ( ) {
41+ if ( window . screen . width > 768 ) {
42+ return this . showOfflineInfo ( ) ;
43+ }
44+ return '' ;
45+ }
46+
47+ showOfflineInfo ( ) {
48+ return (
49+ < span className = "nav-center nav-item" >
50+ < Offline />
51+ </ span >
52+ ) ;
53+ }
54+
3155 render ( ) {
3256 return (
3357 < nav className = "nav has-shadow" id = "top" >
3458 < div className = "container" >
3559 < div className = "nav-left" >
3660 < a className = "nav-item" href = "../index.html" > IClient</ a >
61+ { this . isMobile ( ) }
3762 </ div >
3863 < span className = "nav-center nav-menu is-active" >
39- < span className = "nav-item" >
40- < Offline />
41- </ span >
64+ { this . isNotMobile ( ) }
4265 </ span >
4366 < span className = { `nav-toggle ${ this . state . toggleNavStatus } ` } onClick = { this . toggleNavStatus } >
4467 < span > </ span >
You can’t perform that action at this time.
0 commit comments