using more semantic elements

src/app/app.js

@@ -6,15 +6,15 @@ import styles from './styles';
 class App extends PureComponent {
     render() {
         return (
-            <BrowserRouter>
-                <div className={styles['app']}>
+            <div className={styles['app']}>
+                <BrowserRouter>
                     <Switch>
                         <Route path={'/(discover|library|calendar)?'} exact={true} component={Main} />
                         <Route path={'/addons'} component={Addons} />
                         <Redirect to={'/'} />
                     </Switch>
-                </div>
-            </BrowserRouter>
+                </BrowserRouter>
+            </div>
         );
     }
 }

src/app/styles.less

@@ -87,13 +87,13 @@
     user-select: none;
     box-sizing: border-box;
     text-decoration: none;
+    font-weight: normal;
 }
 
 html, body, .app {
     height: 100vh;
     min-width: 1024px;
     position: relative;
-    cursor: default;
     overflow: hidden;
     background-color: @colorbgmain;
     font: 13px / 18px 'Open Sans', 'LatoLight', 'Arial', 'Helvetica', 'sans-serif';

src/common/NavBar/NavTab/NavTab.js

@@ -6,11 +6,8 @@ import styles from './styles';
 
 const NavTab = ({ to, exact, replace, icon, label }) => (
     <NavLink className={styles['nav-tab']} activeClassName={styles['active']} to={to} exact={exact} replace={replace}>
-        <Icon
-            className={styles['nav-tab-icon']}
-            icon={icon}
-        />
-        <span className={styles['nav-tab-label']}>{label}</span>
+        <Icon className={styles['nav-tab-icon']} icon={icon} />
+        <h2 className={styles['nav-tab-label']}>{label}</h2>
     </NavLink>
 );