mirror of
https://repository.entgra.net/community/device-mgt-core.git
synced 2025-10-06 02:01:45 +00:00
Adding the flexibility to change the css files
This commit is contained in:
megala21
parent
6e1a48f084
commit
9c490d1989
@ -31,18 +31,21 @@ import {
|
||||
PlatformCreate,
|
||||
PlatformListing
|
||||
} from './components';
|
||||
import Theme from './themes/theme';
|
||||
|
||||
|
||||
const history = createHistory({basename: '/publisher'});
|
||||
|
||||
/**
|
||||
* User can define the themes in the config.json. The themes will be loaded based on the user preference.
|
||||
*Loading the theme files based on the 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);
|
||||
let selected = Theme.selectedTheme;
|
||||
if (Theme.currentTheme === "default") {
|
||||
let defaultTheme = require("material-ui/styles/baseThemes/" + selected);
|
||||
muiTheme = getMuiTheme(defaultTheme.default);
|
||||
} else {
|
||||
let customTheme = require("./themes/" + theme.custom);
|
||||
let customTheme = require("./themes/" + selected + "/theme.js");
|
||||
muiTheme = getMuiTheme(customTheme.default);
|
||||
}
|
||||
|
||||
|
||||
@ -24,7 +24,7 @@ import {Step1, Step2, Step3} from './CreateSteps';
|
||||
import RaisedButton from 'material-ui/RaisedButton';
|
||||
import {Card, CardActions, CardTitle} from 'material-ui/Card';
|
||||
import {Step, StepLabel, Stepper,} from 'material-ui/Stepper';
|
||||
|
||||
import Theme from '../../themes/theme';
|
||||
|
||||
/**
|
||||
* The App Create Component.
|
||||
@ -51,6 +51,20 @@ class ApplicationCreate extends Component {
|
||||
};
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
let selected = Theme.selectedTheme;
|
||||
if (Theme.currentTheme === "default") {
|
||||
require("../../themes/default/application-create.css");
|
||||
} else {
|
||||
try {
|
||||
require("../../themes/" + selected + "/application-create.css");
|
||||
} catch (ex){
|
||||
// If the particular customized file does not exist, use the default one.
|
||||
require("../../themes/default/application-create.css");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Handles next button click event.
|
||||
* */
|
||||
@ -179,15 +193,15 @@ class ApplicationCreate extends Component {
|
||||
|
||||
|
||||
return (
|
||||
<div className="middle" style={{width: '95%', height: '100%', marginTop: '1%'}}>
|
||||
<Card style={{maxHeight: '700px', overflow: 'auto'}}>
|
||||
<div className="middle createapplicationmiddle">
|
||||
<Card className="creataapplicationcard">
|
||||
<CardTitle title="Create Application"/>
|
||||
|
||||
{/**
|
||||
* The stepper goes here.
|
||||
*/}
|
||||
<CardActions>
|
||||
<div style={{width: '100%', margin: 'auto'}}>
|
||||
<div className="createapplicationcardaction">
|
||||
<Stepper activeStep={stepIndex}>
|
||||
<Step>
|
||||
<StepLabel>Select Application Platform</StepLabel>
|
||||
@ -199,7 +213,7 @@ class ApplicationCreate extends Component {
|
||||
<StepLabel>Release</StepLabel>
|
||||
</Step>
|
||||
</Stepper>
|
||||
<div style={contentStyle}>
|
||||
<div className="createapplicationcontent">
|
||||
{finished ? (
|
||||
<div>
|
||||
<p>Create App?</p>
|
||||
|
||||
@ -21,6 +21,7 @@ import {withRouter} from 'react-router-dom';
|
||||
import TextField from 'material-ui/TextField';
|
||||
import DataTable from '../UIComponents/DataTable';
|
||||
import {Card, CardActions, CardTitle} from 'material-ui/Card';
|
||||
import Theme from '../../themes/theme';
|
||||
|
||||
/**
|
||||
* The App Create Component.
|
||||
@ -112,6 +113,18 @@ class ApplicationListing extends Component {
|
||||
componentWillMount() {
|
||||
//Fetch all the applications from backend and create application objects.
|
||||
this.setState({data: this.data});
|
||||
|
||||
let selected = Theme.selectedTheme;
|
||||
if (Theme.currentTheme === "default") {
|
||||
require("../../themes/default/application-listing.css");
|
||||
} else {
|
||||
try {
|
||||
require("../../themes/" + selected + "/application-listing.css");
|
||||
} catch (ex) {
|
||||
// If the particular customized file does not exist, use the default one.
|
||||
require("../../themes/default/application-listing.css");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
@ -156,12 +169,11 @@ class ApplicationListing extends Component {
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div className="middle" style={{width: '95%', height: '100%', marginTop: '1%'}}>
|
||||
<Card style={{display: 'flex', flexWrap: 'wrap'}}>
|
||||
<TextField hintText="Search"
|
||||
style={{float:'right', paddingRight: '2px'}}
|
||||
<div className="middle applicationListingMiddle">
|
||||
<Card className="applicationListingCard">
|
||||
<TextField hintText="Search" className="applicationListingSearch"
|
||||
onChange={this._searchApplications.bind(this)}/>
|
||||
<CardTitle title="Applications" style={{display: 'flex', flexWrap: 'wrap'}}/>
|
||||
<CardTitle title="Applications" className="applicationListTitle"/>
|
||||
<CardActions>
|
||||
|
||||
</CardActions>
|
||||
|
||||
@ -22,6 +22,9 @@ import MenuItem from 'material-ui/MenuItem';
|
||||
import TextField from 'material-ui/TextField';
|
||||
import SelectField from 'material-ui/SelectField';
|
||||
import RaisedButton from 'material-ui/RaisedButton';
|
||||
import Theme from '../../../themes/theme';
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* The first step of the application creation wizard.
|
||||
@ -51,6 +54,17 @@ class Step1 extends Component {
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
let selected = Theme.selectedTheme;
|
||||
if (Theme.currentTheme === "default") {
|
||||
require("../../../themes/default/application-create-step1.css");
|
||||
} else {
|
||||
try {
|
||||
require("../../../themes/" + selected + "/application-create-step1.css");
|
||||
} catch (ex){
|
||||
// If the particular customized file does not exist, use the default one.
|
||||
require("../../../themes/default/application-create-step1.css");
|
||||
}
|
||||
}
|
||||
//Get the list of available platforms and set to the state.
|
||||
}
|
||||
|
||||
@ -105,10 +119,9 @@ class Step1 extends Component {
|
||||
};
|
||||
|
||||
render() {
|
||||
const contentStyle = {margin: '0 16px'};
|
||||
return (
|
||||
<div>
|
||||
<div style={contentStyle}>
|
||||
<div className="creatediv">
|
||||
<div>
|
||||
<div>
|
||||
<SelectField
|
||||
@ -134,7 +147,7 @@ class Step1 extends Component {
|
||||
|
||||
<br/>
|
||||
<br/>
|
||||
<div style={{marginTop: 12}}>
|
||||
<div className="nextButton">
|
||||
<RaisedButton
|
||||
label="Next >"
|
||||
primary={true}
|
||||
|
||||
@ -28,6 +28,7 @@ import SelectField from 'material-ui/SelectField';
|
||||
import RaisedButton from 'material-ui/RaisedButton';
|
||||
import Clear from 'material-ui/svg-icons/content/clear';
|
||||
import {GridList, GridTile} from 'material-ui/GridList';
|
||||
import Theme from '../../../themes/theme';
|
||||
|
||||
/**
|
||||
* The Second step of application create wizard.
|
||||
@ -66,18 +67,21 @@ class Step2 extends Component {
|
||||
screenshots: [],
|
||||
icon: []
|
||||
};
|
||||
|
||||
this.styles = {
|
||||
chip: {
|
||||
margin: 4,
|
||||
},
|
||||
wrapper: {
|
||||
display: 'flex',
|
||||
flexWrap: 'wrap',
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
let selected = Theme.selectedTheme;
|
||||
if (Theme.currentTheme === "default") {
|
||||
require("../../../themes/default/application-create-step2.css");
|
||||
} else {
|
||||
try {
|
||||
require("../../../themes/" + selected + "/application-create-step2.css");
|
||||
} catch (ex){
|
||||
// If the particular customized file does not exist, use the default one.
|
||||
require("../../../themes/default/application-create-step2.css");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Create a tag on Enter key press and set it to the state.
|
||||
@ -142,8 +146,7 @@ class Step2 extends Component {
|
||||
<Chip
|
||||
key={data.key}
|
||||
onRequestDelete={() => this._handleRequestDelete(data.key)}
|
||||
style={this.styles.chip}
|
||||
>
|
||||
className="applicationCreateChip">
|
||||
{data.value}
|
||||
</Chip>
|
||||
);
|
||||
@ -299,9 +302,8 @@ class Step2 extends Component {
|
||||
|
||||
render() {
|
||||
console.log(this.state.visibilityComponent);
|
||||
const contentStyle = {margin: '0 16px'};
|
||||
return (
|
||||
<div style={contentStyle}>
|
||||
<div className="createStep2Content">
|
||||
<div>
|
||||
<div>
|
||||
<TextField
|
||||
@ -353,7 +355,7 @@ class Step2 extends Component {
|
||||
onChange={this._handleTagChange.bind(this)}
|
||||
onKeyPress={this._addTags.bind(this)}
|
||||
/><br/>
|
||||
<div style={this.styles.wrapper}>
|
||||
<div className="applicationCreateWrapper">
|
||||
{this.state.tags.map(this._renderChip, this)}
|
||||
</div>
|
||||
<br/>
|
||||
@ -365,18 +367,14 @@ class Step2 extends Component {
|
||||
<MenuItem value={0} primaryText="Business"/>
|
||||
</SelectField> <br/>
|
||||
{/*Platform Specific Properties.*/}
|
||||
<div style={{border: 'solid #BDBDBD 1px'}}>
|
||||
<p style={{color: '#BDBDBD'}}>Platform Specific Properties</p>
|
||||
<div className="platformSpecificPropertyDiv">
|
||||
<p className="platformSpecificPropertyP">Platform Specific Properties</p>
|
||||
</div>
|
||||
<br/>
|
||||
<div>
|
||||
<p style={{color: '#f44336'}}>{this.state.errors["Banner"]}</p>
|
||||
<p style={{color: '#BDBDBD'}}>Banner*:</p>
|
||||
<GridList style={{
|
||||
display: 'flex',
|
||||
flexWrap: 'nowrap',
|
||||
overflowX: 'auto',
|
||||
}} cols={1.1}>
|
||||
<p className="applicationCreateBannerError">{this.state.errors["Banner"]}</p>
|
||||
<p className="applicationCreateBannerTitle">Banner*:</p>
|
||||
<GridList className="applicationCreateGrid" cols={1.1}>
|
||||
{this.state.banner.map((tile) => (
|
||||
<GridTile key={Math.floor(Math.random() * 1000)}
|
||||
title={tile.name}
|
||||
@ -387,12 +385,11 @@ class Step2 extends Component {
|
||||
<img src={tile.preview}/></GridTile>
|
||||
))}
|
||||
{this.state.banner.length === 0 ?
|
||||
<Dropzone style={{width: '300px', height: '150px', border: 'dashed #BDBDBD 1px'}}
|
||||
accept="image/jpeg, image/png"
|
||||
<Dropzone className="applicationCreateBannerDropZone" accept="image/jpeg, image/png"
|
||||
onDrop={(banner, rejected) => {
|
||||
this.setState({banner, rejected});
|
||||
}}>
|
||||
<p style={{margin: '70px 40px 40px 150px'}}>+</p>
|
||||
<p className="applicationCreateBannerp">+</p>
|
||||
</Dropzone> : <div />}
|
||||
|
||||
</GridList>
|
||||
@ -400,13 +397,9 @@ class Step2 extends Component {
|
||||
</div>
|
||||
<br/>
|
||||
<div>
|
||||
<p style={{color: '#f44336'}}>{this.state.errors["Screenshots"]}</p>
|
||||
<p style={{color: '#BDBDBD'}}>Screenshots*:</p>
|
||||
<GridList style={{
|
||||
display: 'flex',
|
||||
flexWrap: 'nowrap',
|
||||
overflowX: 'auto',
|
||||
}} cols={1.1}>
|
||||
<p className="applicationCreateScreenshotError">{this.state.errors["Screenshots"]}</p>
|
||||
<p className="applicationCreateScreenshotTitle">Screenshots*:</p>
|
||||
<GridList className = "applicationCreateScreenshotGrid" cols={1.1}>
|
||||
{this.state.screenshots.map((file) => (
|
||||
<GridTile key={Math.floor(Math.random() * 1000)}
|
||||
title={file[0].name}
|
||||
@ -417,7 +410,7 @@ class Step2 extends Component {
|
||||
<img src={file[0].preview}/></GridTile>
|
||||
))}
|
||||
{this.state.screenshots.length < 3 ?
|
||||
<Dropzone style={{width: '150px', height: '150px', border: 'dashed #BDBDBD 1px'}}
|
||||
<Dropzone className="applicationCreateScreenshotDropZone"
|
||||
accept="image/jpeg, image/png"
|
||||
onDrop={(screenshots, rejected) => {
|
||||
let tmpScreenshots = this.state.screenshots;
|
||||
@ -425,19 +418,15 @@ class Step2 extends Component {
|
||||
this.setState({
|
||||
screenshots: tmpScreenshots});
|
||||
}}>
|
||||
<p style={{margin: '70px 40px 70px 70px'}}>+</p>
|
||||
<p className="applicationCreateScreenshotp">+</p>
|
||||
</Dropzone> : <div />}
|
||||
</GridList>
|
||||
</div>
|
||||
<br/>
|
||||
<div>
|
||||
<p style={{color: '#f44336'}}>{this.state.errors["Icon"]}</p>
|
||||
<p style={{color: '#BDBDBD'}}>Icon*:</p>
|
||||
<GridList style={{
|
||||
display: 'flex',
|
||||
flexWrap: 'nowrap',
|
||||
overflowX: 'auto',
|
||||
}} cols={1.1}>
|
||||
<p className="applcationCreateIconError">{this.state.errors["Icon"]}</p>
|
||||
<p className="applicationCreateIconTitle">Icon*:</p>
|
||||
<GridList className="applicationCreateIconGrid" cols={1.1}>
|
||||
{this.state.icon.map((tile) => (
|
||||
<GridTile key={Math.floor(Math.random() * 1000)}
|
||||
title={tile.name}
|
||||
@ -448,10 +437,10 @@ class Step2 extends Component {
|
||||
<img src={tile.preview}/></GridTile>
|
||||
))}
|
||||
{this.state.icon.length === 0 ?
|
||||
<Dropzone style={{width: '150px', height: '150px', border: 'dashed #BDBDBD 1px'}}
|
||||
<Dropzone className="applicationCreateIconDropZone"
|
||||
accept="image/jpeg, image/png"
|
||||
onDrop={(icon, rejected) => {this.setState({icon, rejected});}}>
|
||||
<p style={{margin: '70px 40px 70px 70px'}}>+</p>
|
||||
<p className="applicationCreateIconp">+</p>
|
||||
</Dropzone> : <div />}
|
||||
</GridList>
|
||||
</div>
|
||||
@ -460,12 +449,12 @@ class Step2 extends Component {
|
||||
|
||||
<br/>
|
||||
<br/>
|
||||
<div style={{marginTop: 12}}>
|
||||
<div className="applicationCreateBackAndNext">
|
||||
<FlatButton
|
||||
label="< Back"
|
||||
disabled={false}
|
||||
onClick={this._handlePrev.bind(this)}
|
||||
style={{marginRight: 12}}
|
||||
className="applicationCreateBack"
|
||||
/>
|
||||
<RaisedButton
|
||||
label="Next >"
|
||||
|
||||
@ -24,6 +24,7 @@ import TextField from 'material-ui/TextField';
|
||||
import FlatButton from 'material-ui/FlatButton';
|
||||
import SelectField from 'material-ui/SelectField';
|
||||
import RaisedButton from 'material-ui/RaisedButton';
|
||||
import Theme from '../../../themes/theme';
|
||||
|
||||
/**
|
||||
* The Third step of application create wizard. {Application Release Step}
|
||||
@ -57,6 +58,20 @@ class Step3 extends Component {
|
||||
}
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
let selected = Theme.selectedTheme;
|
||||
if (Theme.currentTheme === "default") {
|
||||
require("../../../themes/default/application-create-step3.css");
|
||||
} else {
|
||||
try {
|
||||
require("../../../themes/" + selected + "/application-create-step3.css");
|
||||
} catch (ex){
|
||||
// If the particular customized file does not exist, use the default one.
|
||||
require("../../../themes/default/application-create-step3.css");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Handles finish button click.
|
||||
* This invokes handleNext function in parent component.
|
||||
@ -81,9 +96,8 @@ class Step3 extends Component {
|
||||
}
|
||||
|
||||
render() {
|
||||
const contentStyle = {margin: '0 16px'};
|
||||
return (
|
||||
<div style={contentStyle}>
|
||||
<div className="applicationCreateStepMiddle">
|
||||
<div>
|
||||
<Toggle
|
||||
label="Release the Application"
|
||||
@ -110,13 +124,9 @@ class Step3 extends Component {
|
||||
/><br/>
|
||||
</div>}
|
||||
|
||||
<div style={{marginTop: 12}}>
|
||||
<FlatButton
|
||||
label="< Back"
|
||||
disabled={false}
|
||||
onClick={this._handlePrev.bind(this)}
|
||||
style={{marginRight: 12}}
|
||||
/>
|
||||
<div className="applicationCreateBackAndFinish">
|
||||
<FlatButton label="< Back" disabled={false} onClick={this._handlePrev.bind(this)}
|
||||
className="applicationCreateFinish"/>
|
||||
<RaisedButton
|
||||
label="Finish"
|
||||
primary={true}
|
||||
|
||||
@ -31,6 +31,8 @@ import Dashboard from 'material-ui/svg-icons/action/dashboard';
|
||||
import DevicesOther from 'material-ui/svg-icons/hardware/devices-other';
|
||||
import NotificationsIcon from 'material-ui/svg-icons/social/notifications';
|
||||
import ActionAccountCircle from 'material-ui/svg-icons/action/account-circle';
|
||||
import Theme from '../../themes/theme';
|
||||
|
||||
|
||||
/**
|
||||
* Base Layout:
|
||||
@ -49,7 +51,17 @@ class BaseLayout extends Component {
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
|
||||
let selected = Theme.selectedTheme;
|
||||
if (Theme.currentTheme === "default") {
|
||||
require("../../themes/default/basic-layout.css");
|
||||
} else {
|
||||
try {
|
||||
require("../../themes/" + selected + "/basic-layout.css");
|
||||
} catch (ex){
|
||||
// If the particular customized file does not exist, use the default one.
|
||||
require("../../themes/default/basic-layout.css");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
handleApplicationClick() {
|
||||
@ -142,16 +154,7 @@ class BaseLayout extends Component {
|
||||
</List>
|
||||
</Drawer>
|
||||
</div>
|
||||
<div style=
|
||||
{
|
||||
{
|
||||
height: 'calc(100% - 64px)',
|
||||
marginLeft: '16%',
|
||||
width: 'calc(100%-15%)',
|
||||
top: 64,
|
||||
left: "-100px"
|
||||
}
|
||||
}>
|
||||
<div className="basicLayoutDiv">
|
||||
{this.props.children}
|
||||
</div>
|
||||
</div>);
|
||||
|
||||
@ -31,6 +31,7 @@ import {GridList, GridTile} from 'material-ui/GridList';
|
||||
import Close from 'material-ui/svg-icons/navigation/close';
|
||||
import {Card, CardActions, CardTitle} from 'material-ui/Card';
|
||||
import AddCircleOutline from 'material-ui/svg-icons/content/add-circle-outline';
|
||||
import Theme from '../../themes/theme';
|
||||
|
||||
/**
|
||||
* Platform Create component.
|
||||
@ -64,6 +65,20 @@ class PlatformCreate extends Component {
|
||||
}
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
let selected = Theme.selectedTheme;
|
||||
if (Theme.currentTheme === "default") {
|
||||
require("../../themes/default/platform-create.css");
|
||||
} else {
|
||||
try {
|
||||
require("../../themes/" + selected + "/platform-create.css");
|
||||
} catch (ex) {
|
||||
// If the particular customized file does not exist, use the default one.
|
||||
require("../../themes/default/platform-create.css");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Handles toggle button actions.
|
||||
* One method is used for all the toggle buttons and, each toggle is identified by the id.
|
||||
@ -184,12 +199,12 @@ class PlatformCreate extends Component {
|
||||
property} = this.state;
|
||||
|
||||
return (
|
||||
<div className="middle" style={{width: '95%', height: '100%', marginTop: '1%'}}>
|
||||
<div className="middle createplatformmiddle">
|
||||
<Card>
|
||||
<CardTitle title="Create Platform"/>
|
||||
|
||||
<CardActions>
|
||||
<div style={{width: '100%', margin: 'auto', paddingLeft: '10px'}}>
|
||||
<div className="createplatformcardaction">
|
||||
<form>
|
||||
<TextField
|
||||
hintText="Enter the Platform Name."
|
||||
@ -224,17 +239,17 @@ class PlatformCreate extends Component {
|
||||
toggled={enabled}
|
||||
/> <br/>
|
||||
<div>
|
||||
<p style={{color: '#BaBaBa'}}>Platform Properties</p>
|
||||
<p className="createplatformproperties">Platform Properties</p>
|
||||
<div id="property-container">
|
||||
{platformProperties.map((p) => {
|
||||
return <div key={p.key}>{p.key} : {p.value}
|
||||
<IconButton onClick={this._removeProperty.bind(this, p)}>
|
||||
<Close style={{height: '10px', width: '10px'}}/>
|
||||
<Close className="createplatformpropertyclose"/>
|
||||
</IconButton>
|
||||
</div>
|
||||
})}
|
||||
</div>
|
||||
<div style={{display: 'flex'}}>
|
||||
<div className="createplatformproperty">
|
||||
<TextField
|
||||
id="property"
|
||||
hintText="Property Name"
|
||||
@ -244,7 +259,7 @@ class PlatformCreate extends Component {
|
||||
onChange={this._onTextChange.bind(this)}
|
||||
/> <em/>
|
||||
<SelectField
|
||||
style={{flex: '1 1 23% 1', margin: '0 1%'}}
|
||||
className="createplatformpropertyselect"
|
||||
floatingLabelText="Property Type"
|
||||
value={selectedProperty}
|
||||
floatingLabelFixed={true}
|
||||
@ -262,13 +277,8 @@ class PlatformCreate extends Component {
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{/*<p style={{color: '#f44336'}}>{this.state.errors["Icon"]}</p>*/}
|
||||
<p style={{color: '#BDBDBD'}}>Platform Icon*:</p>
|
||||
<GridList style={{
|
||||
display: 'flex',
|
||||
flexWrap: 'nowrap',
|
||||
overflowX: 'auto',
|
||||
}} cols={1.1}>
|
||||
<p className="createplatformiconp">Platform Icon*:</p>
|
||||
<GridList className="createplatformicon" cols={1.1}>
|
||||
{this.state.icon.map((tile) => (
|
||||
<GridTile key={Math.floor(Math.random() * 1000)}
|
||||
title={tile.name}
|
||||
@ -280,12 +290,10 @@ class PlatformCreate extends Component {
|
||||
</GridTile>
|
||||
))}
|
||||
{this.state.icon.length === 0 ?
|
||||
<Dropzone style={
|
||||
{width: '150px', height: '150px', border: 'dashed #BDBDBD 1px'}
|
||||
}
|
||||
<Dropzone className="createplatformdropzone"
|
||||
accept="image/jpeg, image/png"
|
||||
onDrop={(icon, rejected) => {this.setState({icon, rejected})}}>
|
||||
<p style={{margin: '70px 40px 70px 70px'}}>+</p>
|
||||
<p className="createplatformdropzonep">+</p>
|
||||
</Dropzone> : <div />}
|
||||
</GridList>
|
||||
</div>
|
||||
|
||||
@ -21,6 +21,7 @@ import {withRouter} from 'react-router-dom';
|
||||
import TextField from 'material-ui/TextField';
|
||||
import DataTable from '../UIComponents/DataTable';
|
||||
import {Card, CardActions, CardTitle} from 'material-ui/Card';
|
||||
import Theme from '../../themes/theme';
|
||||
|
||||
/**
|
||||
* The App Create Component.
|
||||
@ -40,6 +41,17 @@ class PlatformListing extends Component {
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
let selected = Theme.selectedTheme;
|
||||
if (Theme.currentTheme === "default") {
|
||||
require("../../themes/default/platform-listing.css");
|
||||
} else {
|
||||
try {
|
||||
require("../../themes/" + selected + "/platform-listing.css");
|
||||
} catch (ex) {
|
||||
// If the particular customized file does not exist, use the default one.
|
||||
require("../../themes/default/platform-listing.css");
|
||||
}
|
||||
}
|
||||
//Fetch all the applications from backend and create application objects.
|
||||
}
|
||||
|
||||
@ -75,12 +87,11 @@ class PlatformListing extends Component {
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div className="middle" style={{width: '95%', height: '100%', marginTop: '1%'}}>
|
||||
<Card style={{display: 'flex', flexWrap: 'wrap'}}>
|
||||
<TextField hintText="Search"
|
||||
style={{float:'right', paddingRight: '2px'}}
|
||||
onChange={this._searchApplications.bind(this)}/>
|
||||
<CardTitle title="Platforms" style={{display: 'flex', flexWrap: 'wrap'}}/>
|
||||
<div className= 'middle listingplatformmiddle'>
|
||||
<Card className='listingplatformcard'>
|
||||
<TextField hintText="Search" onChange={this._searchApplications.bind(this)}
|
||||
className='listingplatformsearch'/>
|
||||
<CardTitle title="Platforms" className='listingplatformTitle'/>
|
||||
<CardActions>
|
||||
|
||||
</CardActions>
|
||||
|
||||
@ -22,6 +22,7 @@ import DataTableRow from './DataTableRow';
|
||||
import DataTableHeader from './DataTableHeader';
|
||||
import RaisedButton from 'material-ui/RaisedButton';
|
||||
import {Table, TableBody, TableHeader, TableRow} from 'material-ui/Table';
|
||||
import Theme from '../../themes/theme';
|
||||
|
||||
/**
|
||||
* The Custom Table Component.
|
||||
@ -60,7 +61,18 @@ class DataTable extends Component {
|
||||
};
|
||||
|
||||
componentWillMount() {
|
||||
this.setState({data: this.props.data, headers: this.props.headers})
|
||||
this.setState({data: this.props.data, headers: this.props.headers});
|
||||
let selected = Theme.selectedTheme;
|
||||
if (Theme.currentTheme === "default") {
|
||||
require("../../themes/default/data-table.css");
|
||||
} else {
|
||||
try {
|
||||
require("../../themes/" + selected + "/data-table.css");
|
||||
} catch (ex) {
|
||||
// If the particular customized file does not exist, use the default one.
|
||||
require("../../themes/default/data-table.css");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps, nextState) {
|
||||
@ -95,8 +107,8 @@ class DataTable extends Component {
|
||||
adjustForCheckbox={ false }>
|
||||
<TableRow>
|
||||
{headers.map((header) => {
|
||||
return (<DataTableHeader key={header.data_id}
|
||||
style={{display: 'flex'}} header={header}/>)
|
||||
return (<DataTableHeader key={header.data_id} className="datatableRowColumn"
|
||||
header={header}/>)
|
||||
}
|
||||
)}
|
||||
</TableRow>
|
||||
|
||||
@ -20,6 +20,7 @@ import PropTypes from 'prop-types';
|
||||
import React, {Component} from 'react';
|
||||
import FlatButton from 'material-ui/FlatButton';
|
||||
import {TableHeaderColumn} from 'material-ui/Table';
|
||||
import Theme from '../../themes/theme';
|
||||
|
||||
/**
|
||||
* Data Table header component.
|
||||
@ -31,6 +32,20 @@ class DataTableHeader extends Component {
|
||||
super();
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
let selected = Theme.selectedTheme;
|
||||
if (Theme.currentTheme === "default") {
|
||||
require("../../themes/default/data-table.css");
|
||||
} else {
|
||||
try {
|
||||
require("../../themes/" + selected + "/data-table.css");
|
||||
} catch (ex) {
|
||||
// If the particular customized file does not exist, use the default one.
|
||||
require("../../themes/default/data-table.css");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* The onClick function of the table header.
|
||||
* Invokes the function passed in the header object.
|
||||
@ -48,20 +63,13 @@ class DataTableHeader extends Component {
|
||||
* */
|
||||
if (this.props.header.sortable) {
|
||||
headerCell = <FlatButton label={this.props.header.label}
|
||||
onClick={this._tableHeaderClick.bind(this)}
|
||||
style={{color: '#bdbdbd'}}/>;
|
||||
onClick={this._tableHeaderClick.bind(this)} className="sortableHeaderCell"/>;
|
||||
} else {
|
||||
headerCell = <span style={{position: 'relative',
|
||||
paddingLeft: '16px',
|
||||
paddingRight: '16px',
|
||||
textTransform: 'uppercase',
|
||||
fontWeight: 'normal',
|
||||
color: '#bdbdbd',
|
||||
fontSize: '14px'}}>{this.props.header.label}</span>;
|
||||
headerCell = <span className="notsortableHeaderCell">{this.props.header.label}</span>;
|
||||
}
|
||||
|
||||
return (
|
||||
<TableHeaderColumn key={this.props.header.id} style={{paddingLeft: '0px'}} >
|
||||
<TableHeaderColumn key={this.props.header.id} className="datatableHeaderColumn" >
|
||||
{headerCell}
|
||||
</TableHeaderColumn>
|
||||
);
|
||||
|
||||
@ -19,6 +19,7 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import React, {Component} from 'react';
|
||||
import {TableRow, TableRowColumn} from 'material-ui/Table';
|
||||
import Theme from '../../themes/theme';
|
||||
|
||||
/**
|
||||
* Data table row component.
|
||||
@ -34,7 +35,18 @@ class DataTableRow extends Component {
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
this.setState({dataItem: this.props.dataItem})
|
||||
this.setState({dataItem: this.props.dataItem});
|
||||
let selected = Theme.selectedTheme;
|
||||
if (Theme.currentTheme === "default") {
|
||||
require("../../themes/default/data-table.css");
|
||||
} else {
|
||||
try {
|
||||
require("../../themes/" + selected + "/data-table.css");
|
||||
} catch (ex) {
|
||||
// If the particular customized file does not exist, use the default one.
|
||||
require("../../themes/default/data-table.css");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
@ -50,7 +62,7 @@ class DataTableRow extends Component {
|
||||
<TableRow key={this.props.key} onClick={this._handleClick.bind(this)} >
|
||||
{Object.keys(dataItem).map((key) => {
|
||||
if (key !== 'id') {
|
||||
return <TableRowColumn style={{alignItems: 'center'}}
|
||||
return <TableRowColumn className = "datatableRowColumn"
|
||||
key={key}>{dataItem[key]}</TableRowColumn>
|
||||
} else {
|
||||
return <TableRowColumn key={key}/>
|
||||
|
||||
@ -1,7 +1,6 @@
|
||||
{
|
||||
"theme" : {
|
||||
"current" : "default",
|
||||
"default" : "lightBaseTheme",
|
||||
"custom" : "custom-theme"
|
||||
"theme": {
|
||||
"type": "default",
|
||||
"value": "lightBaseTheme"
|
||||
}
|
||||
}
|
||||
@ -1,12 +0,0 @@
|
||||
import {
|
||||
indigo500, indigo700, redA200,
|
||||
} from 'material-ui/styles/colors';
|
||||
|
||||
export default {
|
||||
palette: {
|
||||
primary1Color: indigo500,
|
||||
primary2Color: indigo700,
|
||||
accent1Color: redA200,
|
||||
pickerHeaderColor: indigo500,
|
||||
},
|
||||
};
|
||||
@ -0,0 +1,39 @@
|
||||
/*
|
||||
* Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||
*
|
||||
* WSO2 Inc. licenses this file to you under the Apache License,
|
||||
* Version 2.0 (the "License"); you may not use this file except
|
||||
* in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
/**
|
||||
* This a sample custom theme file. In config.json, if the following changes are done, this theme will be applied.
|
||||
* {
|
||||
* "theme" : {
|
||||
* "type" : "custom",
|
||||
* "value" : "custom-theme"
|
||||
* }
|
||||
* }
|
||||
*/
|
||||
import {
|
||||
indigo500, indigo700, redA200,
|
||||
} from 'material-ui/styles/colors';
|
||||
|
||||
export default {
|
||||
palette: {
|
||||
primary1Color: indigo500,
|
||||
primary2Color: indigo700,
|
||||
accent1Color: redA200,
|
||||
pickerHeaderColor: indigo500,
|
||||
},
|
||||
};
|
||||
@ -0,0 +1,25 @@
|
||||
/*
|
||||
* Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||
*
|
||||
* WSO2 Inc. licenses this file to you under the Apache License,
|
||||
* Version 2.0 (the "License"); you may not use this file except
|
||||
* in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
.creatediv {
|
||||
margin: 0 16px;
|
||||
}
|
||||
|
||||
.nextButton {
|
||||
margin-top: 12px;
|
||||
}
|
||||
@ -0,0 +1,120 @@
|
||||
/*
|
||||
* Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||
*
|
||||
* WSO2 Inc. licenses this file to you under the Apache License,
|
||||
* Version 2.0 (the "License"); you may not use this file except
|
||||
* in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
.applicationCreateChip {
|
||||
margin: 4px;
|
||||
}
|
||||
|
||||
.createStep2Content {
|
||||
margin: 0 16px;
|
||||
}
|
||||
|
||||
|
||||
.applicationCreateWrapper {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
|
||||
.platformSpecificPropertyDiv {
|
||||
border: solid #BDBDBD 1px;
|
||||
}
|
||||
|
||||
.platformSpecificPropertyP {
|
||||
color: #BDBDBD;
|
||||
}
|
||||
|
||||
.applicationCreateBannerError {
|
||||
color: #f44336;
|
||||
}
|
||||
|
||||
.applicationCreateBannerTitle {
|
||||
color: #BDBDBD;
|
||||
}
|
||||
|
||||
.applicationCreateGrid {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.applicationCreateBannerDropZone {
|
||||
width: 300px;
|
||||
height: 150px;
|
||||
border: dashed #BDBDBD 1px
|
||||
}
|
||||
|
||||
.applicationCreateBannerp {
|
||||
margin: 70px 40px 40px 150px;
|
||||
}
|
||||
|
||||
.applicationCreateScreenshotError {
|
||||
color: #f44336;
|
||||
}
|
||||
|
||||
.applicationCreateScreenshotTitle {
|
||||
color: #BDBDBD;
|
||||
}
|
||||
|
||||
.applicationCreateScreenshotGrid {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.applicationCreateScreenshotDropZone {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
border: dashed #BDBDBD 1px;
|
||||
}
|
||||
|
||||
.applicationCreateScreenshotp {
|
||||
margin: 70px 40px 70px 70px;
|
||||
}
|
||||
|
||||
.applcationCreateIconError {
|
||||
color: #f44336;
|
||||
}
|
||||
|
||||
.applicationCreateIconTitle {
|
||||
color: #BDBDBD;
|
||||
}
|
||||
|
||||
.applicationCreateIconGrid {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.applicationCreateIconDropZone {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
border: dashed #BDBDBD 1px;
|
||||
}
|
||||
|
||||
.applicationCreateIconp {
|
||||
margin: 70px 40px 70px 70px;
|
||||
}
|
||||
|
||||
.applicationCreateBackAndNext {
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
.applicationCreateBack {
|
||||
margin-right: 12px;
|
||||
}
|
||||
@ -0,0 +1,29 @@
|
||||
/*
|
||||
* Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||
*
|
||||
* WSO2 Inc. licenses this file to you under the Apache License,
|
||||
* Version 2.0 (the "License"); you may not use this file except
|
||||
* in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
.applicationCreateStepMiddle {
|
||||
margin: 0 16px;
|
||||
}
|
||||
|
||||
.applicationCreateBackAndFinish {
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
.applicationCreateFinish {
|
||||
margin-right: 12px;
|
||||
}
|
||||
@ -0,0 +1,36 @@
|
||||
/*
|
||||
* Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||
*
|
||||
* WSO2 Inc. licenses this file to you under the Apache License,
|
||||
* Version 2.0 (the "License"); you may not use this file except
|
||||
* in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
.createapplicationmiddle {
|
||||
width: 95%;
|
||||
height: 100%;
|
||||
margin-top: 1%;
|
||||
}
|
||||
|
||||
.creataapplicationcard {
|
||||
max-height: 700px;
|
||||
overflow: auto;
|
||||
}
|
||||
.createapplicationcardaction {
|
||||
width: 100%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.createapplicationcontent {
|
||||
margin: 0 16px;
|
||||
}
|
||||
@ -0,0 +1,38 @@
|
||||
/*
|
||||
* Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||
*
|
||||
* WSO2 Inc. licenses this file to you under the Apache License,
|
||||
* Version 2.0 (the "License"); you may not use this file except
|
||||
* in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
.applicationListingMiddle {
|
||||
width: 95%;
|
||||
height: 100%;
|
||||
margin-top: 1%;
|
||||
}
|
||||
|
||||
.applicationListingCard {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.applicationListingSearch {
|
||||
float:right;
|
||||
padding-right: 2px;
|
||||
}
|
||||
|
||||
.applicationListTitle {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
@ -0,0 +1,26 @@
|
||||
/*
|
||||
* Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||
*
|
||||
* WSO2 Inc. licenses this file to you under the Apache License,
|
||||
* Version 2.0 (the "License"); you may not use this file except
|
||||
* in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
.basicLayoutDiv {
|
||||
height: calc(100% - 64px);
|
||||
margin-left: 16%;
|
||||
width: calc(100% - 15%);
|
||||
top: 64px;
|
||||
left: -100px;
|
||||
}
|
||||
|
||||
@ -0,0 +1,44 @@
|
||||
/*
|
||||
* Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||
*
|
||||
* WSO2 Inc. licenses this file to you under the Apache License,
|
||||
* Version 2.0 (the "License"); you may not use this file except
|
||||
* in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
.tableRow {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.datatableRowColumn {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.sortableHeaderCell {
|
||||
color: #bdbdbd;
|
||||
}
|
||||
|
||||
.notsortableHeaderCell {
|
||||
position: relative;
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
text-transform: uppercase;
|
||||
font-weight: normal;
|
||||
color: #bdbdbd;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.datatableHeaderColumn {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
@ -0,0 +1,68 @@
|
||||
/*
|
||||
* Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||
*
|
||||
* WSO2 Inc. licenses this file to you under the Apache License,
|
||||
* Version 2.0 (the "License"); you may not use this file except
|
||||
* in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
.createplatformmiddle {
|
||||
width: 95%;
|
||||
height: 100%;
|
||||
margin-top: 1%
|
||||
}
|
||||
|
||||
.createplatformcardaction {
|
||||
width: 100%;
|
||||
margin: auto;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.createplatformproperties {
|
||||
color: #BaBaBa;
|
||||
}
|
||||
|
||||
.createplatformpropertyclose {
|
||||
height: 10px;
|
||||
width: 10px;
|
||||
}
|
||||
|
||||
|
||||
.createplatformproperty {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.createplatformpropertyselect {
|
||||
flex: 1 1 23% 1;
|
||||
margin: 0 1%
|
||||
}
|
||||
|
||||
.createplatformicon {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.createplatformiconp {
|
||||
color: #BDBDBD;
|
||||
}
|
||||
|
||||
.createplatformdropzone {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
border: dashed #BDBDBD 1px;
|
||||
}
|
||||
|
||||
.createplatformdropzonep {
|
||||
margin: 70px 40px 70px 70px
|
||||
}
|
||||
@ -0,0 +1,39 @@
|
||||
/*
|
||||
* Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||
*
|
||||
* WSO2 Inc. licenses this file to you under the Apache License,
|
||||
* Version 2.0 (the "License"); you may not use this file except
|
||||
* in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
|
||||
.listingplatformmiddle {
|
||||
width: 95%;
|
||||
height: 100%;
|
||||
margin-top: 1%;
|
||||
}
|
||||
|
||||
.listingplatformcard {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.listingplatformsearch {
|
||||
float:right;
|
||||
padding-right: 2px;
|
||||
}
|
||||
|
||||
.listingplatformTitle {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
@ -0,0 +1,35 @@
|
||||
/*
|
||||
* Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||
*
|
||||
* WSO2 Inc. licenses this file to you under the Apache License,
|
||||
* Version 2.0 (the "License"); you may not use this file except
|
||||
* in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
/**
|
||||
* This class will read through the configuration file and saves the theme names for the usage in other files.
|
||||
* User can define the themes in the config.json. The themes will be loaded based on the user preference.
|
||||
*/
|
||||
class Theme {
|
||||
constructor() {
|
||||
const theme = require("../config.json").theme;
|
||||
this.currentTheme = theme.type;
|
||||
if (this.currentTheme === "default") {
|
||||
this.selectedTheme = theme.value;
|
||||
} else {
|
||||
this.selectedTheme = theme.value;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default (new Theme);
|
||||
Loading…
Reference in New Issue
Block a user