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

Layout modifications.

Browse Source
feature/appm-store/pbac
Menaka Jayawardena 7 years ago
parent 4a09b41434
commit f7d6bbd639
12 changed files with 388 additions and 387 deletions
Show Stats Download Patch File Download Diff File

35
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/AppPublisherBase/BaseLayout.jsx
Unescape View File

@ -21,7 +21,7 @@ import React, {Component} from 'react';
import {withRouter} from 'react-router-dom'; import {withRouter} from 'react-router-dom';
import AuthHandler from "../../api/authHandler"; import AuthHandler from "../../api/authHandler";
import ApplicationCreate from '../Application/Create/ApplicationCreate'; import ApplicationCreate from '../Application/Create/ApplicationCreate';
import {Button, Col, Input, Row,} from 'reactstrap'; import {Col, Container, Input, Row,} from 'reactstrap';
import FloatingButton from "../UIComponents/FloatingButton/FloatingButton"; import FloatingButton from "../UIComponents/FloatingButton/FloatingButton";
/** /**
@ -48,7 +48,6 @@ class BaseLayout extends Component {
} }
handleApplicationCreateClick(event) { handleApplicationCreateClick(event) {
console.log("dsfds");
event.preventDefault(); event.preventDefault();
event.stopPropagation(); event.stopPropagation();
this.setState({openModal: true}); this.setState({openModal: true});
@ -72,7 +71,7 @@ class BaseLayout extends Component {
render() { render() {
return ( return (
<div id="container"> <Container noGutters fluid id="container">
<div id="header-content"> <div id="header-content">
<div id="header"> <div id="header">
<span id="header-text"> <span id="header-text">
@ -82,33 +81,33 @@ class BaseLayout extends Component {
<i className="fw fw-notification btn-header"></i> <i className="fw fw-notification btn-header"></i>
<i className="fw fw-user btn-header"></i> <i className="fw fw-user btn-header"></i>
</div> </div>
</div> <div id="search-box">
<div id="search-box"> <i className="fw fw-search search-icon">
<i className="fw fw-search search-icon"> </i>
</i> <Input
<Input id="search"
id="search" name="search"
name="search" placeholder={'Search for Applications'}
placeholder={'Search for Applications'} onChange={(event) => console.log(event.target.value)}
onChange={(event) => console.log(event.target.value)} />
/> </div>
</div> </div>
<div id="add-btn-container"> <div id="add-btn-container">
<FloatingButton className="add-btn small" onClick={this.handleApplicationCreateClick.bind(this)}/> <FloatingButton
className="add-btn small"
onClick={this.handleApplicationCreateClick.bind(this)}
/>
</div> </div>
</div> </div>
<div id="application-content" style={this.state.style}> <div id="application-content" style={this.state.style}>
<Row> <Row>
<Col> <Col>
{this.props.children} {this.props.children}
</Col> </Col>
</Row> </Row>
</div> </div>
<ApplicationCreate open={this.state.openModal} close={this.closeModal}/> <ApplicationCreate open={this.state.openModal} close={this.closeModal}/>
</div> </Container>
); );
} }
} }

347
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step1.jsx
Unescape View File

@ -18,148 +18,299 @@
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import React, {Component} from 'react'; import React, {Component} from 'react';
import AuthHandler from "../../../../api/authHandler"; import {Badge, FormGroup, Input, Label} from 'reactstrap';
import PlatformMgtApi from "../../../../api/platformMgtApi";
import {FormGroup, Input, Label} from 'reactstrap';
/** /**
* The first step of the application creation wizard. * The Second step of application create wizard.
* This contains following components: * This contains following components.
* * Application Title * * App Title
* * Store Type * * Short Description
* * Application Platform * * Application Description
* * Application Visibility
* * Application Tags : {Used Material UI Chip component}
* * Application Category.
* * Platform Specific properties.
* *
* Parent Component: Create * Parent Component: Create
* Props: * Props:
* 1. handleNext: {type: function, Invokes handleNext function of parent component} * * handleNext : {type: function, Invokes handleNext function in Parent.}
* 2. setData : {type: function, Sets current form data to the state of the parent component} * * handlePrev : {type: function, Invokes handlePrev function in Parent}
* 3. removeData: {type: function, Invokes the removeStepData function click of parent} * * setData : {type: function, Invokes setStepData function in Parent}
* * removeData : {type: Invokes removeStepData function in Parent}
* */ * */
class Step1 extends Component { class Step1 extends Component {
constructor() { constructor() {
super(); super();
this.setPlatforms = this.setPlatforms.bind(this);
this.setStepData = this.setStepData.bind(this);
this.cancel = this.cancel.bind(this);
this.platforms = [];
this.state = { this.state = {
finished: false, tags: [],
stepIndex: 0, icon: [],
store: 1,
platformSelectedIndex: 0,
platform: "",
platforms: [],
stepData: [],
title: "", title: "",
titleError: "" errors: {},
banner: [],
defValue: "",
category: 0,
visibility: 0,
description: "",
screenshots: [],
identifier: "",
shortDescription: ""
}; };
this.scriptId = "application-create-step1"; this.scriptId = "application-create-step2";
}
componentDidMount() {
//Get the list of available platforms and set to the state.
PlatformMgtApi.getPlatforms().then(response => {
console.log(response);
this.setPlatforms(response.data);
}).catch(err => {
AuthHandler.unauthorizedErrorHandler(err);
})
} }
/** /**
* Extract the platforms from the response data and populate the state. * Create a tag on Enter key press and set it to the state.
* @param platforms: The array returned as the response. * Clears the tags text field.
* Chip gets two parameters: Key and value.
* */ * */
setPlatforms(platforms) { addTags(event) {
let tmpPlatforms = []; let tags = this.state.tags;
for (let index in platforms) { if (event.charCode === 13) {
let platform = {}; event.preventDefault();
platform = platforms[index]; tags.push({key: Math.floor(Math.random() * 1000), value: event.target.value});
tmpPlatforms.push(platform); this.setState({tags, defValue: ""}, console.log(tags));
} }
this.setState({platforms: tmpPlatforms, platformSelectedIndex: 0, platform: tmpPlatforms[0].name})
} }
/** /**
* Persist the current form data to the state. * Set the value for tag.
* */ * */
setStepData() { handleTagChange(event) {
console.log("Platforms", this.state.platforms); let defaultValue = this.state.defValue;
let step = { defaultValue = event.target.value;
store: this.state.store, this.setState({defValue: defaultValue})
platform: this.state.platforms[this.state.platformSelectedIndex]
};
console.log(step);
this.props.setData("step1", {step: step});
} }
cancel() { /**
* Invokes the handleNext function in Create component.
* */
handleNext() {
let fields = [{name: "Title", value: this.state.title},
{name: "Short Description", value: this.state.shortDescription},
{name: "Description", value: this.state.description},
{name: "Banner", value: this.state.banner},
{name: "Screenshots", value: this.state.screenshots},
{name: "Identifier", value: this.state.identifier},
{name: "Icon", value: this.state.icon}];
this.validate(fields);
}
/**
* Invokes the handlePrev function in Create component.
* */
handlePrev() {
this.props.handlePrev();
} }
/** /**
* Triggers when changing the Platform selection. * Handles Chip delete function.
* Removes the tag from state.tags
* */
handleRequestDelete(event) {
this.chipData = this.state.tags;
console.log(event.target);
const chipToDelete = this.chipData.map((chip) => chip.value).indexOf(event.target.value);
this.chipData.splice(chipToDelete, 1);
this.setState({tags: this.chipData});
};
/**
* Validate the form.
* */ * */
onChangePlatform(event) { validate(fields) {
console.log(event.target.value, this.state.platforms); let errors = {};
let id = event.target.value; let errorsPresent = false;
let selectedPlatform = this.state.platforms.filter((platform) => { fields.forEach(function (field) {
return platform.identifier === id; switch (field.name) {
case 'Title': {
if (field.value === "") {
errors[field.name] = field.name + " is required!";
errorsPresent = true;
} else {
errorsPresent = false;
}
break;
}
case 'Identifier': {
if (field.value === "") {
errors[field.name] = field.name + " is required!";
errorsPresent = true;
} else {
errorsPresent = false;
}
break;
}
case 'Short Description': {
if (field.value === "") {
errors[field.name] = field.name + " is required!";
errorsPresent = true;
} else {
errorsPresent = false;
}
break;
}
case 'Description': {
if (field.value === "") {
errors[field.name] = field.name + " is required!";
errorsPresent = true;
} else {
errorsPresent = false;
}
break;
}
case 'Banner': {
if (field.value.length === 0) {
errors[field.name] = field.name + " is required!";
errorsPresent = true;
} else {
errorsPresent = false;
}
break;
}
case 'Icon': {
if (field.value.length === 0) {
errors[field.name] = field.name + " is required!";
errorsPresent = true;
} else {
errorsPresent = false;
}
break;
}
case 'Screenshots': {
if (field.value.length < 3) {
errors[field.name] = "3 " + field.name + " are required!";
errorsPresent = true;
} else {
errorsPresent = false;
}
break;
}
}
}); });
console.log(selectedPlatform);
this.setState({platform: selectedPlatform}); if (!errorsPresent) {
this.setStepData();
} else {
this.setState({errors: errors}, console.log(errors));
}
}
/**
* Creates an object with the current step data and persist in the parent.
* */
setStepData() {
let stepData = {};
this.props.setData("step2", {step: stepData});
}; };
/** /**
* Triggers when changing the Store selection. * Set text field values to state.
* */ * */
onChangeStore(event) { onTextFieldChange(event, value) {
console.log(event.target.value); let field = event.target.id;
this.setState({store: event.target.value}); switch (field) {
case "name": {
this.setState({name: value});
break;
}
case "shortDescription": {
this.setState({shortDescription: value});
break;
}
case "description": {
this.setState({description: value});
break;
}
case "identifier": {
this.setState({identifier: value});
break;
}
}
}; };
render() { render() {
console.log(this.state.visibilityComponent);
return ( return (
<div> <div className="createStep2Content">
<div>
<FormGroup> <div>
<Label for="store">Store Type</Label> <FormGroup>
<Input <Label for="app-title">Title*</Label>
type="select" <Input
name="store" required
id="store" type="text"
className="input-custom" name="appName"
onChange={this.onChangeStore.bind(this)} id="app-title"
> />
<option>Enterprise</option> </FormGroup>
<option>Public</option> <FormGroup>
</Input> <Label for="app-description">Description*</Label>
</FormGroup> <Input
<FormGroup> required
<Label for="store">Platform</Label> type="textarea"
<Input name="appDescription"
type="select" id="app-description"
name="store" />
id="store" </FormGroup>
onChange={this.onChangePlatform.bind(this)} <FormGroup>
> <Label for="app-category">Category</Label>
{this.state.platforms.length > 0 ? this.state.platforms.map(platform => { <Input
return ( type="select"
<option value={platform.identifier}> name="category"
{platform.name} id="app-category"
</option> >
) <option>Business</option>
}) : <option>No Platforms</option>} </Input>
</Input> </FormGroup>
</FormGroup> <FormGroup>
<Label for="app-visibility">Visibility</Label>
<Input
type="select"
name="visibility"
id="app-visibility"
>
<option>Devices</option>
<option>Roles</option>
<option>Groups</option>
</Input>
</FormGroup>
<FormGroup>
<Label for="app-tags">Tags*</Label>
<Input
required
type="text"
value={this.state.defValue}
name="app-tags"
id="app-tags"
onChange={this.handleTagChange.bind(this)}
onKeyPress={this.addTags.bind(this)}
/>
<div id="batch-content">
{this.state.tags.map(tag => {
return (
<Badge
style={{margin: '0 2px 0 2px'}}
value={tag.value}
onClick={this.handleRequestDelete.bind(this)}
>
{tag.value}
</Badge>
)
}
)}
</div>
</FormGroup>
</div>
</div>
</div> </div>
); );
} }
} }
Step1.propTypes = { Step1.prototypes = {
handleNext: PropTypes.func, handleNext: PropTypes.func,
handlePrev: PropTypes.func,
setData: PropTypes.func, setData: PropTypes.func,
removeData: PropTypes.func removeData: PropTypes.func
}; };

347
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step2.jsx
Unescape View File

@ -18,299 +18,148 @@
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import React, {Component} from 'react'; import React, {Component} from 'react';
import {Badge, FormGroup, Input, Label} from 'reactstrap'; import AuthHandler from "../../../../api/authHandler";
import PlatformMgtApi from "../../../../api/platformMgtApi";
import {FormGroup, Input, Label} from 'reactstrap';
/** /**
* The Second step of application create wizard. * The first step of the application creation wizard.
* This contains following components. * This contains following components:
* * App Title * * Application Title
* * Short Description * * Store Type
* * Application Description * * Application Platform
* * Application Visibility
* * Application Tags : {Used Material UI Chip component}
* * Application Category.
* * Platform Specific properties.
* *
* Parent Component: Create * Parent Component: Create
* Props: * Props:
* * handleNext : {type: function, Invokes handleNext function in Parent.} * 1. handleNext: {type: function, Invokes handleNext function of parent component}
* * handlePrev : {type: function, Invokes handlePrev function in Parent} * 2. setData : {type: function, Sets current form data to the state of the parent component}
* * setData : {type: function, Invokes setStepData function in Parent} * 3. removeData: {type: function, Invokes the removeStepData function click of parent}
* * removeData : {type: Invokes removeStepData function in Parent}
* */ * */
class Step2 extends Component { class Step2 extends Component {
constructor() { constructor() {
super(); super();
this.setPlatforms = this.setPlatforms.bind(this);
this.setStepData = this.setStepData.bind(this);
this.cancel = this.cancel.bind(this);
this.platforms = [];
this.state = { this.state = {
tags: [], finished: false,
icon: [], stepIndex: 0,
store: 1,
platformSelectedIndex: 0,
platform: "",
platforms: [],
stepData: [],
title: "", title: "",
errors: {}, titleError: ""
banner: [],
defValue: "",
category: 0,
visibility: 0,
description: "",
screenshots: [],
identifier: "",
shortDescription: ""
}; };
this.scriptId = "application-create-step2"; this.scriptId = "application-create-step1";
} }
/** componentDidMount() {
* Create a tag on Enter key press and set it to the state. //Get the list of available platforms and set to the state.
* Clears the tags text field. PlatformMgtApi.getPlatforms().then(response => {
* Chip gets two parameters: Key and value. console.log(response);
* */ this.setPlatforms(response.data);
addTags(event) { }).catch(err => {
let tags = this.state.tags; AuthHandler.unauthorizedErrorHandler(err);
if (event.charCode === 13) { })
event.preventDefault();
tags.push({key: Math.floor(Math.random() * 1000), value: event.target.value});
this.setState({tags, defValue: ""}, console.log(tags));
}
} }
/** /**
* Set the value for tag. * Extract the platforms from the response data and populate the state.
* @param platforms: The array returned as the response.
* */ * */
handleTagChange(event) { setPlatforms(platforms) {
let defaultValue = this.state.defValue; let tmpPlatforms = [];
defaultValue = event.target.value; for (let index in platforms) {
this.setState({defValue: defaultValue}) let platform = {};
} platform = platforms[index];
tmpPlatforms.push(platform);
/** }
* Invokes the handleNext function in Create component. this.setState({platforms: tmpPlatforms, platformSelectedIndex: 0, platform: tmpPlatforms[0].name})
* */
handleNext() {
let fields = [{name: "Title", value: this.state.title},
{name: "Short Description", value: this.state.shortDescription},
{name: "Description", value: this.state.description},
{name: "Banner", value: this.state.banner},
{name: "Screenshots", value: this.state.screenshots},
{name: "Identifier", value: this.state.identifier},
{name: "Icon", value: this.state.icon}];
this.validate(fields);
} }
/** /**
* Invokes the handlePrev function in Create component. * Persist the current form data to the state.
* */ * */
handlePrev() { setStepData() {
this.props.handlePrev(); console.log("Platforms", this.state.platforms);
let step = {
store: this.state.store,
platform: this.state.platforms[this.state.platformSelectedIndex]
};
console.log(step);
this.props.setData("step1", {step: step});
} }
/** cancel() {
* Handles Chip delete function.
* Removes the tag from state.tags
* */
handleRequestDelete(event) {
this.chipData = this.state.tags;
console.log(event.target);
const chipToDelete = this.chipData.map((chip) => chip.value).indexOf(event.target.value);
this.chipData.splice(chipToDelete, 1);
this.setState({tags: this.chipData});
};
/**
* Validate the form.
* */
validate(fields) {
let errors = {};
let errorsPresent = false;
fields.forEach(function (field) {
switch (field.name) {
case 'Title': {
if (field.value === "") {
errors[field.name] = field.name + " is required!";
errorsPresent = true;
} else {
errorsPresent = false;
}
break;
}
case 'Identifier': {
if (field.value === "") {
errors[field.name] = field.name + " is required!";
errorsPresent = true;
} else {
errorsPresent = false;
}
break;
}
case 'Short Description': {
if (field.value === "") {
errors[field.name] = field.name + " is required!";
errorsPresent = true;
} else {
errorsPresent = false;
}
break;
}
case 'Description': {
if (field.value === "") {
errors[field.name] = field.name + " is required!";
errorsPresent = true;
} else {
errorsPresent = false;
}
break;
}
case 'Banner': {
if (field.value.length === 0) {
errors[field.name] = field.name + " is required!";
errorsPresent = true;
} else {
errorsPresent = false;
}
break;
}
case 'Icon': {
if (field.value.length === 0) {
errors[field.name] = field.name + " is required!";
errorsPresent = true;
} else {
errorsPresent = false;
}
break;
}
case 'Screenshots': {
if (field.value.length < 3) {
errors[field.name] = "3 " + field.name + " are required!";
errorsPresent = true;
} else {
errorsPresent = false;
}
break;
}
}
});
if (!errorsPresent) {
this.setStepData();
} else {
this.setState({errors: errors}, console.log(errors));
}
} }
/** /**
* Creates an object with the current step data and persist in the parent. * Triggers when changing the Platform selection.
* */ * */
setStepData() { onChangePlatform(event) {
let stepData = {}; console.log(event.target.value, this.state.platforms);
let id = event.target.value;
let selectedPlatform = this.state.platforms.filter((platform) => {
return platform.identifier === id;
});
console.log(selectedPlatform);
this.props.setData("step2", {step: stepData}); this.setState({platform: selectedPlatform});
}; };
/** /**
* Set text field values to state. * Triggers when changing the Store selection.
* */ * */
onTextFieldChange(event, value) { onChangeStore(event) {
let field = event.target.id; console.log(event.target.value);
switch (field) { this.setState({store: event.target.value});
case "name": {
this.setState({name: value});
break;
}
case "shortDescription": {
this.setState({shortDescription: value});
break;
}
case "description": {
this.setState({description: value});
break;
}
case "identifier": {
this.setState({identifier: value});
break;
}
}
}; };
render() { render() {
console.log(this.state.visibilityComponent);
return ( return (
<div className="createStep2Content"> <div>
<div>
<div> <FormGroup>
<FormGroup> <Label for="store">Store Type</Label>
<Label for="app-title">Title*</Label> <Input
<Input type="select"
required name="store"
type="text" id="store"
name="appName" className="input-custom"
id="app-title" onChange={this.onChangeStore.bind(this)}
/> >
</FormGroup> <option>Enterprise</option>
<FormGroup> <option>Public</option>
<Label for="app-description">Description*</Label> </Input>
<Input </FormGroup>
required <FormGroup>
type="textarea" <Label for="store">Platform</Label>
name="appDescription" <Input
id="app-description" type="select"
/> name="store"
</FormGroup> id="store"
<FormGroup> onChange={this.onChangePlatform.bind(this)}
<Label for="app-category">Category</Label> >
<Input {this.state.platforms.length > 0 ? this.state.platforms.map(platform => {
type="select" return (
name="category" <option value={platform.identifier}>
id="app-category" {platform.name}
> </option>
<option>Business</option> )
</Input> }) : <option>No Platforms</option>}
</FormGroup> </Input>
<FormGroup> </FormGroup>
<Label for="app-visibility">Visibility</Label>
<Input
type="select"
name="visibility"
id="app-visibility"
>
<option>Devices</option>
<option>Roles</option>
<option>Groups</option>
</Input>
</FormGroup>
<FormGroup>
<Label for="app-tags">Tags*</Label>
<Input
required
type="text"
value={this.state.defValue}
name="app-tags"
id="app-tags"
onChange={this.handleTagChange.bind(this)}
onKeyPress={this.addTags.bind(this)}
/>
<div id="batch-content">
{this.state.tags.map(tag => {
return (
<Badge
style={{margin: '0 2px 0 2px'}}
value={tag.value}
onClick={this.handleRequestDelete.bind(this)}
>
{tag.value}
</Badge>
)
}
)}
</div>
</FormGroup>
</div>
</div>
</div> </div>
); );
} }
} }
Step2.prototypes = { Step2.propTypes = {
handleNext: PropTypes.func, handleNext: PropTypes.func,
handlePrev: PropTypes.func,
setData: PropTypes.func, setData: PropTypes.func,
removeData: PropTypes.func removeData: PropTypes.func
}; };

1
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Create/CreateSteps/Step3.jsx
Unescape View File

@ -25,7 +25,6 @@ import SelectField from 'material-ui/SelectField';
import {FormGroup, Label} from 'reactstrap'; import {FormGroup, Label} from 'reactstrap';
import AppImage from "../../../UIComponents/AppImage/AppImage"; import AppImage from "../../../UIComponents/AppImage/AppImage";
/** /**
* The Third step of application create wizard. * The Third step of application create wizard.
* This contains following components. * This contains following components.

2
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Edit/Base/ApplicationEditBaseLayout.jsx
Unescape View File

@ -19,7 +19,7 @@
import './baseLayout.css'; import './baseLayout.css';
import {Col, Row} from "reactstrap"; import {Col, Row} from "reactstrap";
import React, {Component} from 'react'; import React, {Component} from 'react';
import GeneralInfo from "../GeneralInfo"; import GeneralInfo from "../GenenralInfo/GeneralInfo";
import ReleaseManager from '../../Release/ReleaseMgtBase/ReleaseManager'; import ReleaseManager from '../../Release/ReleaseMgtBase/ReleaseManager';
class ApplicationEdit extends Component { class ApplicationEdit extends Component {

1
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Edit/Base/baseLayout.css
Unescape View File

@ -22,6 +22,7 @@
width: 100%; width: 100%;
margin: 0; margin: 0;
font-size: 20px; font-size: 20px;
border-bottom: solid 1px #d8d8d8;
} }
.application-header-text { .application-header-text {

0
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Edit/GeneralInfo.jsx → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Edit/GenenralInfo/GeneralInfo.jsx
Unescape View File

0
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Edit/generalInfo.css → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/Edit/GenenralInfo/generalInfo.css
Unescape View File

2
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/Drawer/drawer.css
Unescape View File

@ -21,7 +21,7 @@
width: 0; /* 0 width - change this with JavaScript */ width: 0; /* 0 width - change this with JavaScript */
position: fixed; /* Stay in place */ position: fixed; /* Stay in place */
z-index: 1; /* Stay on top */ z-index: 1; /* Stay on top */
top: 5%; top: 8%;
right: 0%; right: 0%;
background-color: #ffffff; background-color: #ffffff;
overflow-x: hidden; /* Disable horizontal scroll */ overflow-x: hidden; /* Disable horizontal scroll */

1
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/FloatingButton/floatingButton.css
Unescape View File

@ -42,6 +42,7 @@
.btn-circle:hover { .btn-circle:hover {
cursor: pointer; cursor: pointer;
background-color: rgb(255, 93, 2);
} }
.primary { .primary {

35
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/index.css
Unescape View File

@ -18,7 +18,7 @@
body { body {
width: 100%; width: 100%;
font-family: sans-serif; font-family: Roboto sans-serif;
} }
#userName { #userName {
@ -48,10 +48,11 @@ body {
#container { #container {
background-color: #ffffff; background-color: #ffffff;
padding: 0;
} }
#header-content { #header-content {
height: 100px; height: 125px;
width: 100%; width: 100%;
margin: 0 10px 0 0; margin: 0 10px 0 0;
background-color: #3b33bd; background-color: #3b33bd;
@ -61,6 +62,12 @@ body {
box-shadow: -2px 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); box-shadow: -2px 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
} }
#header {
margin: 16px 16px 20px 16px;
height: 100%;
position: relative;
}
#application-content { #application-content {
height: auto; height: auto;
width: 80%; width: 80%;
@ -69,24 +76,14 @@ body {
padding: 10px 10px 10px 10px; padding: 10px 10px 10px 10px;
} }
.add-btn { #add-btn-container {
position: absolute; position: absolute;
left:12%; left: 12%;
top: 35px; top: 100px;
}
.add-btn.div {
position: relative;
margin-top: 20px;
margin-left: 20px;
}
#fw-api:before {
content: '\e601';
} }
.btn-header { .btn-header {
margin-top: 10px; margin-top: 15px;
margin-right: 20px; margin-right: 20px;
color: white; color: white;
} }
@ -113,8 +110,9 @@ body {
color: #a8a8a8; color: #a8a8a8;
position: relative; position: relative;
float: right; float: right;
top: 35px; top: 75px;
margin-right: 10px; left: 80px;
margin-right: 16px;
} }
#search { #search {
@ -175,7 +173,6 @@ body {
margin: 70px 40px 40px 150px; margin: 70px 40px 40px 150px;
} }
.applicationCreateScreenshotDropZone { .applicationCreateScreenshotDropZone {
width: 150px; width: 150px;
height: 150px; height: 150px;

4
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/webpack.config.js
Unescape View File

@ -48,6 +48,10 @@ const config = {
test: /\.css$/, test: /\.css$/,
use: [ 'style-loader', 'css-loader' ] use: [ 'style-loader', 'css-loader' ]
}, },
{
test: /\.scss$/,
use: [ 'style-loader', 'scss-loader' ]
},
{ {
test: /\.less$/, test: /\.less$/,
use: [{ use: [{

Write Preview
Loading…
Cancel
Save