diff --git a/src/home/img/circle.png b/src/home/img/circle.png new file mode 100644 index 000000000..53748c9fb Binary files /dev/null and b/src/home/img/circle.png differ diff --git a/src/home/img/code.png b/src/home/img/code.png new file mode 100644 index 000000000..b7bde5fc1 Binary files /dev/null and b/src/home/img/code.png differ diff --git a/src/home/img/glass.png b/src/home/img/glass.png new file mode 100644 index 000000000..8cada7b90 Binary files /dev/null and b/src/home/img/glass.png differ diff --git a/src/home/img/grid.png b/src/home/img/grid.png new file mode 100755 index 000000000..905bd4b47 Binary files /dev/null and b/src/home/img/grid.png differ diff --git a/src/home/img/logo.png b/src/home/img/logo.png new file mode 100644 index 000000000..ad60b8205 Binary files /dev/null and b/src/home/img/logo.png differ diff --git a/src/home/img/pillar.png b/src/home/img/pillar.png new file mode 100644 index 000000000..568b3df4a Binary files /dev/null and b/src/home/img/pillar.png differ diff --git a/src/home/img/text1.png b/src/home/img/text1.png new file mode 100644 index 000000000..ab3d3d241 Binary files /dev/null and b/src/home/img/text1.png differ diff --git a/src/home/img/text2.png b/src/home/img/text2.png new file mode 100644 index 000000000..1d84b0422 Binary files /dev/null and b/src/home/img/text2.png differ diff --git a/src/home/img/text3.png b/src/home/img/text3.png new file mode 100644 index 000000000..d2b525cbd Binary files /dev/null and b/src/home/img/text3.png differ diff --git a/src/home/img/text4.png b/src/home/img/text4.png new file mode 100644 index 000000000..dffdecf5f Binary files /dev/null and b/src/home/img/text4.png differ diff --git a/src/home/img/整体@2x.png b/src/home/img/整体@2x.png new file mode 100644 index 000000000..6f1564ab1 Binary files /dev/null and b/src/home/img/整体@2x.png differ diff --git a/src/home/index.jsx b/src/home/index.jsx index ac4aa1d4b..bf3bd3c6f 100644 --- a/src/home/index.jsx +++ b/src/home/index.jsx @@ -1,7 +1,18 @@ import React, { useEffect, useState } from 'react'; +import { Button } from 'antd'; import NewSlide from "./NewSlide"; import { TPMIndexHOC } from '../modules/tpm/TPMIndexHOC'; +import circle from './img/circle.png'; +import code from './img/code.png'; +import glass from './img/glass.png'; +import logo from './img/logo.png'; +import pillar from './img/pillar.png'; +import text1 from './img/text1.png'; +import text2 from './img/text2.png'; +import text3 from './img/text3.png'; +import text4 from './img/text4.png'; + import './index.scss'; function HomePage(props) { @@ -9,7 +20,38 @@ function HomePage(props) { return (
+
+
+
+

红山开源

+
+ 群智共享 + 开源开放 + 协同创新 + 择优孵化 +
+
红山开源是一个依托互联网群体智慧实现世界范围内资源深度融合、开放共享和协同创新的开源社区，是集开源项目演化发展、科研任务众包、竞赛组织选拔和社区开放交流为一体的创新科研服务平台。红山开源致力于打造一个“开放、汇聚、协同、众创”的生态空间。 +
+ +
+ +
+ + + + + + + + + +
+
+ + + +
@@ -30,21 +72,6 @@ function HomePage(props) { - - {/* - - - - - - - - - - - - - */}
diff --git a/src/home/index.scss b/src/home/index.scss index c1e17ea48..35968c3e8 100644 --- a/src/home/index.scss +++ b/src/home/index.scss @@ -1,27 +1,131 @@ -.homePage{ - margin-top:-6px; +.homePage { + margin-top: -6px; - .first-edition{ + .first-edition { height: 80vh; background: linear-gradient( - #1A2358 0%, - #12277B 33%, - #0C2D8F 67%, - #002A89 100% - ); + #1a2358 0%, + #12277b 33%, + #0c2d8f 67%, + #002a89 100% + ); + } + + .grid-picture { + height: 100%; + background: url(./img/grid.png) no-repeat; + } + + .homepage-content { + display: flex; + justify-content: space-between; + width: 1200px; + height: 100%; + max-width: 100%; + margin: 0 auto; + } + + .website { + display: flex; + flex-direction: column; + justify-content: center; + // width: 48%; + height: 100%; + color: #fff; + .website-title { + color: #fff; + font-size: 34px; + } + .website-vision { + margin-bottom: 36px; + color: #ff832b; + font-size: 25px; + span { + margin-right: 30px; + } + } + .website-des { + font-size: 12px; + margin-bottom: 40px; + } + .website-more { + width: 140px; + } + } + + .play-img { + display: flex; + flex: none; + justify-content: center; + align-items: center; + position: relative; + width: 600px; + height: 580px; + img { + width: 25%; + } + + .play-glass { + position: relative; + width: 50%; + z-index: 1; + } + .play-circle { + position: absolute; + // width: 25%; + // bottom: 0; + // right: 10%; + + width: 25%; + bottom: 3%; + right: 18%; + z-index: 2; + } + .play-pillar { + position: absolute; + left: 0; + top: 25%; + } + .play-code { + position: absolute; + right: 0; + top: 10%; + } + .play-logo { + position: absolute; + } + .play-text1 { + position: absolute; + // right: 10%; + // z-index: 2; + + right: 10%; + z-index: 2; + } + .play-text2 { + position: absolute; + // bottom: 30%; + // left: 17.5%; + // z-index: 2; + + bottom: 28%; + left: 13%; + z-index: 2; + width: 30%; + } + .play-text3 { + position: absolute; + right: 10%; + top: -6%; + } + .play-text4 { + position: absolute; + top: 0; + left: 20%; + } } } - -.hero-waves { - display: block; - width: 100%; - height: 200px; - position: relative; -} - - - .news-slide { margin: 20px auto; width: 600px; @@ -29,9 +133,9 @@ .slick-track > div { max-width: 500px; position: relative; - transition: all .7s; + transition: all 0.7s; border: 1px solid #fff; - .testimonial-item{ + .testimonial-item { background: #ffffff; margin-bottom: 20px; padding: 30px 50px 40px 50px; @@ -65,7 +169,7 @@ .waves-header { position: relative; text-align: center; - background: #002A89; + background: #002a89; // background: linear-gradient( // 60deg, // rgba(84, 58, 183, 1) 0%, diff --git a/src/modules/tpm/NewHeader.js b/src/modules/tpm/NewHeader.js index bac9f5063..2cb2f6623 100644 --- a/src/modules/tpm/NewHeader.js +++ b/src/modules/tpm/NewHeader.js @@ -3,7 +3,7 @@ import { Link } from "react-router-dom"; import AccountProfile from "../user/AccountProfile"; import { getImageUrl,getLogoImageUrl } from 'educoder' import axios from 'axios'; -import { Modal, Input, message, notification } from 'antd'; +import { Modal, Input, message, notification, Button } from 'antd'; import LoginDialog from '../login/LoginDialog'; import GotoQQgroup from '../../modal/GotoQQgroup' @@ -13,7 +13,7 @@ import 'antd/lib/radio/style/index.css'; import 'antd/lib/input/style/index.css'; import './TPMIndex.css'; import './css/headerExcess.css'; -import logo from './images/logo.png'; +import logo from './images/hskylogo.png'; const $ = window.$ // TODO 这部分脚本从公共脚本中直接调用 @@ -621,10 +621,7 @@ class NewHeader extends Component { goshowqqgtounp, } = this.state; - let activeIndex = ''; - if(match.path === '/'){ - activeIndex = true; - } + let activeIndex =match.path === '/'?true: ''; /*用户名称 用户头像url*/ // let activeIndex = false; @@ -724,15 +721,7 @@ class NewHeader extends Component { { mygetHelmetapi2 && mygetHelmetapi2.nav_logo_url ? -
- 可控开源社区 - { - activeIndex&&
-

红山开源

-

OSRedM

-
- } -
+ 可控开源社区 : "" } @@ -777,7 +766,7 @@ class NewHeader extends Component {
{this.props.user && this.props.user.login &&
- +
{ @@ -829,20 +818,15 @@ class NewHeader extends Component {
- {user === undefined ? + {user === undefined || user.login === "" ? - this.educoderlogin()} className={`mr5 ${activeIndex ? 'color-white' : 'color-grey-6'}`}>登录 + this.educoderlogin()} className={`mr5 ${activeIndex ? 'color-home' : 'color-grey-6'}`}>登录 { - mygetHelmetapi2 && mygetHelmetapi2.new_course && mygetHelmetapi2.new_course.register_url && - 注册 - } - - : user.login === "" ? - - this.educoderlogin()} className={`mr5 ${activeIndex ? 'color-white' : 'color-grey-6'}`}>登录 - { - mygetHelmetapi2 && mygetHelmetapi2.new_course && mygetHelmetapi2.new_course.register_url && - 注册 + mygetHelmetapi2 && mygetHelmetapi2.new_course && mygetHelmetapi2.new_course.register_url && ( + activeIndex ? + : + 注册 + ) } : diff --git a/src/modules/tpm/css/headerExcess.css b/src/modules/tpm/css/headerExcess.css index afe7cc066..b4cf8852f 100644 --- a/src/modules/tpm/css/headerExcess.css +++ b/src/modules/tpm/css/headerExcess.css @@ -1,3 +1,7 @@ +.homePage .head-nav ul#header-nav li a{ + font-size: 15px; + color: #fff; +} .head-nav ul#header-nav li:hover a, .head-nav ul#header-nav li.active a{ color: #1484EF; } @@ -15,29 +19,35 @@ background-color: #1A2358; /* height: 64px; */ } -.newHeaders.homePage .head-nav ul#header-nav li a{ - font-size: 15px; - color: #fff; -} -.logoDiv{ + +/* .logoDiv{ display: flex; align-items: center; color: #fff; -} +} */ .homePage .logoDiv img{ min-width: 45px; height: 45px; } -.logo-text{ - margin-left: .2em; - text-align: center; -} -.logo-text p{ - line-height: 1.1; +.homePage .color-home{ + color: #fff; } -.logo-English{ - font-size: .8em; +.homePage .color-home:hover{ + color: #4154F1; } + +.homePage .ant-btn-primary{ + background-color: #4154F1; + border-color: #4154F1; +} + +.homePage .register-button{ + height: 43px; + margin-left:20px; + padding: 0 25px; + font-size: 14px; + +} \ No newline at end of file diff --git a/src/modules/tpm/images/hskylogo.png b/src/modules/tpm/images/hskylogo.png new file mode 100755 index 000000000..39706d1cb Binary files /dev/null and b/src/modules/tpm/images/hskylogo.png differ