项目首页 banner

public/css/edu-purge.css

@@ -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;

src/forge/Component/HeadSearch.jsx

@@ -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)
           }} />
       }

src/forge/Head/Header.js

@@ -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>
             :

src/forge/Main/projecthome/Index.jsx

@@ -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;

src/forge/Main/projecthome/Index.scss

@@ -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;
+      }
+    }
+  }
+}

src/forge/Main/projecthome/SubBanner.jsx

@@ -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

src/modules/tpm/TPMIndex.css

@@ -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 rgb(0 0 0 / 50%);
-  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.5);
   position: fixed;
+  background-image: linear-gradient(to right, #0F141F, #0C2A5B,#101417);
+  color: #fff;
 }
 .headerContent{
   margin:0px auto;