morii
/
forgeplus-react
forked from Gitlink/forgeplus-react
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

项目首页 banner

This commit is contained in:
caishi 2021-10-26 09:40:35 +08:00
parent d37709b1a5
commit 3d3ef19d4a
12 changed files with 245 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
public/css/edu-purge.css
View File

@ -3971,9 +3971,12 @@ html>body #ajax-indicator {
display: block;
height: 100%;
width: 100%;
color: #333;
color: #fff;
font-size: 16px;
}
.head-right i{
color: #fff!important;
}
.head-nav ul#header-nav li a:hover,.head-nav ul#header-nav li.active a {
color: #5091FF;

2
src/forge/Component/HeadSearch.jsx
View File

@ -32,7 +32,7 @@ export default ({history}) => {
/>
</div>
:
<i className="iconfont icon-sousuo font-18 color-grey-6 ml30" onClick={() => {
<i className="iconfont icon-sousuo font-18 ml30" onClick={() => {
setOpenSearch(true)
}} />
}

8
src/forge/Head/Header.js
View File

@ -433,7 +433,7 @@ class NewHeader extends Component {
{
current_user && (current_user.main_site || current_user.login) && (settings && settings.add && settings.add.length>0)?
<Dropdown overlay={this.addMenu(settings && settings.add)} placement="bottomRight">
<i className="iconfont icon-tianjiafangda color-grey-6 ml30 mr15"></i>
<i className="iconfont icon-tianjiafangda ml30 mr15"></i>
</Dropdown>:""
}
@ -448,7 +448,7 @@ class NewHeader extends Component {
>
<Link to={"/settings/notice"} className="message-icon">
{current_user && <Badge count={current_user.message_unread_total}>
<i className="iconfont icon-xiaoxilingdang color-grey-6 ml15 mr15"></i>
<i className="iconfont icon-xiaoxilingdang ml15 mr15"></i>
</Badge>}
</Link>
</Popover>
@ -457,10 +457,10 @@ class NewHeader extends Component {
</div>
{!user || (user && !user.login) ?
<span className="font-15 ml30">
<a onClick={() => this.educoderlogin()} className="mr5 color-grey-6">登录</a>
<a onClick={() => this.educoderlogin()} className="mr5 color-white">登录</a>
{
settings && settings.common && settings.common.register &&
<span><em className="vertical-line"></em><a className="ml5 color-grey-6" href={`${settings.common.register}`} target="_blank">注册</a></span>
<span><em className="vertical-line"></em><a className="ml5 color-white" href={`${settings.common.register}`} target="_blank">注册</a></span>
}
</span>
:

BIN
src/forge/Main/img/index/banner.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 240 KiB

BIN
src/forge/Main/img/index/box.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 50 KiB

BIN
src/forge/Main/img/index/data.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 460 B

BIN
src/forge/Main/img/index/earth.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 463 B

BIN
src/forge/Main/img/index/eye.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 435 B

6
src/forge/Main/projecthome/Index.jsx
View File

@ -1,10 +1,12 @@
import React from 'react';
import './Index.scss';
import SubBanner from './SubBanner';
function Index(props) {
return(
<div>首页index</div>
<div>
<SubBanner />
</div>
)
}
export default Index;

152
src/forge/Main/projecthome/Index.scss
View File

@ -0,0 +1,152 @@
.banners{
background: url('../img/index/banner.png') no-repeat top;
min-height: 516px;
background-size: cover;
background-color: #0C2A5B;
.bannersCenter{
padding-top: 30px;
max-width: 1290px;
margin: 0px auto;
position: relative;
height: 516px;
}
.bTitle{
height: 30px;
line-height: 30px;
font-size: 30px;
font-weight: 500;
color: #FFFFFF;
margin-bottom: 20px!important;
text-align: center;
span{
background: linear-gradient(to right,#289AF6 0%, #9E84FF 40%, #FFB03B 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
}
.bSubTitle{
text-align: center;
height: 30px;
line-height: 30px;
font-size: 16px;
font-weight: 400;
color: #FFFFFF;
}
.bannerBox{
background: url('../img/index/box.png') no-repeat;
background-size: 100% 100%;
height: 240px;
width: 380px;
margin:0px auto;
padding:25px 30px 34px;
.bannersProject{
position: relative;
.slick-list{
width: 100%;
overflow: hidden;
}
.slick-track{
display: flex;
li{
padding:15px 20px;
.projectinfos{
display: flex;
align-items: center;
width: 100%;
margin-bottom: 13px;
img{
width: 32px;
height: 32px;
margin-right: 7px;
border-radius: 50%;
}
.name{
height: 28px;
line-height: 28px;
font-size: 20px;
font-weight: 500;
color: #25EBFF;
}
.company{
height: 20px;
line-height: 20px;
font-size: 14px;
font-weight: 400;
color: #FFFFFF;
}
}
.desc{
height: 40px;
font-size: 13px;
font-weight: 400;
color: #FFFFFF;
line-height: 20px;
text-align: center;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.infoData{
display: flex;
margin-top: 16px;
justify-content: space-around;
&>span{
display: flex;
align-items: center;
&>span{
color: #FFB729;
font-size: 15px;
font-weight: 400;
}
}
img{
width: 16px;
margin-right: 4px;
}
}
}
}
}
}
.airBubble{
&>div{
position: absolute;
border-radius: 50%;
background: linear-gradient(124deg, rgba(255, 255, 255, 0.1) 0%, rgba(5, 200, 220, 0.04) 50%, rgba(5, 200, 220, 0.03) 100%);
box-shadow: 0px 0px 7px 3px rgba(0, 154, 255, 0.19);
border: 1px solid rgba(0, 154, 255, 0.19);
font-size: 14px;
font-weight: 400;
line-height: 20px;
display: flex;
align-items: center;
word-break: break-all;
text-align: center;
padding:5px;
&.right{
right: 0px;
}
&.left{
left: 0px;
}
&:nth-child(1){
span{
color: #25EBFF;
}
width: 110px;
height: 110px;
bottom: 310px;
}
&:nth-child(2){
span{
color: #CD8AFF;
}
width: 120px;
height: 120px;
bottom: 293px;
}
}
}
}

77
src/forge/Main/projecthome/SubBanner.jsx Normal file
View File

@ -0,0 +1,77 @@
import React from 'react';
import Slider from 'react-slick';
import { getImageUrl } from 'educoder';
import Eye from '../img/index/eye.png';
import Data from '../img/index/data.png';
import Earth from '../img/index/earth.png';
import Imgs from '../img/tree.png';
const list =[
{img:Imgs,name:"openGauss-operator1",company:"华为技术有限公司",desc:"此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情",look:432,cloud:"云原声",type:"C++"},
{img:Imgs,name:"openGauss-operator2",company:"华为技术有限公司",desc:"此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情",look:432,cloud:"云原声",type:"C++"},
{img:Imgs,name:"openGauss-operator3",company:"华为技术有限公司",desc:"此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情",look:432,cloud:"云原声",type:"C++"},
{img:Imgs,name:"openGauss-operator4",company:"华为技术有限公司",desc:"此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情",look:432,cloud:"云原声",type:"C++"},
{img:Imgs,name:"openGauss-operator5",company:"华为技术有限公司",desc:"此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情",look:432,cloud:"云原声",type:"C++"},
{img:Imgs,name:"openGauss-operator6",company:"华为技术有限公司",desc:"此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情",look:432,cloud:"云原声",type:"C++"},
{img:Imgs,name:"openGauss-operator7",company:"华为技术有限公司",desc:"此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情",look:432,cloud:"云原声",type:"C++"},
{img:Imgs,name:"openGauss-operator8",company:"华为技术有限公司",desc:"此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情",look:432,cloud:"云原声",type:"C++"},
{img:Imgs,name:"openGauss-operator9",company:"华为技术有限公司",desc:"此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情",look:432,cloud:"云原声",type:"C++"},
{img:Imgs,name:"openGauss-operator10",company:"华为技术有限公司",desc:"此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情",look:432,cloud:"云原声",type:"C++"},
{img:Imgs,name:"openGauss-operator11",company:"华为技术有限公司",desc:"此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情此处为项目介绍详情",look:432,cloud:"云原声",type:"C++"},
]
const settings={
dots: false,
infinite: true,
speed: 1000,
slidesToShow: 1,
slidesToScroll: 1,
autoplay:true,
arrows:false,
adaptiveHeight:true
}
function SubBanner() {
return(
<div className="banners">
<div className="bannersCenter">
<p className="bTitle"><span>新一代开源创新服务平台</span></p>
<p className="bSubTitle">Gitlink（确实开源）-CCF官网指定的产学研融合面向软件开源创新的开源社区</p>
<div className="bannerBox">
<Slider {...settings} className="bannersProject">
{
list.map((i,k)=>{
return(
<li>
<div className="projectinfos">
<img src={i.img} alt="" />
<div>
<p className="name">{i.name}</p>
<p className="company">{i.company}</p>
</div>
</div>
<p className="desc">{i.desc}</p>
<div className="infoData">
<span><img src={Eye} alt="" /><span>{i.look}</span></span>
<span><img src={Data} alt="" /><span>{i.cloud}</span></span>
<span><img src={Earth} alt="" /><span>{i.type}</span></span>
</div>
</li>
)
})
}
</Slider>
</div>
<div className="airBubble">
{
list.map((i,k)=>{
return(
<div className={k%2 > 0 ? "right":"left"} style={{width:`${(120-k*10)}px`,height:`${(120-k*10)}px`}}><span>{i.company}/{i.name}</span></div>
)
})
}
</div>
</div>
</div>
)
}
export default SubBanner

5
src/modules/tpm/TPMIndex.css
View File

@ -28,9 +28,10 @@ body>.-task-title {
height:70px;
min-width: 1200px;
z-index: 1000;
background: rgba(0, 0, 0, 0.4);
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.5);
box-shadow: 0px 2px 4px 0px rgb(0 0 0 / 50%);
position: fixed;
background-image: linear-gradient(to right, #0F141F, #0C2A5B,#101417);
color: #fff;
}
.headerContent{
margin:0px auto;