nipuni
/
device-mgt-core
forked from community/device-mgt-core
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix Theme change issues in publisher UI

Browse Source
feature/appm-store/pbac
Jayasanka 5 years ago
parent 60ac2b6495
commit c65c0fb094
15 changed files with 77 additions and 57 deletions
Show Stats Download Patch File Download Diff File

1
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/package.json
Unescape View File

@ -29,6 +29,7 @@
"react-scripts": "2.1.8",
"react-star-ratings": "^2.3.0",
"redux-thunk": "^2.3.0",
"shade-blend-color": "^1.0.0",
"storm-react-diagrams": "^5.2.1"
},
"devDependencies": {

4
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/public/conf/config.json
Unescape View File

@ -1,7 +1,9 @@
{
"theme": {
"type": "default",
"value": "lightBaseTheme"
"value": "lightBaseTheme",
"logo" : "https://www.brandchannel.com/wp-content/uploads/2016/05/instagram-new-logo-may-2016.jpg",
"primaryColor": "#F62459"
},
"serverConfig": {
"protocol": "https",

4
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/App.css
Unescape View File

@ -22,9 +22,9 @@
}
.logo-image {
width: 120px;
/*width: 120px;*/
height: 31px;
margin: 0 0 16px 20px;
margin: 0 5px 16px 24px;
float: left;
}

9
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/AppDetailsDrawer/AppDetailsDrawer.js vendored
Unescape View File

@ -24,6 +24,7 @@ import config from "../../../../../public/conf/config.json";
import ReactQuill from "react-quill";
import ReactHtmlParser, {processNodes, convertNodeToElement, htmlparser2} from 'react-html-parser';
import "./AppDetailsDrawer.css";
import pSBC from "shade-blend-color";
const {Text, Title} = Typography;
const {Option} = Select;
@ -456,7 +457,7 @@ class AppDetailsDrawer extends React.Component {
{!isDescriptionEditEnabled && (
<Text
style={{
color: "#1890ff",
color: config.theme.primaryColor,
cursor: "pointer"
}}
onClick={this.enableDescriptionEdit}>
@ -492,7 +493,7 @@ class AppDetailsDrawer extends React.Component {
<Divider dashed={true}/>
<Text strong={true}>Categories </Text>
{!isCategoriesEditEnabled && (<Text
style={{color: "#1890ff", cursor: "pointer"}}
style={{color: config.theme.primaryColor, cursor: "pointer"}}
onClick={this.enableCategoriesEdit}>
<Icon type="edit"/>
</Text>
@ -525,7 +526,7 @@ class AppDetailsDrawer extends React.Component {
<span>{
categories.map(category => {
return (
<Tag color="#108ee9" key={category} style={{marginBottom: 5}}>
<Tag color={pSBC ( 0.30, config.theme.primaryColor )} key={category} style={{marginBottom: 5}}>
{category}
</Tag>
);
@ -537,7 +538,7 @@ class AppDetailsDrawer extends React.Component {
<Divider dashed={true}/>
<Text strong={true}>Tags </Text>
{!isTagsEditEnabled && (<Text
style={{color: "#1890ff", cursor: "pointer"}}
style={{color: config.theme.primaryColor, cursor: "pointer"}}
onClick={this.enableTagsEdit}>
<Icon type="edit"/>
</Text>

3
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/appsTable/AppsTable.js vendored
Unescape View File

@ -1,6 +1,7 @@
import React from "react";
import {Avatar, Card, Col, Row, Table, Typography, Tag, Icon, message} from "antd";
import axios from "axios";
import pSBC from 'shade-blend-color';
import config from "../../../../../public/conf/config.json";
import "./AppsTable.css";
@ -30,7 +31,7 @@ const columns = [
<span>
{categories.map(category => {
return (
<Tag color="blue" key={category}>
<Tag color={pSBC ( 0.30, config.theme.primaryColor )} key={category}>
{category}
</Tag>
);

9
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageCategories.js vendored
Unescape View File

@ -3,6 +3,7 @@ import {Card, Tag, message, Icon, Input, notification, Divider, Button, Spin, To
import axios from "axios";
import config from "../../../../public/conf/config.json";
import {TweenOneGroup} from 'rc-tween-one';
import pSBC from "shade-blend-color";
class ManageCategories extends React.Component {
@ -95,14 +96,14 @@ class ManageCategories extends React.Component {
const categoryName = category.categoryName;
const tagElem = (
<Tag
color="blue"
color={pSBC ( 0.30, config.theme.primaryColor )}
>
{categoryName}
<Divider type="vertical"/>
<Tooltip title="edit">
<Icon onClick={() => {
this.openEditModal(categoryName)
}} style={{color: 'rgba(0,0,0,0.45)'}} type="edit"/>
}} type="edit"/>
</Tooltip>
<Divider type="vertical"/>
<Tooltip title="delete">
@ -122,7 +123,7 @@ class ManageCategories extends React.Component {
okText="Yes"
cancelText="No"
>
<Icon style={{color: 'rgba(0,0,0,0.45)'}} type="delete"/>
<Icon type="delete"/>
</Popconfirm>
</Tooltip>
</Tag>
@ -306,7 +307,7 @@ class ManageCategories extends React.Component {
const categoriesElements = categories.map(this.renderElement);
const temporaryElements = tempElements.map(this.renderTempElement);
return (
<div>
<div style={{marginBottom: 16}}>
<Card title="Categories">
<Spin tip="Working on it..." spinning={this.state.loading}>
{!isAddNewVisible &&

8
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/manage/categories/ManageTags.js vendored
Unescape View File

@ -98,14 +98,14 @@ class ManageTags extends React.Component {
const tagName = tag.tagName;
const tagElem = (
<Tag
color="gold"
color="#34495e"
>
{tagName}
<Divider type="vertical"/>
<Tooltip title="edit">
<Icon onClick={() => {
this.openEditModal(tagName)
}} style={{color: 'rgba(0,0,0,0.45)'}} type="edit"/>
}} type="edit"/>
</Tooltip>
<Divider type="vertical"/>
<Tooltip title="delete">
@ -125,7 +125,7 @@ class ManageTags extends React.Component {
okText="Yes"
cancelText="No"
>
<Icon style={{color: 'rgba(0,0,0,0.45)'}} type="delete"/>
<Icon type="delete"/>
</Popconfirm>
</Tooltip>
</Tag>
@ -307,7 +307,7 @@ class ManageTags extends React.Component {
const tagsElements = tags.map(this.renderElement);
const temporaryElements = tempElements.map(this.renderTempElement);
return (
<div>
<div style={{marginBottom: 16}}>
<Card title="Tags">
<Spin tip="Working on it..." spinning={this.state.loading}>
{!isAddNewVisible &&

29
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/Login.js vendored
Unescape View File

@ -11,15 +11,30 @@ class Login extends React.Component {
render() {
return (
<div className={styles.main}>
<div className={styles.content}>
<div style={{
backgroundImage: "url('https://gw.alipayobjects.com/zos/rmsportal/TVYTbAXWheQpRcWDaDMu.svg')",
backgroundRepeat: "no-repeat",
backgroundPosition: "center 110px",
backgroundSize: "100%",
height: 1500
}}>
<Row>
<Col span={4} offset={10}>
<Col xs={3} sm={3} md={10}>
</Col>
<Col xs={18} sm={18} md={4}>
<Row style={{marginBottom: 20}}>
<Col>
<img className={styles.logo} src={require('../../public/images/logo.svg')}/>
<Col style={{textAlign: "center"}}>
<img style={
{
marginTop: 36,
height: 60
}
}
className={styles.logo} src={config.theme.logo}/>
</Col>
</Row>
<Title type="secondary" level={2}>Login</Title>
<Title level={2}>Login</Title>
<WrappedNormalLoginForm/>
</Col>
@ -42,7 +57,7 @@ class NormalLoginForm extends React.Component {
super(props);
this.state = {
inValid: false,
loading : false
loading: false
};
}
@ -65,7 +80,7 @@ class NormalLoginForm extends React.Component {
const request = Object.keys(parameters).map(key => key + '=' + parameters[key]).join('&');
axios.post(config.serverConfig.protocol + "://"+config.serverConfig.hostname+':'+config.serverConfig.httpsPort+config.serverConfig.loginUri, request
axios.post(config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.loginUri, request
).then(res => {
if (res.status === 200) {
window.location = res.data.url;

3
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/Login.less
Unescape View File

@ -17,14 +17,13 @@
}
.content{
padding-top: 128px;
}
.logo{
margin-top: 36px;
height: 44px;
margin: auto;
width: 100%;
}

11
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/Dashboard.js vendored
Unescape View File

@ -1,10 +1,11 @@
import React from "react";
import {Layout, Menu, Icon} from 'antd';
import Logo from "../../../public/images/logo.svg";
// import Logo from "../../../public/images/logo.svg";
import {Switch, Link} from "react-router-dom";
import RouteWithSubRoutes from "../../components/RouteWithSubRoutes"
import {Redirect} from 'react-router'
import "../../App.css";
import config from "../../../public/conf/config.json";
const {Header, Content, Footer} = Layout;
const {SubMenu} = Menu;
@ -15,6 +16,8 @@ class Dashboard extends React.Component {
this.state = {
routes: props.routes
};
this.Logo = config.theme.logo;
}
render() {
@ -22,8 +25,8 @@ class Dashboard extends React.Component {
<div>
<Layout className="layout">
<Header style={{paddingLeft: 0, paddingRight: 0}}>
<div style={{width: 120}} className="logo-image">
<img alt="logo" src={Logo}/>
<div className="logo-image">
<img alt="logo" src={this.Logo}/>
</div>
<Menu
theme="light"
@ -53,7 +56,7 @@ class Dashboard extends React.Component {
</Header>
</Layout>
<Layout>
<Content style={{padding: '0 0'}}>
<Content style={{marginTop: 2}}>
<Switch>
<Redirect exact from="/publisher" to="/publisher/apps"/>
{this.state.routes.map((route) => (

10
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/add-new-app/AddNewEnterpriseApp.js vendored
Unescape View File

@ -10,7 +10,7 @@ const Paragraph = Typography;
const formConfig = {
installationType: "ENTERPRISE",
endpoint: "/ent-app",
jsonPayloadName:"application",
jsonPayloadName: "application",
releaseWrapperName: "entAppReleaseWrappers",
specificElements: {
binaryFile: {
@ -41,11 +41,9 @@ class AddNewEnterpriseApp extends React.Component {
title="Add New Enterprise App"
>
<div className="wrap">
<div className="content">
<Paragraph>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo.
</Paragraph>
</div>
<Paragraph>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo.
</Paragraph>
</div>
</PageHeader>
<div style={{background: '#f0f2f5', padding: 24, minHeight: 720}}>

8
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/add-new-app/AddNewPublicApp.js vendored
Unescape View File

@ -45,11 +45,9 @@ class AddNewEnterpriseApp extends React.Component {
title="Add New Public App"
>
<div className="wrap">
<div className="content">
<Paragraph>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo.
</Paragraph>
</div>
<Paragraph>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo.
</Paragraph>
</div>
</PageHeader>
<div style={{background: '#f0f2f5', padding: 24, minHeight: 720}}>

8
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/add-new-app/AddNewWebClip.js vendored
Unescape View File

@ -45,11 +45,9 @@ class AddNewEnterpriseApp extends React.Component {
title="Add New Web Clip"
>
<div className="wrap">
<div className="content">
<Paragraph>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo.
</Paragraph>
</div>
<Paragraph>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo.
</Paragraph>
</div>
</PageHeader>
<div style={{background: '#f0f2f5', padding: 24, minHeight: 720}}>

22
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/manage/Manage.js vendored
Unescape View File

@ -36,21 +36,23 @@ class Manage extends React.Component {
<div>
<PageHeader
// breadcrumb={{routes}}
title = "Manage"
title="Manage"
>
<div className="wrap">
<div className="content">
<Paragraph>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo.
</Paragraph>
</div>
<Paragraph>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo.
</Paragraph>
</div>
</PageHeader>
<div style={{background: '#f0f2f5', padding: 24, minHeight: 780}}>
<ManageCategories/>
<br/>
<ManageTags/>
<Row gutter={16}>
<Col sm={24} md={12}>
<ManageCategories/>
</Col>
<Col sm={24} md={12}>
<ManageTags/>
</Col>
</Row>
</div>
</div>

5
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/webpack.config.js
Unescape View File

@ -18,6 +18,7 @@
var path = require('path');
const HtmlWebPackPlugin = require("html-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const configurations = require("./public/conf/config.json");
const config = {
devtool: "source-map",
@ -87,8 +88,8 @@ const config = {
loader: "less-loader",
options: {
modifyVars: {
'primary-color': '#1890ff',
'link-color': '#1890ff',
'primary-color': configurations.theme.primaryColor,
'link-color': configurations.theme.primaryColor,
},
javascriptEnabled: true,
},

Write Preview
Loading…
Cancel
Save