design fixes

Author: kulgavy

src/components/App.js

@@ -39,8 +39,8 @@ class App extends React.PureComponent {
           <Route path="/app" exact render={() => <Redirect to="/app/main" />} />
           <PrivateRoute path="/app" component={LayoutComponent} />
           <Route path="/login" exact component={LoginComponent} />
+          <Route path="/error" exact component={ErrorPage} />
           <Redirect from="*" to="/app/main/analytics" />
-          <Route component={ErrorPage} />
         </Switch>
       </BrowserRouter>
     );

src/components/Helper/Helper.js

@@ -38,19 +38,19 @@ class Helper extends Component {
             </header>
           }
         >
-          <div class="theme-switcher d-flex justify-content-center">
-              <div class="form-check abc-radio abc-radio-warning form-check-inline">
-                <input class="form-check-input" type="radio" id="css-light" value="option2" checked name="css-light" aria-label="Sing Light"/>
-                <label class="form-check-label" for="css-light"></label>
+          <div className="theme-switcher d-flex justify-content-center">
+              <div className="form-check abc-radio abc-radio-warning form-check-inline">
+                <input className="form-check-input" checked type="radio" id="css-light" value="option2" name="css-light" aria-label="Sing Light" readOnly/>
+                <label className="form-check-label" htmlFor="css-light"></label>
               </div>
-              <div class="form-check abc-radio abc-radio-secondary mr-0 form-check-inline">
-                <input class="form-check-input" onClick={() => this.changeLocation('https://sing-app.herokuapp.com/')} type="radio" id="css-dark" value="option1" name="css-light" aria-label="Single Dark"/>
-                <label class="form-check-label" for="css-dark"></label>
+              <div className="form-check abc-radio abc-radio-secondary mr-0 form-check-inline">
+                <input className="form-check-input" onClick={() => this.changeLocation('https://sing-app.herokuapp.com/')} type="radio" id="css-dark" value="option1" name="css-light" aria-label="Single Dark" readOnly/>
+                <label className="form-check-label" htmlFor="css-dark"></label>
               </div>
             </div>
           <div className="mt-4">
             <Button
-              href="https://flatlogic.com/dashboards/sing-app-react"
+              href="https://flatlogic.com/admin-dashboards/sing-app-react"
               target="_blank"
               className="btn-rounded-f btn-block fs-mini"
               color="warning"

src/components/Helper/Helper.module.scss

@@ -9,6 +9,16 @@
 
   @include transition(right $sidebar-transition-time ease-in-out);
 
+  & :global {
+    .abc-radio-secondary input[type="radio"]:not(:checked)+label::before {
+      background-color: #798892;
+    }
+
+    .abc-radio-warning input[type="radio"]:not(:checked)+label::before {
+      background-color: theme-color('warning');
+    }
+  }
+
   &.themeHelperOpened {
     right: 0;
   }

src/pages/analytics/components/BigStat/BigStat.js

@@ -51,7 +51,7 @@ class BigStat extends Component {
                   caret color="default"
                   className="dropdown-toggle-split mr-xs"
                 >
-                  {this.state.simpleSelectDropdownValue}
+                  {this.state.simpleSelectDropdownValue}  
                 </DropdownToggle>
                 <DropdownMenu>
                   <DropdownItem onClick={this.changeSelectDropdownSimple}>

src/pages/analytics/components/Charts/MainChart.js

@@ -101,25 +101,22 @@ export default class RevenueChart extends PureComponent {
       .css({
         border: 0,
         borderRadius: 0,
-        paddingTop: 5,
-        display: 'flex',
-        justifyContent: 'center',
+        paddingTop: 5
       })
       .children('div')
       .css({
         borderWidth: 1,
         borderRadius: 0,
-        width: 10,
-        height: 10,
+        width: 75
       });
 
     this.$chartLegend.find('tbody td').css({
       paddingLeft: 10,
       paddingRight: 10,
-      textAlign: 'center',
+      textAlign: 'center'
     });
 
-    const labels = this.$chartLegend.find('.legendLabel').detach();
+    let labels = this.$chartLegend.find('.legendLabel').detach();
     this.$chartLegend.find('tbody').prepend('<tr></tr>');
     this.$chartLegend.find('tbody tr:eq(0)').append(labels);
   }

src/pages/error/ErrorPage.js

@@ -1,5 +1,4 @@
 import React from 'react';
-import withStyles from 'isomorphic-style-loader/lib/withStyles';
 import {
   Container,
   Form,
@@ -9,7 +8,7 @@ import {
 } from 'reactstrap';
 import { Link } from 'react-router-dom';
 
-import s from './ErrorPage.scss';
+import s from './ErrorPage.module.scss';
 
 class ErrorPage extends React.Component {
   render() {
@@ -44,4 +43,4 @@ class ErrorPage extends React.Component {
   }
 }
 
-export default withStyles(s)(ErrorPage);
+export default ErrorPage;

src/pages/error/ErrorPage.scss renamed to src/pages/error/ErrorPage.module.scss

@@ -3,7 +3,7 @@
 .errorPage {
   padding-top: 5%;
   background-color: $gray-300;
-  height: 100%;
+  height: 100vh;
 }
 
 .errorContainer {

src/pages/extra/calendar/Calendar.module.scss

@@ -14,8 +14,12 @@
       text-transform: uppercase;
     }
 
+    .fc-day-grid-event {
+      margin: 0;
+      padding: 0;
+    }
+
     .fc-event {
-      padding: 2px 3px;
       border: none;
       font-weight: $font-weight-normal;
       background-color: $gray-200;
@@ -29,6 +33,7 @@
     a.fc-event {
       height: auto;
       line-height: $line-height-base;
+      width: 100%;
     }
 
     /* ****  Full Calendar Custom   **** */

src/pages/package/SPackage.js

@@ -20,8 +20,7 @@ class SPackage extends React.Component {
         <h2 className="page-title">Sing - <span className="fw-semi-bold">Package</span>&nbsp;
           <small>More than 2000 man-hours already invested!</small>
         </h2>
-        <p className="lead">You will get access to all those versions
-          listed below after you purchase any Sing licence!</p>
+        <p className="lead">Over 8,000 developers worldwide chose our bootstrap admin templates to build their web applications, SAAS and E-Commerce platforms faster. Jump in to burn through your gig too!</p>
         <Row>
           <Col lg={5} md={6}>
             <Widget

src/pages/products/components/FilterElement/FilterElement.js

@@ -34,7 +34,7 @@ class FilterElement extends Component {
             caret color="default"
             className="dropdown-toggle-split mr-xs"
           >
-            {currentOption}
+            {currentOption}  
           </DropdownToggle>
           <DropdownMenu>
             {options.map(item =>

src/reducers/navigation.js

@@ -3,7 +3,7 @@ import { TOGGLE_SIDEBAR, OPEN_SIDEBAR, CLOSE_SIDEBAR, CHANGE_ACTIVE_SIDEBAR_ITEM
 const initialState = {
   sidebarOpened: false,
   sidebarStatic: false,
-  activeItem: window.location.pathname,
+  activeItem: JSON.parse(localStorage.getItem('staticSidebar')) ? window.location.pathname : null,
 };
 
 export default function runtime(state = initialState, action) {

src/styles/theme.scss

@@ -21,6 +21,7 @@
 @import '../../node_modules/react-bootstrap-table/dist/react-bootstrap-table-all.min.css';
 @import '../../node_modules/jvectormap/jquery-jvectormap.css';
 @import '../../node_modules/metrojs/release/MetroJs.Full/MetroJs.css';
+@import '../../node_modules/react-sortable-tree/style.css';
 @import 'mixins';
 @import 'base';
 @import 'overrides';