浏览代码

修改首页面

Csy817 7 年之前
父节点
当前提交
e8ef572c26
共有 4 个文件被更改,包括 99 次插入36 次删除
  1. 45 18
      src/app/App.jsx
  2. 1 10
      src/app/developVersion/index.css
  3. 39 0
      src/index.css
  4. 14 8
      src/login/LoginInput.js

+ 45 - 18
src/app/App.jsx

@@ -1,6 +1,6 @@
 import React, {Component} from 'react';
 import {FormattedMessage} from 'react-intl';
-import {Layout,Button} from 'antd';
+import {Layout,Button, Card, Col, Row} from 'antd';
 import {withRouter} from "react-router-dom";
 
 import './developVersion/index.css';
@@ -23,26 +23,53 @@ class App extends Component {
                             <div className='logo'/>
                         </div>
                     </Header>
-                    <Content style={{ padding: '30px 50px 0', minHeight: '780px' }}>
-                        <div className="home-btn">
-                            <Button type="primary" size='large'
-                                    style={{marginRight:'10px'}}
-                                    onClick={()=>{
-                                        this.props.history.push({
-                                            pathname: `/common`
-                                        })}}>立即体验
-                            </Button>
-                            <Button size='large'
-                                    style={{marginLeft:'10px'}}
-                                    onClick={()=>{
-                                        this.props.history.push({
-                                            pathname: `/developer`
-                                        })}}>开发设计
-                            </Button>
+                    <Content style={{padding: '30px 50px 0', minHeight: '780px' }}>
+                        <div style={{ background: '#fff'}}>
+                            <div className="intro-card" style={{ padding: '30px' }}>
+                                <Row gutter={16}>
+                                    <Col span={8}>
+                                        <Card title="无年费、最低成本">
+                                            <p>案例商城扫码即可体验</p>
+                                            <p>选择案例一键部署生成结果</p>
+                                            <p>即刻拥有自己的公众号、小程序</p>
+                                        </Card>
+                                    </Col>
+                                    <Col span={8}>
+                                        <Card title="无服务器、无需维护">
+                                            <p>再也不用购买服务器</p>
+                                            <p>再也不用专业人员维护服务器</p>
+                                            <p>数据完全属于自己哦!</p>
+                                        </Card>
+                                    </Col>
+                                    <Col span={8}>
+                                        <Card title="无卡死">
+                                            <p>再也不用担心用户一多,页面无法访问啦!</p>
+                                        </Card>
+                                    </Col>
+                                </Row>
+                            </div>
+                            <div className="brief">赶紧来试一试吧!</div>
+                            <div className="home-btn">
+                                <Button type="primary" size='large'
+                                        style={{marginRight:'10px'}}
+                                        onClick={()=>{
+                                            this.props.history.push({
+                                                pathname: `/common`
+                                            })}}>立即体验
+                                </Button>
+                                <Button size='large'
+                                        style={{marginLeft:'10px'}}
+                                        onClick={()=>{
+                                            this.props.history.push({
+                                                pathname: `/developer`
+                                            })}}>开发设计
+                                </Button>
+                            </div>
                         </div>
                     </Content>
                     <Footer style={{ textAlign: 'center' }}>
-                        All right ©2019 Created by Ioobot
+                        版权所有 © 2019 栋天科技
+                        {/*All right ©2019 Created by Ioobot*/}
                     </Footer>
                 </Layout>
             </div>

+ 1 - 10
src/app/developVersion/index.css

@@ -47,7 +47,7 @@
 
 .user-detail{
     width: 200px;
-    height: 350px;
+    /*height: 350px;*/
     background-color: #fff;
     border-radius: 4px;
     box-shadow: 0 4px 8px 0 #c5d9e8;
@@ -81,12 +81,3 @@
 .login-out {
     margin-top: 20px;
 }
-
-.home-btn {
-    background: #fff;
-    padding: 24px;
-    min-height: 780px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-}

+ 39 - 0
src/index.css

@@ -28,4 +28,43 @@ code {
   width: 25%;
   /*color: #ffffff;*/
   line-height: 31px;
+}
+
+.home-btn {
+    background: #fff;
+    padding: 24px;
+    min-height: 280px;
+    display: flex;
+    justify-content: center;
+    /*align-items: center;*/
+    margin-top: 20px;
+}
+
+.ant-card-head-title {
+    padding: 16px 0;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+    flex: 1 1;
+    display: inline-block;
+    font-weight: 600;
+    color: #1890ff;
+    font-size: 20px;
+}
+
+.brief{
+    text-align: center;
+    font-size: 25px;
+    color: #3b3b3c;
+    margin-top: 30px;
+}
+
+.intro-card p{
+    padding-bottom: 10px;
+    color: black;
+}
+
+.intro-card .ant-card {
+    background-color: #f4f5f7;
+    min-height: 214px;
 }

+ 14 - 8
src/login/LoginInput.js

@@ -84,8 +84,8 @@ class LoginInput extends Component {
 
                     return (
                         <div>
-                            <span style={{marginRight: 20}} className='login-title'><b><FormattedMessage id="register"/>:</b></span>
-                            <div style={{marginTop: 10}}>
+                            <span style={{marginRight: 20,color: '#1385e5'}} className='login-title'><b><FormattedMessage id="register"/>:</b></span>
+                            <div style={{marginTop: 15}}>
                                 <span className='login-item'><FormattedMessage id="username"/>: </span>
                                 <Input
                                     placeholder=""
@@ -103,7 +103,7 @@ class LoginInput extends Component {
                                         ''
                                 }
                             </div>
-                            <div style={{marginTop: 10}}>
+                            <div style={{marginTop: 15}}>
                                 <span className='login-item'><FormattedMessage id="password"/>: </span>
                                 <Input
                                     placeholder=""
@@ -114,7 +114,7 @@ class LoginInput extends Component {
                                     style={{width: 200}}
                                 />
                             </div>
-                            <div style={{marginTop: 10}}>
+                            <div style={{marginTop: 15}}>
                                 <span className='login-item'><FormattedMessage id="nickname"/>: </span>
                                 <Input
                                     placeholder=""
@@ -125,7 +125,9 @@ class LoginInput extends Component {
                                     style={{width: 200}}
                                 />
                             </div>
-                            <Button type='primary' onClick={() => {
+                            <Button type='primary'
+                                    style={{margin:'10px 0'}}
+                                    onClick={() => {
                                 request(graphqlUrl, SEARCH_USER, {username: this.state.register_username}).then(data => {
                                     if (data.user_by_props.length === 0) {
                                         let id = idGen('user');
@@ -226,7 +228,7 @@ class LoginInput extends Component {
                                 ''
                             :
                             <div>
-                                <span style={{marginRight: 20}} className='login-title'><b><FormattedMessage id="login"/>:</b></span>
+                                <span style={{marginRight: 20,color: '#1385e5'}} className='login-title'><b><FormattedMessage id="login"/>:</b></span>
                                 <div style={{marginTop: 10}}>
                                     <span className='login-item'><FormattedMessage id="username"/>: </span>
                                     <Input
@@ -249,7 +251,9 @@ class LoginInput extends Component {
                                         style={{width: 200}}
                                     />
                                 </div>
-                                <Button type='primary' onClick={() => {
+                                <Button type='primary'
+                                        style={{margin:'10px 0'}}
+                                        onClick={() => {
                                     this.setState({
                                         hasLogin: true
                                     })
@@ -287,7 +291,9 @@ class LoginInput extends Component {
                             this.state.loginStatus === 'failed' ?
                                 <div>
                                     <span style={{marginRight: '10px'}}><FormattedMessage id="login failed"/></span>
-                                    <Button onClick={() => {
+                                    <Button
+                                        style={{margin:'10px 0'}}
+                                        onClick={() => {
                                         this.setState({
                                             hasLogin: false,
                                             loginStatus: '',