Merge pull request #956 from Megala21/appm_new

Adding support for custom theming
feature/appm-store/pbac
Megala Uthayakumar 7 years ago committed by GitHub
commit df59cccf8a

@ -20,6 +20,8 @@ import './App.css';
import React, {Component} from 'react';
import createHistory from 'history/createBrowserHistory';
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 {
ApplicationCreate,
ApplicationListing,
@ -29,9 +31,21 @@ import {
PlatformCreate,
PlatformListing
} from './components';
const history = createHistory({basename: '/publisher'});
/**
* User can define the themes in the config.json. The themes will be loaded based on the user preference.
*/
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);
}
/**
* This component defines the layout and the routes for the app.
* All the content will be loaded inside the Base component.
@ -45,7 +59,6 @@ const history = createHistory({basename: '/publisher'});
* 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.
* */
class Base extends Component {
constructor() {
super();
@ -91,6 +104,7 @@ class Publisher extends Component {
render() {
return (
<div className="App">
<MuiThemeProvider muiTheme={muiTheme}>
<Router basename="publisher" history={history}>
<Switch>
<Route path="/login" component={Login}/>
@ -98,6 +112,7 @@ class Publisher extends Component {
<Route component={Base}/>
</Switch>
</Router>
</MuiThemeProvider>
</div>
);
}

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

@ -21,10 +21,9 @@ import React from 'react';
import Publisher from './App';
import ReactDOM from 'react-dom';
import registerServiceWorker from './registerServiceWorker';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
/**
* This is the base js file of the app. All the content will be rendered in the root element.
* */
ReactDOM.render(<MuiThemeProvider><Publisher/></MuiThemeProvider>, document.getElementById('root'));
ReactDOM.render(<Publisher/>, document.getElementById('root'));
registerServiceWorker();

@ -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