Adding support for custom theming

feature/appm-store/pbac
megala21 7 years ago
parent 56ce03927b
commit 7a08f421b1

@ -20,6 +20,8 @@ import './App.css';
import React, {Component} from 'react'; import React, {Component} from 'react';
import createHistory from 'history/createBrowserHistory'; import createHistory from 'history/createBrowserHistory';
import {BrowserRouter as Router, Redirect, Route, Switch} from 'react-router-dom' import {BrowserRouter as Router, Redirect, Route, Switch} from 'react-router-dom'
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import getMuiTheme from 'material-ui/styles/getMuiTheme';
import { import {
ApplicationCreate, ApplicationCreate,
ApplicationListing, ApplicationListing,
@ -29,7 +31,6 @@ import {
PlatformCreate, PlatformCreate,
PlatformListing PlatformListing
} from './components'; } from './components';
const history = createHistory({basename: '/publisher'}); const history = createHistory({basename: '/publisher'});
/** /**
@ -45,6 +46,15 @@ const history = createHistory({basename: '/publisher'});
* HashRouter is used because the other router types need the server to serve those urls. In hashRouter, server does * HashRouter is used because the other router types need the server to serve those urls. In hashRouter, server does
* not want to serve the URL. * not want to serve the URL.
* */ * */
const theme = require("./config.json").theme;
let muiTheme = null;
if (theme.current === "default") {
let defaultTheme = require("material-ui/styles/baseThemes/" + theme.default);
muiTheme = getMuiTheme(defaultTheme.default);
} else {
let customTheme = require("./themes/" + theme.custom);
muiTheme = getMuiTheme(customTheme.default);
}
class Base extends Component { class Base extends Component {
constructor() { constructor() {
@ -58,6 +68,7 @@ class Base extends Component {
if (this.state.user) { if (this.state.user) {
return ( return (
<div className="container"> <div className="container">
<MuiThemeProvider muiTheme={muiTheme}>
<BaseLayout> <BaseLayout>
<Switch> <Switch>
<Redirect exact path={"/"} to={"/assets/apps"}/> <Redirect exact path={"/"} to={"/assets/apps"}/>
@ -74,6 +85,7 @@ class Base extends Component {
<Route component={NotFound}/> <Route component={NotFound}/>
</Switch> </Switch>
</BaseLayout> </BaseLayout>
</MuiThemeProvider>
</div> </div>
) )
} }

@ -0,0 +1,7 @@
{
"theme" : {
"current" : "default",
"default" : "lightBaseTheme",
"custom" : "custom-theme"
}
}

@ -0,0 +1,12 @@
import {
indigo500, indigo700, redA200,
} from 'material-ui/styles/colors';
export default {
palette: {
primary1Color: indigo500,
primary2Color: indigo700,
accent1Color: redA200,
pickerHeaderColor: indigo500,
},
};
Loading…
Cancel
Save