Display screenshots and icon

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

@@ -1,37 +1,28 @@
-.App {
-  text-align: center;
-}
-
-.App-logo {
-  animation: App-logo-spin infinite 20s linear;
-  height: 40vmin;
-  pointer-events: none;
-}
-
-.App-header {
-  background-color: #282c34;
-  min-height: 100vh;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  font-size: calc(10px + 2vmin);
-  color: white;
-}
-
-.App-link {
-  color: #61dafb;
-}
-
-@keyframes App-logo-spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}
-
 .ant-upload.ant-upload-drag {
   height: 170px;
 }
+
+.release .release-icon{
+  margin-right: 15px;
+}
+
+.release .release-icon img{
+  width: 100%;
+  border-radius: 100%;
+}
+.release .release-screenshot img{
+  width: 100%;
+  border-radius: 15px;
+  padding: 5px;
+}
+
+.logo {
+  width: 120px;
+  height: 31px;
+  margin: 16px 0 16px 20px;
+  float: left;
+}
+
+.logo img{
+  height: 35px;
+}

components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/release/ReleaseView.js

@@ -1,17 +1,18 @@
 import React from "react";
 import {Avatar, Row, Col, Typography} from "antd";
+import "../../../App.css";
 
 const {Title, Text} = Typography;
 
 class ReleaseView extends React.Component {
     render() {
         const release = this.props.release;
+        console.log(release);
         return (
-            <div>
+            <div className="release">
                 <Row>
-                    <Col span={4}>
-                        <Avatar size={128} shape="square"
-                                src={release.iconPath}/>
+                    <Col span={4} className="release-icon">
+                        <img src={release.iconPath}/>
                     </Col>
                     <Col span={18}>
                         <Title level={2}>App Name</Title>
@@ -21,8 +22,14 @@ class ReleaseView extends React.Component {
                 </Row>
                 <br/>
                 <Row>
-                    <Col span={6}>
-                        <img style={{width:"100%"}} src={release.screenshotPath1}/>
+                    <Col span={6} className="release-screenshot">
+                        <img src={release.screenshotPath1}/>
+                    </Col>
+                    <Col span={6} className="release-screenshot">
+                        <img src={release.screenshotPath2}/>
+                    </Col>
+                    <Col span={6} className="release-screenshot">
+                        <img src={release.screenshotPath3}/>
                     </Col>
                 </Row>
             </div>

components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/Dashboard.js

@@ -3,12 +3,11 @@ import {Layout, Menu, Icon} from 'antd';
 
 const {Header, Content, Footer} = Layout;
 
-import styles from './Dashboard.less';
 import Logo from "../../../public/images/logo.svg";
 import {Link, NavLink} from "react-router-dom";
 import RouteWithSubRoutes from "../../components/RouteWithSubRoutes"
 import {Switch, Redirect} from 'react-router'
-
+import "../../App.css";
 
 class Dashboard extends React.Component {
     constructor(props) {
@@ -20,9 +19,10 @@ class Dashboard extends React.Component {
 
     render() {
         return (
+            <div>
                 <Layout className="layout">
                     <Header>
-                    <div className={styles.logo}>
+                        <div className="logo">
                             <img src={Logo}/>
                         </div>
                         <Menu
@@ -32,10 +32,14 @@ class Dashboard extends React.Component {
                             style={{lineHeight: '64px'}}
                         >
                             <Menu.Item key="1"><Link to="/publisher/apps"><Icon type="appstore"/>Apps</Link></Menu.Item>
-                        <Menu.Item key="2"><Link to="/publisher/apps"><Icon type="line-chart"/>Apps</Link></Menu.Item>
-                        <Menu.Item key="3"><Link to="/publisher/apps/new-app"><Icon type="upload"/>Add New App</Link></Menu.Item>
+                            <Menu.Item key="2"><Link to="/publisher/apps"><Icon
+                                type="line-chart"/>Apps</Link></Menu.Item>
+                            <Menu.Item key="3"><Link to="/publisher/apps/new-app"><Icon type="upload"/>Add New
+                                App</Link></Menu.Item>
                         </Menu>
                     </Header>
+                </Layout>
+                <Layout>
                     <Content style={{padding: '0 0'}}>
                         <Switch>
                             <Redirect exact from="/publisher" to="/publisher/apps"/>
@@ -50,6 +54,7 @@ class Dashboard extends React.Component {
                         ©2019 entgra.io
                     </Footer>
                 </Layout>
+            </div>
         );
     }
 }