gitlink 首页:合作单位的image以及需求更新

This commit is contained in:
caishi 2021-09-28 16:08:25 +08:00
parent 28f8b6b54c
commit 0c816805fb
68 changed files with 827 additions and 338 deletions

View File

@ -1,8 +1,8 @@
@font-face {
font-family: "iconfont"; /* Project id 2340181 */
src: url('iconfont.woff2?t=1631773579834') format('woff2'),
url('iconfont.woff?t=1631773579834') format('woff'),
url('iconfont.ttf?t=1631773579834') format('truetype');
src: url('iconfont.woff2?t=1632738478946') format('woff2'),
url('iconfont.woff?t=1632738478946') format('woff'),
url('iconfont.ttf?t=1632738478946') format('truetype');
}
.iconfont {
@ -13,6 +13,26 @@
-moz-osx-font-smoothing: grayscale;
}
.icon-xiangyoujiantou:before {
content: "\e8de";
}
.icon-xiangzuojiantou:before {
content: "\e8df";
}
.icon-a-liulanicon2x:before {
content: "\e8dd";
}
.icon-wenjianicon:before {
content: "\e8dc";
}
.icon-a-yuanquan2x:before {
content: "\e8db";
}
.icon-xiangmubiaoqian:before {
content: "\e8da";
}

File diff suppressed because one or more lines are too long

View File

@ -5,6 +5,41 @@
"css_prefix_text": "icon-",
"description": "",
"glyphs": [
{
"icon_id": "630094",
"name": "向右箭头",
"font_class": "xiangyoujiantou",
"unicode": "e8de",
"unicode_decimal": 59614
},
{
"icon_id": "630095",
"name": "向左箭头",
"font_class": "xiangzuojiantou",
"unicode": "e8df",
"unicode_decimal": 59615
},
{
"icon_id": "24600282",
"name": "浏览icon@2x",
"font_class": "a-liulanicon2x",
"unicode": "e8dd",
"unicode_decimal": 59613
},
{
"icon_id": "24567893",
"name": "文件icon",
"font_class": "wenjianicon",
"unicode": "e8dc",
"unicode_decimal": 59612
},
{
"icon_id": "24527422",
"name": "圆圈@2x",
"font_class": "a-yuanquan2x",
"unicode": "e8db",
"unicode_decimal": 59611
},
{
"icon_id": "24378423",
"name": "项目标签",

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -19,46 +19,45 @@ function Footer(){
return(
<div>
<div style={{height:"497px"}}></div>
<div style={{height:"443px"}}></div>
<div className="newFooter edu-txt-center">
{value && showhtml(value)}
{/* <div className="footerInfos">
<ul>
<li>社区</li>
<li><a href={`/`} target="_blank">网站首页</a></li>
<li><a href={`https://www.trustie.net/agreement`} target="_blank">服务协议</a></li>
<li><a href={`https://forum.trustie.net/forums/1168/detail`} target="_blank">帮助中心</a></li>
<li><a href={`https://forum.trustie.net/`} target="_blank">问吧交流</a></li>
<li><a href={`https://www.trustie.net/cooperation`} target="_blank">合作伙伴</a></li>
</ul>
<ul>
<li>支持与服务</li>
<li><a href={`https://forgeplus.trustie.net/docs/api`} target="_blank">API文档</a></li>
<li><a href={`https://forum.trustie.net/forums/1168/detail`} target="_blank">帮助中心</a></li>
<li><a href={`https://git-scm.com`} target="_blank">Git常用命令</a></li>
<li><a href={`https://forum.trustie.net/forums/3080/detail`} target="_blank">DevOps使用文档</a></li>
<li><a href={`https://forgeplus.trustie.net/projects/jasder/forgeplus/tree/master/CHANGELOG.md`} target="_blank">日志更新</a></li>
</ul>
<ul>
<li>合作伙伴</li>
<li><a href={`http://www.sei.pku.edu.cn`} target="_blank">北京大学</a></li>
<li><a href={`http://scse.buaa.edu.cn`} target="_blank">北京航空航天大学</a></li>
<li><a href={`https://www.nju.edu.cn`} target="_blank">南京大学</a></li>
<li><a href={`https://www.xtu.edu.cn`} target="_blank">湘潭大学</a></li>
<li><a href={`http://www.iscas.ac.cn`} target="_blank">ISCAS</a></li>
<li><a href={`https://www.ucloud.cn`} target="_blank">UCloud优刻得</a></li>
<li><a href={`http://www.inforbus.com`} target="_blank">中创软件</a></li>
<li><a href={`https://www.inspur.com`} target="_blank">浪潮集团</a></li>
<li><a href={`http://www.copu.org.cn`} target="_blank">中国开源软件推进联盟</a></li>
<li><a href={`https://www.sjtu.edu.cn`} target="_blank">上海交通大学</a></li>
</ul>
<ul>
<li>合作伙伴</li>
<li><span>热线</span></li>
<li><span>QQ群1071514693</span></li>
</ul>
</div>
<p className="footerCopy">© Copyright 2007~2021 国防科技大学Trustie团队 & IntelliDE <a href="https://beian.miit.gov.cn">湘ICP备 17009477</a></p> */}
{/* <div className="footEdition">
<div className="footContent">
<ul className="center">
<img src={""} alt="Gitlink确实开源" height="29px"/>
<p>确实开源</p>
</ul>
<ul>
<li className="thehead">社区</li>
<li><a href="/">网站首页</a></li>
<li><a href="https://forum.trustie.net/forums/1168/detail">帮助中心</a></li>
<li><a href="https://forum.trustie.net/">论坛交流</a></li>
<li><a href="https://www.trustie.net/cooperation">合作伙伴</a></li>
</ul>
<ul>
<li className="thehead">支持与服务</li>
<li><a href="https://forgeplus.trustie.net/docs/api">API文档</a></li>
<li><a href="https://git-scm.com">Git常用命令</a></li>
<li><a href="https://forum.trustie.net/forums/3080/detail">DevOps使用文档</a></li>
<li><a href='https://www.trustie.net/agreement'>服务协议</a></li>
</ul>
<ul>
<li className="thehead">加入我们</li>
<li className="theline">
<div className="mr50">
<li>公众号</li>
<img src={"Img"} alt="公众号"/>
</div>
<div>
<li>qq群</li>
<img src={"qqImg"} alt="qq群"/>
</div>
</li>
</ul>
</div>
<p className="copyrightDesc">©Copyright 20072021 国防科技大学Gitlink团队 & IntelliDE <br/>湘ICP备 17009477</p>
</div> */}
</div>
</div>
)

View File

@ -126,4 +126,77 @@
width: 110px;
text-align: right;
}
}
.footEdition{
background-color: #171B23;
.footContent{
display: flex;
align-items: flex-start;
padding:86px 0px;
justify-content: space-around;
width: 1200px;
margin:0px auto;
ul{
min-width: 120px;
text-align: left;
margin-right: 80px;
&.center{
text-align: center;
}
&>p{
height: 22px;
font-size: 16px;
font-weight: 400;
color: #FFFFFF;
line-height: 22px;
}
&>img{
width: 100px;
height: 100%;
margin-bottom: 30px;
margin-top: 25px;
border-radius: 10px;
}
li{
height: 20px;
font-size: 14px;
font-weight: 400;
line-height: 20px;
color: #BDC2D1;
margin-bottom: 15px!important;
a{
color: #BDC2D1!important;
&:hover{
text-decoration: underline;
}
}
&.thehead{
height: 25px;
font-size: 18px;
font-weight: 600;
color: #FFFFFF;
line-height: 25px;
margin-bottom: 20px!important;
}
&.theline{
display: flex;
img{
width: 80px;
height: 80px;
border-radius: 3px;
}
}
}
}
}
.copyrightDesc{
font-size: 12px;
font-weight: 400;
color: #BDC2D1;
line-height: 28px;
padding:15px 0px;
text-align: center;
background-color: #1B212C;
}
}

View File

@ -1,22 +1,63 @@
import React , { useEffect } from 'react';
import Beijing from './Img/unit/beijing.png';
import SHJT from './Img/unit/SHJT.png';
import DD from './Img/unit/DD.png';
import HW from './Img/unit/HW.png';
import ML from './Img/unit/ML.png';
import QH from './Img/unit/QH.png';
import QZ from './Img/unit/QZ.png';
import TX from './Img/unit/TX.png';
import XH from './Img/unit/XH.png';
import XJY from './Img/unit/XJY.png';
import ZC from './Img/unit/ZC.png';
import GFKJ from './Img/unit/GFKJ.png';
import BJHKHT from './Img/unit/BJHKHT.png';
import ISCAS from './Img/unit/ISCAS.png';
import NJDX from './Img/unit/NJDX.png';
import CEC from './Img/unit/CEC.png';
import KYRJLM from './Img/unit/KYRJLM.png';
import WXYJY from './Img/unit/WXYJY.png';
import HSKY from './Img/unit/HSKY.png';
import LSLM from './Img/unit/LSLM.png';
import TG from './Img/unit/TG.png';
import LC from './Img/unit/LC.png';
import YKD from './Img/unit/YKD.png';
import { Link } from 'react-router-dom';
const list = [
{image_url:Beijing, name:"111",src:""},
{image_url:Beijing, name:"111",src:""},
{image_url:Beijing, name:"222",src:""},
{image_url:Beijing, name:"111",src:""},
{image_url:Beijing, name:"222",src:""},
{image_url:Beijing, name:"111",src:""},
{image_url:Beijing, name:"222",src:""},
{image_url:Beijing, name:"222",src:""},
{image_url:Beijing, name:"222",src:""},
{image_url:Beijing, name:"222",src:""},
{image_url:Beijing, name:"222",src:""},
{image_url:Beijing, name:"222",src:""},
{image_url:GFKJ, name:"国防科技大学",src:"https://www.nudt.edu.cn/"},
{image_url:TG, name:"头歌",src:"https://www.educoder.net/"},
{image_url:XJY, name:"长沙先进技术研究院",src:"https://www.hnjmrh.gov.cn/newweb/service/detail/305/"},
{image_url:Beijing, name:"北京大学",src:"https://www.pku.edu.cn/"},
{image_url:BJHKHT, name:"北京航空航天",src:"https://www.buaa.edu.cn/"},
{image_url:ISCAS, name:"ISCAS",src:"http://www.iscas.ac.cn/"},
{image_url:NJDX, name:"南京大学",src:"https://www.nju.edu.cn/"},
{image_url:DD, name:"滴滴",src:"https://www.didiglobal.com/"},
{image_url:CEC, name:"CEC",src:"https://www.cec.com.cn/"},
{image_url:HW, name:"华为",src:"https://www.huawei.com/"},
{image_url:ML, name:"木兰开源社区",src:"https://www.mulanos.cn/"},
{image_url:TX, name:"腾讯",src:"https://www.tencent.com/zh-cn"},
{image_url:KYRJLM, name:"中国开源软件推进联盟",src:"http://www.copu.org.cn/"},
{image_url:WXYJY, name:"无锡大数据研究院",src:""},
{image_url:QZ, name:"openi启智",src:"https://www.openi.org.cn/"},
{image_url:HSKY, name:"红山开源",src:"https://osredm.com/"},
{image_url:LSLM, name:"绿色产业联盟",src:"https://www.opengcc.org/"},
{image_url:ZC, name:"中创软件",src:"http://www.cvicse.com/"},
{image_url:LC, name:"浪潮",src:"https://cloud.inspur.com/"},
{image_url:YKD, name:"ucloud",src:"https://www.ucloud.cn/"}
]
// const settings = {
// dots: false,
// infinite: true,
// slidesToShow: 6,
// slidesToScroll: 1,
// autoplay: true,
// speed: 2000,
// autoplaySpeed: 2000,
// cssEase: "linear",
// rows:2,
// arrows:false
// };
function FifthEdition() {
useEffect(()=>{
@ -54,26 +95,43 @@ function FifthEdition() {
return(
<div id={"scrollBox1"}>
<ul className="fifthList" id="box1">
{
list && list.map((i,k)=>{
return(
<li><Link to={i.src}><img src={i.image_url} alt={i.name}/></Link></li>
)
})
}
</ul>
{list.length > 10 &&
<ul className="fifthList" id="box2">
{
list && list.map((i,k)=>{
return(
<li><Link to={i.src}><img src={i.image_url} alt={i.name}/></Link></li>
)
})
}
<div style={{width:340*list.length+"px"}}>
<ul className="fifthList" id="box1" style={{width:(340*list.length)/2+"px"}}>
{
list && list.map((i,k)=>{
return(
<li><Link to={i.src}><img src={i.image_url} alt={i.name}/></Link></li>
)
})
}
</ul>
}
{list.length > 10 &&
<ul className="fifthList" id="box2" style={{width:(340*list.length)/2+"px"}}>
{
list && list.map((i,k)=>{
return(
<li><Link to={i.src}><img src={i.image_url} alt={i.name}/></Link></li>
)
})
}
</ul>
}
</div>
{/* <Slider {...settings} className="footSlider">
{
list && list.map((i,k)=>{
return(
<li><Link to={i.src}><img src={i.image_url} alt={i.name}/></Link></li>
)
})
}
{list.length > 10 && list && list.map((i,k)=>{
return(
<li><Link to={i.src}><img src={i.image_url} alt={i.name}/></Link></li>
)
})
}
</Slider> */}
</div>
)
}

View File

@ -1,9 +1,9 @@
import React from 'react';
import Img from './Img/gitlink.png'
import Img from './Img/gitlink.png';
import qqImg from './Img/qq.png';
function Footnav() {
return(
<div className="footEdition">
<div className="footEdition">
<div className="footContent">
<ul className="center">
<img src={Img} alt="Gitlink确实开源" height="29px"/>
@ -11,28 +11,28 @@ function Footnav() {
</ul>
<ul>
<li className="thehead">社区</li>
<li><a>网站首页</a></li>
<li><a>帮助中心</a></li>
<li><a>论坛交流</a></li>
<li><a>合作伙伴</a></li>
<li><a href="/">网站首页</a></li>
<li><a href="https://forum.trustie.net/forums/1168/detail">帮助中心</a></li>
<li><a href="https://forum.trustie.net/">论坛交流</a></li>
<li><a href="https://www.trustie.net/cooperation">合作伙伴</a></li>
</ul>
<ul>
<li className="thehead">支持与服务</li>
<li><a>API文档</a></li>
<li><a>Git常用命令</a></li>
<li><a>DevOps使用文档</a></li>
<li><a>服务协议</a></li>
<li><a href="https://forgeplus.trustie.net/docs/api">API文档</a></li>
<li><a href="https://git-scm.com">Git常用命令</a></li>
<li><a href="https://forum.trustie.net/forums/3080/detail">DevOps使用文档</a></li>
<li><a href='https://www.trustie.net/agreement'>服务协议</a></li>
</ul>
<ul>
<li className="thehead">加入我们</li>
<li className="theline">
<div className="mr50">
{/* <div className="mr50">
<li>公众号</li>
<img src={Img} alt="公众号"/>
</div>
<img src={qqImg} alt="公众号"/>
</div> */}
<div>
<li>qq群</li>
<img src={Img} alt="qq群"/>
<img src={qqImg} alt="qq群"/>
</div>
</li>
</ul>

View File

@ -1,22 +1,27 @@
import React from 'react';
import './Index.scss';
import gitlink from './Img/gitlink.png';
import { Link } from 'react-router-dom';
function HeadNav() {
function HeadNav({showLoginDialog,mygetHelmetapi}) {
const register = mygetHelmetapi && mygetHelmetapi.common && mygetHelmetapi.common.register;
const navbar = mygetHelmetapi && mygetHelmetapi.navbar;
return(
<div className="headNav">
<div className="headNavDiv">
<ul className="headlist">
<li><img src={gitlink} alt="gitlink" height="37px" style={{marginRight:"15px"}}/></li>
<li><Link to={`/explore`}>协同开发</Link></li>
<li><a href="https://forum.trustie.net/forums/4701/detail">教学实践</a></li>
<li><a href="https://forum.trustie.net/forums">论坛交流</a></li>
<li><a href="https://forgeplus.trustie.net/Gitlink/forgeplus/about">关于我们</a></li>
{
navbar && navbar.length>0&&
navbar.map((i,k)=>{
return(
<li style={{display:i.hidden?"none":"block"}}><a href={i.link}>{i.name}</a></li>
)
})
}
</ul>
<div>
<a className="color-white">登录</a>
<a className="regBtn">注册</a>
<a className="color-white" onClick={showLoginDialog}>登录</a>
<a className="regBtn" href={register}>注册</a>
</div>
</div>
</div>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 142 KiB

After

Width:  |  Height:  |  Size: 26 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 232 KiB

After

Width:  |  Height:  |  Size: 48 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 204 KiB

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 100 KiB

After

Width:  |  Height:  |  Size: 88 KiB

BIN
src/home/Img/2-3-1big.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 88 KiB

BIN
src/home/Img/2-3-2.png Normal file → Executable file

Binary file not shown.

Before

Width:  |  Height:  |  Size: 53 KiB

After

Width:  |  Height:  |  Size: 37 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 29 KiB

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 83 KiB

After

Width:  |  Height:  |  Size: 67 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 250 KiB

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.3 KiB

After

Width:  |  Height:  |  Size: 4.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.1 KiB

After

Width:  |  Height:  |  Size: 3.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 397 KiB

After

Width:  |  Height:  |  Size: 53 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 334 KiB

After

Width:  |  Height:  |  Size: 45 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 277 KiB

After

Width:  |  Height:  |  Size: 42 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.2 MiB

After

Width:  |  Height:  |  Size: 2.0 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.6 MiB

After

Width:  |  Height:  |  Size: 769 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.8 MiB

After

Width:  |  Height:  |  Size: 428 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 882 KiB

After

Width:  |  Height:  |  Size: 458 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.8 MiB

After

Width:  |  Height:  |  Size: 914 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 77 KiB

After

Width:  |  Height:  |  Size: 75 KiB

BIN
src/home/Img/qq.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 30 KiB

After

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 31 KiB

After

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 36 KiB

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 26 KiB

BIN
src/home/Img/unit/CEC.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

BIN
src/home/Img/unit/DD.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.6 KiB

BIN
src/home/Img/unit/GFKJ.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 29 KiB

BIN
src/home/Img/unit/HSKY.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.9 KiB

BIN
src/home/Img/unit/HW.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.9 KiB

BIN
src/home/Img/unit/ISCAS.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

BIN
src/home/Img/unit/LC.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

BIN
src/home/Img/unit/LSLM.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

BIN
src/home/Img/unit/ML.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

BIN
src/home/Img/unit/NJDX.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

BIN
src/home/Img/unit/QH.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

BIN
src/home/Img/unit/QZ.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.4 KiB

BIN
src/home/Img/unit/SHJT.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

BIN
src/home/Img/unit/TG.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.5 KiB

BIN
src/home/Img/unit/TX.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.8 KiB

BIN
src/home/Img/unit/WXYJY.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

BIN
src/home/Img/unit/XH.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

BIN
src/home/Img/unit/XJY.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

BIN
src/home/Img/unit/YKD.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

BIN
src/home/Img/unit/ZC.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.5 KiB

After

Width:  |  Height:  |  Size: 43 KiB

View File

@ -11,10 +11,29 @@ import F44 from './Img/4-4.png';
import SecondEdition from './SecondEdition';
import FifthEdition from './FifthEdition';
import Footnav from './Footnav';
import { TPMIndexHOC } from '../modules/tpm/TPMIndexHOC';
function Index(props) {
const [ value , setValue ] = useState("");
const [ flag , setFlag ] = useState(true);
const [ isRender , setIsRender ] = useState(false);
const [ isloginCancel , setIsloginCancel ] = useState(false);
const register = props && props.mygetHelmetapi && props.mygetHelmetapi.common && props.mygetHelmetapi.common.register;
useEffect(()=>{
window.addEventListener("scroll",scrollListener);
},[])
function scrollListener(event) {
let third = document.getElementById("thirdContent").offsetTop;
let top = document.documentElement.scrollTop + 60;
if(top>= third)
{
setFlag(false)
}else{
setFlag(true)
}
}
function changeActive(params) {
if(params){
@ -27,44 +46,52 @@ function Index(props) {
}
}
return(
<div className="homePage">
<div className="topEdition">
<HeadNav />
<TopEdition />
<HeadNav {...props}/>
<TopEdition register={register}/>
<ul className="topEditionUl">
<li>
<p className="task-hide font-18">CCF开源发展成立大会即将召开</p>
<p>此处为活动详情内容</p>
</li>
<li>
<p className="task-hide font-18">CCF开源发展成立大会即将召开</p>
<p>此处为活动详情内容</p>
</li>
<li>
<p className="task-hide font-18">CCF开源发展成立大会即将召开</p>
<p>此处为活动详情内容此处为活动详情内容此处为活动详情内容此处为活动详情内容</p>
</li>
<a href="https://forum.trustie.net/forums/4666/detail" target="_blank" className="font-18">
<li>
CCF开源发展委员会首批执行委员名单发布
</li>
</a>
<a href="https://forgeplus.trustie.net/Gitlink/forgeplus" target="_blank" className="font-18">
<li>
平台精选仓库Gitlink/Gitlink
</li>
</a>
<a href="https://forum.trustie.net/forums/4663/detail" target="_blank" className="font-18">
<li>
OpenHarmony系统介绍及赛题说明
</li>
</a>
</ul>
</div>
<div className="secondEdition">
<p className="theTitle">Gitlink新一代开源创新服务平台</p>
<Anchor>
<li onClick={()=>changeActive("#hadoop")} className={value === "#hadoop"?"active":""}><a>分布式协作开发</a></li>
<li onClick={()=>changeActive("#oneStop")} className={value === "#oneStop"?"active":""}><a>一站式过程管理</a></li>
<li onClick={()=>changeActive("#highDevops")} className={value === "#highDevops"?"active":""}><a>高效流水线运维</a></li>
<li onClick={()=>changeActive("#multipleAnalyse")} className={value === "#multipleAnalyse"?"active":""}><a>多层次代码分析</a></li>
<li onClick={()=>changeActive("#multidimensional")} className={value === "#multidimensional"?"active":""}><a>多维度用户画像</a></li>
</Anchor>
{
flag &&
<Anchor>
<li onClick={()=>changeActive("#hadoop")} className={value === "#hadoop"?"active":""}><a>分布式协作开发</a></li>
<li onClick={()=>changeActive("#oneStop")} className={value === "#oneStop"?"active":""}><a>一站式过程管理</a></li>
<li onClick={()=>changeActive("#highDevops")} className={value === "#highDevops"?"active":""}><a>高效流水线运维</a></li>
<li onClick={()=>changeActive("#multipleAnalyse")} className={value === "#multipleAnalyse"?"active":""}><a>多层次代码分析</a></li>
<li onClick={()=>changeActive("#multidimensional")} className={value === "#multidimensional"?"active":""}><a>多维度用户画像</a></li>
</Anchor>
}
<SecondEdition {...props} setValue={setValue}/>
</div>
<ThirdEdition />
<div id="thirdContent">
<ThirdEdition />
</div>
<div className="forthEdition">
<p className="theTitle">加入Gitlink和社区伙伴们一起踏上开源创新的辉煌旅程</p>
<a className="qulikyreg">快速注册</a>
<a className="qulikyreg" href={register}>快速注册</a>
<ul className="forthUl">
<li>
<img src={F41} alt="" width={"100px"}/>
@ -98,4 +125,4 @@ function Index(props) {
</div>
)
}
export default Index;
export default TPMIndexHOC(Index);

View File

@ -55,76 +55,132 @@ body{
}
.slick-track{
height: 679px;
display: flex;
.slick-slide{
position: relative;
height:100%;
div{
height: 100%;
.regform1{
background:url('./Img/banner1.png') no-repeat center center;
background:url('./Img/banner1.png') no-repeat center top;
background-size:cover;
}
.regform2{
background:url('./Img/banner2.png') no-repeat center center;
background:url('./Img/banner2.png') no-repeat center top;
background-size:cover;
}
.regform3{
background:url('./Img/banner3.png') no-repeat center center;
background:url('./Img/banner3.png') no-repeat center top;
background-size:cover;
}
.regform4{
background:url('./Img/banner4.png') no-repeat center center;
background-size:cover;
}
}
.regPrg{
position: absolute;
z-index: 2;
width: 1200px;
left: 50%;
margin-left: -600px;
top:50%;
margin-top: -23px;
a{
color: #fff!important;
display: inline-block;
background-color: #466AFF;
border-radius: 5px;
height: 46px;
line-height: 46px;
width: 98px;
text-align: center;
font-size: 18px;
letter-spacing: 2px;
.regPrg{
position: absolute;
z-index: 2;
width: 1200px;
left: 50%;
margin-left: -600px;
top:50%;
margin-top: -23px;
a{
color: #fff!important;
display: inline-block;
background-color: #466AFF;
border-radius: 5px;
height: 46px;
line-height: 46px;
width: 98px;
text-align: center;
font-size: 18px;
letter-spacing: 2px;
}
}
}
img{
position: absolute;
width: 100%;
height: 100%;
top:0px;
left: 0px;
z-index: 1;
}
// img{
// position: absolute;
// width: 100%;
// height: 100%;
// top:0px;
// left: 0px;
// z-index: 1;
// }
}
}
.ant-carousel{
.slick-slider{
min-width: 1200px;
}
.ant-carousel .slick-dots{
width: 1200px;
text-align: left;
left: 50%;
margin-left: -600px;
bottom: 25%;
li{
margin:0px;
margin-right: 15px;
margin-left: 5px;
button{
background-color: rgba(225,225,225,0.45);
position: relative;
&:hover{
.slick-arrow{
display: block!important;
}
button,&.slick-active button{
}
.slick-arrow{
position: absolute;
top:50%;
z-index: 1000;
background: transparent;
border: none;
margin-top:-50px;
display: none!important;
&:hover{
i{
color: rgba(225,225,225,0.8);
}
}
i{
font-size: 50px!important;
color: rgba(225,225,225,0.3);
transition: 0.3s;
}
&.slick-prev{
left: 50px;
}
&.slick-next{
right: 50px;
}
}
.slick-dots{
width: 1200px;
text-align: left;
left: 50%;
margin-left: -600px;
bottom: 25%;
position: absolute;
display: flex!important;
li{
background-color: rgba(225,225,225,0.5);
position: relative;
height: 3px;
width: 46px;
margin-right: 15px;
&::after{
position: absolute;
left: 0px;
width: 0px;
top:0px;
height: 100%;
content: "";
transition: 1s;
transition-property: width;
}
&.slick-active::after{
background-color: #fff;
width: 100%;
}
button{
position: absolute;
width: 100%;
height: 10px;
left:0px;
background-color: transparent!important;
border:none;
cursor: pointer;
color: transparent;
}
}
}
}
@ -139,18 +195,18 @@ body{
display: flex;
align-items: center;
justify-content: center;
li{
a{
background-image: url('./Img/top-2.png');
height: 163px;
width: 377px;
padding:36px 35px;
height: 139px;
width: 353px;
padding:30px 24px;
color: #fff;
margin:0px 5px;
p{
line-height: 25px;
&:first-child{
margin-bottom: 12px!important;
}
margin:0px 17px;
border-radius: 11px;
background-size: 100% 100%;
color: #fff!important;
&:hover{
box-shadow: 0px 2px 7px rgba(225,225,225,0.85);
}
&:first-child{
background-image: url('./Img/top-1.png');
@ -173,6 +229,7 @@ body{
}
.ant-affix{
background-color: #fff;
box-shadow: 0px 2px 7px 0px rgba(0,0 ,0 ,0.09);
}
.ant-anchor-wrapper{
width: 1200px;
@ -185,8 +242,7 @@ body{
.ant-anchor-ink{
width: 100%;
height: 1px;
background: #D8D8D8;
border: 1px solid rgba(153, 153, 153, 0.5);
border-bottom: 1px solid rgba(153, 153, 153, 0.5);
bottom: 0px;
top:initial;
}
@ -201,7 +257,7 @@ body{
&.active::after{
position: absolute;
left: 0px;
bottom: 2px;
bottom: 0px;
height:2px;
background-color: #466AFF;
content: "";
@ -346,10 +402,10 @@ body{
.highDoContent img{
opacity: 1;
&.highImg1{
left:10px;
bottom:62px;
}
&.highImg2{
right:10px;
bottom:215px;
}
}
}
@ -430,17 +486,19 @@ body{
opacity: 0;
transition: 2.4s;
}
.highImg1,.highImg2{
position: absolute;
transition: 3s;
}
.highImg1{
top:126px;
left:-100px;
position: absolute;
bottom:0px;
transition: 1s;
transition-delay: 1s;
left:10px;
}
.highImg2{
top:63px;
right:-100px;
position: absolute;
bottom:0px;
right:10px;
transition: 2s;
transition-delay: 1s;
}
.highDoBottondesc{
font-size: 18px;
@ -499,7 +557,7 @@ body{
background:url('./Img/2-5bg.png') no-repeat center center;
background-size:cover;
height: 1139px;
padding:268px 0px 0px;
padding:100px 0px 0px;
display: flex;
flex-direction: column;
opacity: 0.3;
@ -537,7 +595,7 @@ body{
}
}
}
&.activeCode{
.activeCode{
opacity: 1;
.multidimensinalPart{
img{
@ -612,13 +670,48 @@ body{
.thirdUl{
display: flex;
align-items: center;
margin-top: 50px;
margin-bottom: 25px!important;
padding-top: 50px;
padding-bottom: 25px;
margin-bottom: 0px;
li{
margin:0px 67px;
padding:0px 67px;
color: #fff;
position: relative;
cursor: pointer;
&:hover{
.hoverli1 img{
&:first-child{
transform: translate(5px,7px);
}
&:last-child{
transform: translate(-2px,0px);
}
}
.hoverli2 img{
&:first-child{
transform: translate(6px,-7px);
}
&:last-child{
transform: translate(-2px,0px);
}
}
.hoverli3 img{
&:first-child{
right: -3px!important;
}
&:last-child{
left: -3px;
}
}
.hoverli4 img{
&:first-child{
top: -5px;
}
&:last-child{
top:13px!important;
}
}
}
&.active::after{
position: absolute;
content: "";
@ -645,6 +738,7 @@ body{
margin:0px 20px;
img{
position: absolute;
transition: .1s;
&:first-child{
z-index: 2;
}
@ -690,6 +784,9 @@ body{
a{
flex:1;
color: #fff!important;
&:hover{
text-decoration: underline;
}
}
span{
margin-left: 40px;
@ -729,7 +826,7 @@ body{
}
.forthUl{
display: flex;
align-items: center;
align-items: flex-end;
li{
margin:0px 40px;
display: flex;
@ -762,6 +859,37 @@ body{
align-items: center;
padding:68px 0px;
min-width: 1200px;
.footSlider{
width: 100%;
.slick-track{
display: flex;
.slick-slide{
margin:0px 20px;
& > div{
width: 300px;
height: 120px;
padding:15px;
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(180deg, #F1F7FF 0%, #F7FAFF 53%, #FFFFFF 100%);
box-shadow: 0px 1px 10px 3px rgba(0, 0, 0, 0.06);
border-radius: 4px;
margin:30px 0px;
a{
display: block;
height: 100%;
width: 100%;
text-align: center;
img{
max-width: 100%;
max-height: 100%;
}
}
}
}
}
}
.title{
height: 53px;
font-size: 38px;
@ -782,7 +910,6 @@ body{
max-height: 300px;
overflow: hidden;
margin: 35px 0px 0px;
display: flex;
width: 100%;
}
ul.fifthList{
@ -790,15 +917,23 @@ body{
flex-wrap: wrap;
flex-direction: column;
height: 300px;
width: 100%;
float: left;
li{
border-bottom: none;
width: 300px;
height: 120px;
margin:15px 20px!important;
background: linear-gradient(180deg, #F1F7FF 0%, #F7FAFF 53%, #FFFFFF 100%);
background: #fff;
box-shadow: 0px 1px 10px 3px rgba(0, 0, 0, 0.06);
border-radius: 4px;
border: 2px solid #FFFFFF;
&:nth-child(2n){
margin:15px 0px 15px 40px!important;
}
&:nth-child(2n+1){
margin:15px 40px 15px 0px!important;
}
a{
display: flex;
align-items: center;
@ -870,7 +1005,7 @@ body{
img{
width: 80px;
height: 80px;
border-radius: 10px;
border-radius: 3px;
}
}
}

View File

@ -1,4 +1,4 @@
import React from 'react';
import React , { useEffect , useState } from 'react';
import Img1 from './Img/2-2-1.png';
import ImgHead from './Img/2-2-head.png';
import Img2 from './Img/2-2-2.png';
@ -9,13 +9,9 @@ import ImgS2 from './Img/2-3-2.png';
import ImgS3 from './Img/2-3-3.png';
import ImgS4 from './Img/2-3-4.png';
import ImgM2 from './Img/2-6-2.png';
import ImgM1 from './Img/2-5-1.png';
import ImgM3 from './Img/2-5-2.png';
import ImgM4 from './Img/2-6-1.png';
import Codeafter from './Img/codeafter.png';
import './code.scss';
import { useEffect } from 'react';
import { useState } from 'react';
const code=[
{str:<span><span className='code-green'>git remote</span> add origin https://git.trustie.net/Gitlink/Gitlink.git</span>},
@ -30,6 +26,21 @@ const code=[
{str:<span><span className='code-green'>git merge</span> dev</span>},
{str:<span><span className='code-red'>git push</span> origin master</span>}
]
const codes=[
{str:<span><span className='code-blue'>latest:</span> Pulling from appleboy/drone-ssh</span>},
{str:<span><span className='code-red'>Digest:</span>sha256:095ca4ceafcb751f1f22fe416057d3e2a6302f7b1f7011b17010973cb6bbdd9f</span>},
{str:<span>Status:Image is up to date for appleboy/drone-ssh:latest</span>},
{str:<span><span className='code-green'>======CMD======</span></span>},
{str:<span><span className='code-green'>echo ====暂停容器开始======= </span></span>},
{str:<span><span className='code-red'>docker</span> rm -f mo-test</span>},
{str:<span><span className='code-red'>docker</span> rmi mo-test:1.0</span>},
{str:<span><span className='code-blue'>cd</span> /opt/demo</span>},
{str:<span><span className='code-green'>echo ====开始部署=======</span></span>},
{str:<span><span className='code-red'>docker </span>build -t mo-test:1.0 .</span>},
{str:<span><span className='code-red'>docker </span>run -d -p 8080:8080 --name mo-test mo-test:1.0</span>},
{str:<span><span className='code-green'>echo ====部署成功======</span></span>},
{str:<span><span className='code-green'>======END======</span></span>},
]
function SecondEdition({setValue}) {
useEffect(()=>{
@ -37,7 +48,6 @@ function SecondEdition({setValue}) {
},[])
const [ hadoop , setHadoop ] = useState(false);
const [ hadoopImg , setHadoopImg ] = useState(false);
const [ highDevops , setHighDevops ] = useState(false);
const [ multipleAnalyse , setMultipleAnalyse ] = useState(false);
const [ multidimensional , setMultidimensional ] = useState(false);
@ -51,12 +61,8 @@ function SecondEdition({setValue}) {
if(f){
setValue("#hadoop");
setHadoop(true);
setTimeout(function() {
setHadoopImg(true);
},2300)
}else{
setHadoop(false);
setHadoopImg(false);
}
let f1 = checkPosi("oneStop",clientHeight,scrollTop);
if(f1){
@ -94,7 +100,7 @@ function SecondEdition({setValue}) {
function checkPosi(ele,clientHeight,scrollTop) {
var a = document.getElementById(ele).offsetTop - scrollTop -(clientHeight/3);
var b = document.getElementById(ele).clientHeight + (clientHeight/3);
var b = document.getElementById(ele).clientHeight + (clientHeight/4);
if(a>0 || a<-b){
return false;
}else{
@ -114,11 +120,11 @@ function SecondEdition({setValue}) {
{
code.map((i,k)=>{
return(
<li><pre className="word-item" style={{animationDelay: `${k * 0.1 + .4}s`}}><span className="codenum">{k+1}</span>{i.str}</pre></li>
<li><pre className="word-item" style={{animationDelay: `${k * 0.2 + .2}s`}}><span className="codenum">{k+1}</span>{i.str}</pre></li>
)
})
}
<img src={Codeafter} alt="运行结果" className={hadoopImg?"activeImg":""}/>
<img src={Codeafter} alt="运行结果" className={"activeImg"}/>
</div>
</div>
<p className="hadoopdesc">让您的项目在这里健康快速的成长</p>
@ -126,10 +132,10 @@ function SecondEdition({setValue}) {
<div className={oneStop ? "oneStop activeCode" :"oneStop"} id="oneStop">
<div className={"oneStopContent"}>
<div className={"osLeftMain"}>
<img src={Img1} alt="" width="494px" className="osleftPosi"/>
<img src={Img1} alt="" width="520px" className="osleftPosi"/>
<img src={ImgHead} alt="" width="213px" style={{marginLeft:"-12px"}}/>
<img src={Img2} alt="" width="627px" className="osleftPosi1"/>
<img src={Img3} alt="" width="412px" className="osleftPosi2"/>
<img src={Img2} alt="" width="653px" className="osleftPosi1"/>
<img src={Img3} alt="" width="367px" className="osleftPosi2"/>
</div>
<div className="osRightMain">
<p className="osRightTitle">一站式过程管理</p>
@ -152,7 +158,18 @@ function SecondEdition({setValue}) {
<div className="highDoContent">
<div>
<img src={ImgS1} alt="" width="794px"/>
<img src={ImgS2} alt="" width="520px" style={{marginBottom:'74px',marginTop:"25px"}}/>
<div style={{marginBottom:'74px',marginTop:"25px",position:"relative"}}>
<img src={ImgS2} alt="" width="520px"/>
{/* <div className="highCodes">
{
codes.map((i,k)=>{
return(
<li><pre className="word-item" style={{animationDelay: `${k * 0.2 + .2}s`}}><span className="codenum">{k+1}</span>{i.str}</pre></li>
)
})
}
</div> */}
</div>
<img src={ImgS3} alt="" width="427px" className="highImg2"/>
<img src={ImgS4} alt="" width="413px" className="highImg1"/>
</div>
@ -164,23 +181,26 @@ function SecondEdition({setValue}) {
<div className="maContent"></div>
<p className="desc">提供软件软代码和芯片RTL代码的溯源分析文件级和组件级许可证识别及风险分析输入性开源漏洞检测和加固建议支持分析结果的多层次可视化展示</p>
</div>
<div className={multidimensional ? "multidimensional activeCode":"multidimensional"} id="multidimensional">
<div className="multidimensinalhalf">
<div>
<p className="halfTitle">多维度用户画像</p>
<p className="halfsubTitle"><span>实时采集和分析平台中的各类开源资源数<br/></span>搭建多维度用户画像评估系统</p>
<div className={"multidimensional"} style={{opacity:multidimensional?"1":"0.3"}}>
<div style={{height:"168px"}}></div>
<div className={multidimensional ? "activeCode":""} id="multidimensional">
<div className={"multidimensinalhalf"}>
<div>
<p className="halfTitle">多维度用户画像</p>
<p className="halfsubTitle"><span>实时采集和分析平台中的各类开源资源数<br/></span>搭建多维度用户画像评估系统</p>
</div>
<div style={{width:"820px",marginLeft:"40px"}}>
<img src={ImgM4} alt="" width="820px" />
</div>
</div>
<div style={{width:"820px",marginLeft:"40px"}}>
<img src={ImgM4} alt="" width="820px" />
</div>
</div>
<div className="multidimensinalPart">
<div style={{width:"614px",marginRight:"40px"}}>
<img src={ImgM2} alt="" width="614px" />
</div>
<div>
<p><span>提供</span>开发活动统计贡献度日历用户能力建模角色与专业定位分析<span>等功能</span></p>
<p>让您在个人主页展示开发动态与创新能力</p>
<div className="multidimensinalPart">
<div style={{width:"614px",marginRight:"40px"}}>
<img src={ImgM2} alt="" width="614px" />
</div>
<div>
<p><span>提供</span>开发活动统计贡献度日历用户能力建模角色与专业定位分析<span>等功能</span></p>
<p>让您在个人主页展示开发动态与创新能力</p>
</div>
</div>
</div>
</div>

View File

@ -1,4 +1,4 @@
import React,{ useState , useEffect } from 'react';
import React,{ useState , useEffect , useMemo } from 'react';
import T311 from './Img/3-1-1.png';
import T312 from './Img/3-1-2.png';
import T321 from './Img/3-2-1.png';
@ -14,74 +14,162 @@ import bg34 from './Img/3-4.png';
import './Index.scss';
function ThirdEdition(params) {
const list1 = [
{name:"CCF开源发展委员会首批执行委员名单发布",src:"https://forum.trustie.net/forums/4666/detail",count:32,time:"2021-09-22"},
{name:"Gitlink项目协同开发模块使用说明及问题反馈",src:"https://forum.trustie.net/forums/4665/detail",count:4,time:"2021-09-22"},
{name:"MindSpore框架介绍及赛题说明",src:"https://forum.trustie.net/forums/4664/detail",count:3,time:"2021-09-22"},
{name:"OpenHarmony系统介绍及赛题说明",src:"https://forum.trustie.net/forums/4663/detail",count:4,time:"2021-09-22"},
{name:"openGauss系统介绍及赛题说明",src:"https://forum.trustie.net/forums/4662/detail",count:5,time:"2021-09-22"},
]
const list2 = [
{name:"Gitlink/Gitlink",src:"https://forgeplus.trustie.net/Gitlink/forgeplus",count:304},
{name:"泛在操作系统实验室/矽璓工业物联操作系统XiUOS",src:"https://forgeplus.trustie.net/xuos/xiuos",count:50},
{name:"华为技术有限公司/openGauss-operator",src:"https://forgeplus.trustie.net/Huawei_Technology/openGauss-operator",count:100},
{name:"开放原子开源基金会/BitXHub",src:"https://forgeplus.trustie.net/openatom_foundation/bitxhub",count:40},
{name:"华为技术有限公司/openEuler-datenlord",src:"https://forgeplus.trustie.net/Huawei_Technology/openEuler-datenlord",count:98},
]
const list3 = [
{name:"Gitlink平台DevOps模块使用说明",src:"https://forum.trustie.net/forums/4682/detail",count:10,time:"2021-09-23"},
{name:"Gitlink如何将临时分支push到远端对应的新分支",src:"https://forum.trustie.net/forums/4705/detail",count:8,time:"2021-09-23"},
{name:"了解什么是 DevOps",src:"https://forum.trustie.net/forums/4704/detail",count:4,time:"2021-09-23"},
{name:"EduCoder平台简介",src:"https://forum.trustie.net/forums/4701/detail",count:26,time:"2021-09-23"},
{name:"Webhooks指南",src:"https://forum.trustie.net/forums/4683/detail",count:3,time:"2021-09-23"},
]
const list4 = [
{name:"小学生都能读懂的网络协议之:WebSocket",src:"https://forum.trustie.net/forums/4708/detail",count:4,time:"2021-09-23"},
{name:"容器神话 Docker 是如何一分为二的",src:"https://forum.trustie.net/forums/4707/detail",count:5,time:"2021-09-23"},
{name:"一文揭示DevOps与企业数字化究竟有何联系",src:"https://forum.trustie.net/forums/4706/detail",count:3,time:"2021-09-23"},
{name:"GitHub上最流行的10000个Java都使用了哪些库",src:"https://forum.trustie.net/forums/4703/detail",count:8,time:"2021-09-23"},
{name:"如何正确下载CentOS各个版本镜像",src:"https://forum.trustie.net/forums/4684/detail",count:2,time:"2021-09-23"},
]
function ThirdEdition() {
const [ active , setActive ] = useState(1);
const [ flag , setFlag ] = useState(true);
const doubleFlag = useMemo(()=>{
return flag;
},[flag])
useEffect(()=>{
let box = document.getElementById('thirdUl');
var myTimer = setTimeout(intervalActive, 2500);
box.onmouseover = () => {
clearTimeout(myTimer);
setFlag(false);
}
box.onmouseleave = () => {
myTimer = setTimeout(intervalActive, 2500);
setFlag(true);
}
},[active,flag])
function intervalActive() {
if(doubleFlag){
if(active < 4){
let i = active + 1;
setActive(i);
}else{
setActive(1);
}
}
}
return(
<div className="thirdEdition">
<p className="title">开发者的家园</p>
<p className="subtitle">一个实现100%开源产学研联合面向软件创新的开源社区</p>
<ul className="thirdUl">
<li className={active===1?"active":""}onClick={()=>setActive(1)}>
<div style={{marginTop:"-10px"}}>
<img src={T311} alt="" height="41px" style={{top:"8px",left:"10px"}}/>
<img src={T312} alt="" width="36px"/>
</div>
<span style={{marginTop:"20px"}}>平台动态</span>
</li>
<li className={active===2?"active":""}onClick={()=>setActive(2)}>
<div>
<img src={T321} alt="" width="32px" style={{left:"8px"}}/>
<img src={T322} alt="" width="26px" style={{top:"8px"}}/>
</div>
<span>优秀仓库</span>
</li>
<li className={active===3?"active":""}onClick={()=>setActive(3)}>
<div>
<img src={T331} alt="" width="33px" style={{right:"3px"}}/>
<img src={T332} alt="" width="29px"/>
</div>
<span>精选文章</span>
</li>
<li className={active===4?"active":""}onClick={()=>setActive(4)}>
<div>
<img src={T341} alt="" width="42px"/>
<img src={T342} alt="" width="26px" style={{top:"13px",left:"7px"}}/>
</div>
<span>经验分享</span>
</li>
</ul>
<div className="thirdLists">
<div id="thirdUl">
<ul className="thirdUl">
<li className={active===1?"active":""}onClick={()=>{setFlag(false);setActive(1)}}>
<div className="hoverli1">
<img src={T311} alt="" width="38px" style={{top:"8px",left:"10px"}}/>
<img src={T312} alt="" width="34px"/>
</div>
<span>平台动态</span>
</li>
<li className={active===2?"active":""}onClick={()=>{setFlag(false);setActive(2)}}>
<div className="hoverli2">
<img src={T321} alt="" width="32px" style={{left:"8px"}}/>
<img src={T322} alt="" width="26px" style={{top:"8px"}}/>
</div>
<span>优秀仓库</span>
</li>
<li className={active===3?"active":""}onClick={()=>{setFlag(false);setActive(3)}}>
<div className="hoverli3">
<img src={T331} alt="" width="33px" style={{right:"3px",top:"8px"}}/>
<img src={T332} alt="" width="29px" style={{top:"8px"}}/>
</div>
<span>精选文章</span>
</li>
<li className={active===4?"active":""}onClick={()=>{setFlag(false);setActive(4)}}>
<div className="hoverli4">
<img src={T341} alt="" width="42px"/>
<img src={T342} alt="" width="26px" style={{top:"11px",left:"7px"}}/>
</div>
<span>经验分享</span>
</li>
</ul>
<div className="thirdLists">
<img src={active === 1 ? bg3 : active===2 ? bg32 :active===3 ? bg33 :bg34 } alt="" width="336px"/>
<div className="listbox">
<p className="listTitle">Gitlink分享最新平台资讯社区活动通知开源竞赛信息把握开源生态发展脉搏</p>
<li>
<a>第四届中国软件开源创新大赛Gitlink赛道</a>
<span><i className="iconfont "></i>4561</span>
<span>2021-08-26</span>
</li>
<li>
<a>第四届中国软件开源创新大赛Gitlink赛道</a>
<span><i className="iconfont "></i>4561</span>
<span>2021-08-26</span>
</li>
<li>
<a>第四届中国软件开源创新大赛Gitlink赛道</a>
<span><i className="iconfont "></i>4561</span>
<span>2021-08-26</span>
</li>
<li>
<a>第四届中国软件开源创新大赛Gitlink赛道</a>
<span><i className="iconfont "></i>4561</span>
<span>2021-08-26</span>
</li>
<li>
<a>第四届中国软件开源创新大赛Gitlink赛道</a>
<span><i className="iconfont "></i>4561</span>
<span>2021-08-26</span>
</li>
<p className="listTitle">
{active === 1 ? "Gitlink分享最新平台资讯、社区活动通知、开源竞赛信息把握开源生态发展脉搏"
: active===2 ? "Gitlink汇聚精英企业仓库、前沿技术仓库、人气热门仓库孵化优质开源创新成果"
:active===3 ? "Gitlink集萃社区精选项目介绍、平台使用技巧等优秀文章助力开源开放协同创新"
:"Gitlink甄选技术研究、心得体会、经验交流等高质量内容推动社区健康稳定发展"}
</p>
{
active === 1&&
list1.map((i,k)=>{
return(
<li>
<a href={i.src} target="_blank">{i.name}</a>
<span><i className="iconfont icon-a-liulanicon2x mr5"></i>{i.count}</span>
<span>{i.time}</span>
</li>
)
})
}
{
active === 2&&
list2.map((i,k)=>{
return(
<li>
<a href={i.src} target="_blank">{i.name}</a>
<span><i className="iconfont icon-a-liulanicon2x mr5"></i>{i.count}</span>
{/* {i.time} */}
</li>
)
})
}
{
active === 3&&
list3.map((i,k)=>{
return(
<li>
<a href={i.src} target="_blank">{i.name}</a>
<span><i className="iconfont icon-a-liulanicon2x mr5"></i>{i.count}</span>
<span>{i.time}</span>
</li>
)
})
}
{
active === 4&&
list4.map((i,k)=>{
return(
<li>
<a href={i.src} target="_blank">{i.name}</a>
<span><i className="iconfont icon-a-liulanicon2x mr5"></i>{i.count}</span>
<span>{i.time}</span>
</li>
)
})
}
</div>
</div>
</div>
</div>
)
}

View File

@ -1,17 +1,29 @@
import React from 'react';
import { Carousel } from 'antd';
function TopEdition() {
import Slider from 'react-slick';
let setting={
dots:true,
infinite: true,
speed: 1000,
slidesToShow: 1,
slidesToScroll: 1,
pauseOnDotsHover:true,
pauseOnFocus:true,
autoplay:true,
arrows:true,
prevArrow:<button type='button' class='slick-prev slick-arrow'><i className="iconfont icon-xiangzuojiantou"></i></button>,
nextArrow:<button type='button' class='slick-prev slick-arrow'><i className="iconfont icon-xiangyoujiantou"></i></button>
}
function TopEdition({register}) {
return(
<Carousel autoplay>
<Slider {...setting}>
<div className="regform1"></div>
<div className="regform2"></div>
<div className="regform3">
</div>
<div className="regform4">
<p className="regPrg"><a>注册</a></p>
<p className="regPrg"><a href={register}>注册</a></p>
</div>
</Carousel>
</Slider>
)
}
export default TopEdition;

View File

@ -6,22 +6,14 @@
flex: 1;
margin-top: 60px;
position: relative;
&.activeCode{
&>img.activeImg{
right: 0px;
bottom: -20px;
opacity: 1;
width: 705px;
}
}
&>img{
position: absolute;
right: -50px;
bottom: -50px;
transition: 1s;
width: 805px;
opacity: 0;
border-radius: 4px;
opacity: 0;
z-index: 1;
}
li{
display: flex;
@ -30,29 +22,52 @@
font-weight: 500;
line-height: 30px;
color: #E1E1E1;
pre {
font-family: ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace;
.codenum{
display: inline-block;
width: 15px;
text-align: left;
margin-right: 15px;
}
.code-green{
color: #00FA30;
}
.code-red{
color: #FF5058;
}
.code-blue{
color: #05CFC8;
}
}
}
}
.activeCode .word-item {
pre {
font-family: ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace;
word-break: break-all;
overflow: initial ;
.codenum{
display: inline-block;
width: 15px;
text-align: left;
margin-right: 15px;
}
.code-green{
color: #00FA30;
}
.code-red{
color: #FF5058;
}
.code-blue{
color: #05CFC8;
}
}
.highCodes{
position: absolute;
top:0px;
right:0px;
width: 50%;
height: 100%;
padding:40px 30px;
color: #E1E1E1;
}
.activeCode{
.word-item{
animation: show .2s 1 forwards;
}
&>img.activeImg{
right: 0px;
bottom: -20px;
opacity: 1;
width: 705px;
transition: 1s;
transition-delay: 3s;
}
}
.word-item {
opacity: 0;
animation: show .3s 1 forwards;
}
@keyframes show {
from {
@ -61,4 +76,4 @@
to {
opacity: 1;
}
}
}

View File

@ -157,5 +157,5 @@
}
.MuiModal-root-15 {
z-index: 1000 !important;
z-index: 10001 !important;
}

View File

@ -149,6 +149,11 @@ export function TPMIndexHOC(WrappedComponent) {
}
fetchUsers = () => {
if (this.props.match.path === "/") {
this.setState({
publicNav:false
})
}
let url = `/users/get_user_info.json`;
axios.get(url).then((response) => {
if (response && response.data) {
@ -157,9 +162,6 @@ export function TPMIndexHOC(WrappedComponent) {
tpmLoading: false,
completeProfile:response.data.profile_completed
})
if (this.props.match.path === "/" && response.data.login) {
this.props.history.push(`/${response.data.login}`);
}
if(response.data && response.data.login){
if(response.data.need_edit_info){
this.setState({
@ -216,7 +218,7 @@ export function TPMIndexHOC(WrappedComponent) {
render() {
let { isRender , current_user , giteaVisible , email , completeProfile , showCP } = this.state;
let { isRender , current_user , giteaVisible , email , completeProfile , showCP , publicNav } = this.state;
const common = {
showLoginDialog: this.showLoginDialog,
checkIfLogin: this.checkIfLogin,
@ -236,12 +238,12 @@ export function TPMIndexHOC(WrappedComponent) {
{...this.props}
{...this.state}
/> : ""}
<Header {...this.state} {...this.props} {...common}></Header>
{ publicNav && <Header {...this.state} {...this.props} {...common}></Header>}
<Spin spinning={this.state.globalLoading} delay={0} className="globalSpin"
size="large" tip={this._gLoadingTip || "加载中..."}
>
<div className="newContainer newContainers">
<div style={{height:"70px"}}></div>
{ publicNav && <div style={{height:"70px"}}></div> }
{
current_user &&
<WrappedComponent initCommonState={(user) => this.initCommonState(user)}
@ -250,7 +252,7 @@ export function TPMIndexHOC(WrappedComponent) {
}
</div>
</Spin>
<NewFooter {...this.state} {...this.props} />
{ publicNav && <NewFooter {...this.state} {...this.props} />}
</div>
);
}