From 7a08f421b1bbae2e372dc7c244a645fd2da3d0af Mon Sep 17 00:00:00 2001 From: megala21 Date: Mon, 11 Sep 2017 12:17:18 +0530 Subject: [PATCH] Adding support for custom theming --- .../src/main/resources/publisher/src/App.jsx | 14 +++++++++++++- .../src/main/resources/publisher/src/config.json | 7 +++++++ .../resources/publisher/src/themes/custom-theme.js | 12 ++++++++++++ 3 files changed, 32 insertions(+), 1 deletion(-) create mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/config.json create mode 100644 components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/themes/custom-theme.js diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/App.jsx b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/App.jsx index 1d7c315caa..c76c69af13 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/App.jsx +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/App.jsx @@ -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,7 +31,6 @@ import { PlatformCreate, PlatformListing } from './components'; - 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 * 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 { constructor() { @@ -58,6 +68,7 @@ class Base extends Component { if (this.state.user) { return (
+ @@ -74,6 +85,7 @@ class Base extends Component { +
) } diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/config.json b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/config.json new file mode 100644 index 0000000000..62a1565130 --- /dev/null +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/config.json @@ -0,0 +1,7 @@ +{ + "theme" : { + "current" : "default", + "default" : "lightBaseTheme", + "custom" : "custom-theme" + } +} \ No newline at end of file diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/themes/custom-theme.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/themes/custom-theme.js new file mode 100644 index 0000000000..6664416c93 --- /dev/null +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/themes/custom-theme.js @@ -0,0 +1,12 @@ +import { + indigo500, indigo700, redA200, +} from 'material-ui/styles/colors'; + +export default { + palette: { + primary1Color: indigo500, + primary2Color: indigo700, + accent1Color: redA200, + pickerHeaderColor: indigo500, + }, +}; \ No newline at end of file