Display screenshots and icon

feature/appm-store/pbac
Jayasanka 6 years ago
parent 14db806fb0
commit 753a347848

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

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

@ -3,12 +3,11 @@ import {Layout, Menu, Icon} from 'antd';
const {Header, Content, Footer} = Layout; const {Header, Content, Footer} = Layout;
import styles from './Dashboard.less';
import Logo from "../../../public/images/logo.svg"; import Logo from "../../../public/images/logo.svg";
import {Link, NavLink} from "react-router-dom"; import {Link, NavLink} from "react-router-dom";
import RouteWithSubRoutes from "../../components/RouteWithSubRoutes" import RouteWithSubRoutes from "../../components/RouteWithSubRoutes"
import { Switch, Redirect } from 'react-router' import {Switch, Redirect} from 'react-router'
import "../../App.css";
class Dashboard extends React.Component { class Dashboard extends React.Component {
constructor(props) { constructor(props) {
@ -20,36 +19,42 @@ class Dashboard extends React.Component {
render() { render() {
return ( return (
<Layout className="layout"> <div>
<Header> <Layout className="layout">
<div className={styles.logo}> <Header>
<img src={Logo}/> <div className="logo">
</div> <img src={Logo}/>
<Menu </div>
theme="light" <Menu
mode="horizontal" theme="light"
defaultSelectedKeys={['2']} mode="horizontal"
style={{lineHeight: '64px'}} defaultSelectedKeys={['2']}
> 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="1"><Link to="/publisher/apps"><Icon type="appstore"/>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
</Menu> type="line-chart"/>Apps</Link></Menu.Item>
</Header> <Menu.Item key="3"><Link to="/publisher/apps/new-app"><Icon type="upload"/>Add New
<Content style={{padding: '0 0'}}> App</Link></Menu.Item>
<Switch> </Menu>
<Redirect exact from="/publisher" to="/publisher/apps"/> </Header>
{this.state.routes.map((route) => ( </Layout>
<RouteWithSubRoutes key={route.path} {...route} /> <Layout>
))} <Content style={{padding: '0 0'}}>
<Switch>
</Switch> <Redirect exact from="/publisher" to="/publisher/apps"/>
{this.state.routes.map((route) => (
</Content> <RouteWithSubRoutes key={route.path} {...route} />
<Footer style={{textAlign: 'center'}}> ))}
©2019 entgra.io
</Footer> </Switch>
</Layout>
</Content>
<Footer style={{textAlign: 'center'}}>
©2019 entgra.io
</Footer>
</Layout>
</div>
); );
} }
} }

Loading…
Cancel
Save