Merge branch 'factory' of http://172.20.32.203:3000/durian/forgeplus-react into factory
This commit is contained in:
commit
61ee8acb54
|
|
@ -232,7 +232,7 @@ const News = Loadable({
|
|||
});
|
||||
|
||||
// 此处仅维护前端可能的一级路由,不用进行项目或者组织判断的字段。
|
||||
const keyWord = ["explore", "settings", "setting", "mulan", "wiki", "issues", "setting", "trending", "code", "projects", "pulls", "mine", "login", "register", "email", "export", "nopage", "404", "403", "500", "501", "search", "organize", "login", "register", "resetPassword", "aboutus","educoder", "glcc","bindlogin", "softbot","zone", "hiagent","softwareFactory", "development", "governance", "forums", "news", "exploreStore", "factory"];
|
||||
const keyWord = ["explore", "settings", "setting", "mulan", "wiki", "issues", "setting", "trending", "code", "projects", "pulls", "mine", "login", "register", "email", "export", "nopage", "404", "403", "500", "501", "search", "organize", "login", "register", "resetPassword", "aboutus","educoder", "glcc","bindlogin", "softbot","zone", "hiagent","softwareFactory", "development", "governance", "forums", "news", "exploreStore", "factory", "zoneAdmin"];
|
||||
|
||||
class App extends Component {
|
||||
constructor(props) {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,47 @@
|
|||
@keyframes itemUp {
|
||||
0% {
|
||||
top: var(--offsetTop)
|
||||
}
|
||||
|
||||
to {
|
||||
top: 0
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes bgOpacity {
|
||||
0% {
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 0
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes voiceScale {
|
||||
0% {
|
||||
transform: scale(0)
|
||||
}
|
||||
|
||||
58% {
|
||||
transform: scale(1.28)
|
||||
}
|
||||
|
||||
to {
|
||||
transform: scale(1)
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes voiceRotate {
|
||||
0% {
|
||||
transform: rotate(0)
|
||||
}
|
||||
|
||||
55% {
|
||||
transform: rotate(6deg)
|
||||
}
|
||||
|
||||
to {
|
||||
transform: scale(-4deg)
|
||||
}
|
||||
}
|
||||
|
|
@ -9,15 +9,11 @@ if (!__SERVER__) {
|
|||
}
|
||||
const isDev = __SERVER__ ? false : window.location.port == 3007;
|
||||
const isdev2= __SERVER__ ? false : window.location.hostname ==='www.educoder.net'
|
||||
export const TEST_HOST = "http://172.20.32.202:4000/"
|
||||
export const TEST_HOST = "https://testforgeplus.trustie.net/"
|
||||
export function getImageUrl(path) {
|
||||
// https://www.educoder.net
|
||||
// https://testbdweb.trustie.net
|
||||
// const local = 'http://localhost:3000'
|
||||
path && !path.startsWith('/') && !path.startsWith('http') && (path = '/'.concat(path));
|
||||
const local = 'http://172.20.32.203:4000';
|
||||
if (isDev) {
|
||||
return `${local}${path}`
|
||||
return `${TEST_HOST}${path}`
|
||||
}
|
||||
return `${path}`;
|
||||
}
|
||||
|
|
@ -38,14 +34,10 @@ export function isPhone(){
|
|||
}
|
||||
|
||||
export function getImageUrlAbsolute(path) {
|
||||
// https://www.educoder.net
|
||||
// https://testbdweb.trustie.net
|
||||
// const local = 'http://localhost:3000'
|
||||
path && !path.startsWith('/') && !path.startsWith('http') && (path = '/'.concat(path));
|
||||
const local = 'http://172.20.32.202:4000/';
|
||||
const prod = __SERVER__ ? local : window.location.origin;
|
||||
const prod = __SERVER__ ? TEST_HOST : window.location.origin;
|
||||
if (isDev) {
|
||||
return `${local}${path}`
|
||||
return `${TEST_HOST}${path}`
|
||||
}else{
|
||||
return `${prod}${path}`;
|
||||
}
|
||||
|
|
@ -69,13 +61,9 @@ export function numFormat(num, digits){
|
|||
}
|
||||
|
||||
export function getImage(path) {
|
||||
// https://www.educoder.net
|
||||
// https://testbdweb.trustie.net
|
||||
// const local = 'http://localhost:3000'
|
||||
const local = 'http://172.20.32.202:4000//';
|
||||
if(path.indexOf("http://")===-1){
|
||||
if (isDev) {
|
||||
return `${local}/images/${path}`
|
||||
return `${TEST_HOST}/images/${path}`
|
||||
}
|
||||
return `/${path}`;
|
||||
}else{
|
||||
|
|
@ -84,14 +72,9 @@ export function getImage(path) {
|
|||
}
|
||||
|
||||
export function getcdnImageUrl(path) {
|
||||
// https://www.educoder.net
|
||||
// https://testbdweb.trustie.net
|
||||
// const local = 'http://localhost:3000'
|
||||
const testlocal = 'https://testali-cdn.educoder.net'
|
||||
const local='https://ali-cdn.educoder.net'
|
||||
let firstStr=path.substr(0,1);
|
||||
if (isdev2) {
|
||||
return `${local}/${path}`;
|
||||
return `${TEST_HOST}/${path}`;
|
||||
}else{
|
||||
if(firstStr=="/"){
|
||||
return `${path}`
|
||||
|
|
@ -103,20 +86,18 @@ export function getcdnImageUrl(path) {
|
|||
}
|
||||
|
||||
export function setcndImagesUrl(path){
|
||||
const testlocal = 'https://testali-cdn.educoder.net'
|
||||
const local='https://ali-cdn.educoder.net'
|
||||
let firstStr=path.substr(0,1);
|
||||
if(firstStr=="/"){
|
||||
if (!isdev2) {
|
||||
return `${path}`
|
||||
}
|
||||
return `${local}${path}`;
|
||||
return `${TEST_HOST}${path}`;
|
||||
//return isDev?`${testlocal}${path}`:`${local}${path}`;
|
||||
}else{
|
||||
if (!isdev2) {
|
||||
return `/${path}`
|
||||
}
|
||||
return `${local}/${path}`;
|
||||
return `${TEST_HOST}/${path}`;
|
||||
// return isDev?`${testlocal}/${path}`:`${local}/${path}`;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -138,7 +138,7 @@ function ProjectHomePage(props) {
|
|||
<div className="homepage-box-title">
|
||||
<span className="font-12 homepage-box-title-tag"><img src={img16} width={13} className="mr5"/>技术赋能</span>
|
||||
<div className="font-40 p_h_title mt10">开源软件仓库</div>
|
||||
<div className="font-40 p_h_title">护航菌事<span className="p_h_title_text">数智发展</span></div>
|
||||
<div className="font-40 p_h_title">服务可信<span className="p_h_title_text">资源共享</span></div>
|
||||
<div className="font-18 mb40 mt10">汇聚全球顶尖开源力量,构建安全、协同、创新的软件生态</div>
|
||||
</div>
|
||||
{/* <div className="font-60 p_h_title pt70">·<span className="p_h_title_text">护航菌事数智</span></div> */}
|
||||
|
|
@ -262,7 +262,9 @@ function ProjectHomePage(props) {
|
|||
{/* {i.author && i.author.login === "gh_mirrors" && i.topics && !i.topics.length && <span className='proListTopic mr15 font-13 task-hide'>华中科技大学</span>} */}
|
||||
{i.topics.slice(0, 2).map(item => <Tooltip title={item.name}><Link to={`/explore/topic/${item.id}/${encodeURIComponent(item.name)}`} className='proListTopic mr15 font-13 task-hide'>{item.name}</Link></Tooltip>)}
|
||||
</div>}
|
||||
<Button className="detail-but-black" href={url}>查看详情</Button>
|
||||
<div className="detail-but-black-box">
|
||||
<Button className="detail-but-black" href={url}>查看详情</Button>
|
||||
</div>
|
||||
</div>
|
||||
})}
|
||||
</div> : <Nodata _html="暂无数据" />}
|
||||
|
|
|
|||
|
|
@ -105,11 +105,12 @@
|
|||
padding: 20px 30px;
|
||||
background-image: url('../image/icon17.png');
|
||||
background-size: 100% 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.cate_item {
|
||||
cursor: pointer;
|
||||
padding: 2px 15px;
|
||||
padding: 2px 25px;
|
||||
background-color: rgba(255, 255, 255, 0.7);
|
||||
border-radius: 16px;
|
||||
position: relative;
|
||||
|
|
@ -135,6 +136,11 @@
|
|||
transition: left 0.5s ease-in-out;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover{
|
||||
transition: font-weight 0.5s;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.left_cate2 {
|
||||
|
|
@ -191,6 +197,7 @@
|
|||
border: 1px solid #f1f6ff;
|
||||
position: relative;
|
||||
box-shadow: 0 0 12px rgba(92, 102, 193, 0.05);
|
||||
overflow: hidden;
|
||||
|
||||
.task-hide-2 {
|
||||
word-break: break-all;
|
||||
|
|
@ -226,6 +233,18 @@
|
|||
// border-color: #2149d4;
|
||||
}
|
||||
|
||||
.detail-but-black-box{
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
bottom: -10px;
|
||||
transition: bottom 0.2s ease-out, opacity 0.2s ease-out;
|
||||
margin-left: -15px;
|
||||
border-radius: 0px 0px 10px 10px;
|
||||
text-align: center;
|
||||
padding-top: 6px;
|
||||
background: linear-gradient(180deg, rgb(255 255 255 / 29%), rgba(255, 255, 255, 1));
|
||||
}
|
||||
|
||||
.detail-but-black {
|
||||
line-height: 32px;
|
||||
|
|
@ -233,10 +252,6 @@
|
|||
color: #ffffff;
|
||||
background-color: #091221;
|
||||
border: none;
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
bottom: 0px;
|
||||
transition: bottom 0.2s ease-out, opacity 0.2s ease-out;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
|
|
@ -245,8 +260,8 @@
|
|||
display: none;
|
||||
}
|
||||
|
||||
.detail-but-black {
|
||||
bottom: 10px;
|
||||
.detail-but-black-box {
|
||||
bottom: 0px;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
|
|
@ -258,7 +273,7 @@
|
|||
width: 100%;
|
||||
height: 100%;
|
||||
background: linear-gradient(120deg, rgba(255, 255, 255, 0)0%, rgba(255, 255, 255, 0.5)50%, rgba(255, 255, 255, 0)100%);
|
||||
animation: flowLight 0.5s ease-in-out;
|
||||
animation: flowLight 1s ease-in-out 0.1s;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 316 KiB After Width: | Height: | Size: 337 KiB |
|
|
@ -6,6 +6,7 @@ import { Link } from "react-router-dom";
|
|||
import { getImageUrl, timeAgo } from "educoder";
|
||||
import Nodata from "../../Nodata";
|
||||
import { HoverUnderline } from "../../../components/title";
|
||||
import ActionItem from "../../../factory/resource/components/ActionItem";
|
||||
const { Panel } = Collapse;
|
||||
|
||||
// 开源协作首页
|
||||
|
|
@ -106,36 +107,38 @@ function ProjectList() {
|
|||
return <div className="project_home">
|
||||
{/* 推荐仓库 */}
|
||||
<div className="center pt80 project_home_banner width1600">
|
||||
<div className="font-60 p_h_title">开源协作·<span className="p_h_title_text">共建生态</span></div>
|
||||
<Input.Search placeholder={`输入名称关键字(共${total}个)`} className="search_p_h" onChange={(e)=>{setSearchValue(e.target.value)}} suffix={<span className="search_icon" onClick={()=>{setSearch(searchValue)}}>
|
||||
<i className="iconfont icon-svg_jiantou1 font-14"></i>
|
||||
</span>} onSearch={(value)=>{
|
||||
setSearch(value)
|
||||
}}/>
|
||||
<div className="font-60 p_h_title"><span>开源协作·</span><span className="p_h_title_text">共建生态</span></div>
|
||||
<ActionItem padding="1px" className="search_p_h_box" borderRadius="32px">
|
||||
<Input.Search placeholder={`输入名称关键字(共${total}个)`} className="search_p_h" onChange={(e)=>{setSearchValue(e.target.value)}} suffix={<span className="search_icon" onClick={()=>{setSearch(searchValue)}}>
|
||||
<i className="iconfont icon-svg_jiantou1 font-14"></i>
|
||||
</span>} onSearch={(value)=>{
|
||||
setSearch(value)
|
||||
}}/>
|
||||
</ActionItem>
|
||||
<img src={require('../image/icon3.png').default} width={144} className="project_home_banner_img1" />
|
||||
<img src={require('../image/icon4.png').default} width={78} className="project_home_banner_img2" />
|
||||
{bannerProjects[0] && <div className="project_home_banner_project1">
|
||||
<img src={require('../image/icon7.png')} width={78} className="mr5" />
|
||||
{bannerProject(bannerProjects[0])}
|
||||
<div className="edu-txt-right mt15">
|
||||
<div className="edu-txt-right mt15 author_img_box">
|
||||
{bannerProjects[0].author && <img src={getImageUrl(`${bannerProjects[0].author.image_url}`)} alt="" className="author_img" />}
|
||||
</div>
|
||||
</div>}
|
||||
{bannerProjects[1] && <div className="project_home_banner_project2">
|
||||
{bannerProject(bannerProjects[1])}
|
||||
{bannerProjects[1].author && <img src={getImageUrl(`${bannerProjects[1].author.image_url}`)} alt="" className="author_img" />}
|
||||
{bannerProjects[1].author && <div className="author_img_box"><img src={getImageUrl(`${bannerProjects[1].author.image_url}`)} alt="" className="author_img" /></div>}
|
||||
<img src={require('../image/icon5.png')} width={26} className="ml20" />
|
||||
</div>}
|
||||
{bannerProjects[2] && <div className="project_home_banner_project3">
|
||||
{bannerProject(bannerProjects[2])}
|
||||
<div className="edu-txt-left">
|
||||
<div className="edu-txt-left author_img_box">
|
||||
{bannerProjects[2].author && <img src={getImageUrl(`${bannerProjects[2].author.image_url}`)} alt="" className="author_img" />}
|
||||
</div>
|
||||
<img src={require('../image/icon8.png')} width={78} className="ml5 icon8_img" />
|
||||
</div>}
|
||||
{bannerProjects[3] && <div className="project_home_banner_project4">
|
||||
{bannerProject(bannerProjects[3])}
|
||||
{bannerProjects[3].author && <img src={getImageUrl(`${bannerProjects[3].author.image_url}`)} alt="" className="author_img" />}
|
||||
{bannerProjects[3].author && <div className="author_img_box"><img src={getImageUrl(`${bannerProjects[3].author.image_url}`)} alt="" className="author_img" /></div>}
|
||||
<img src={require('../image/icon6.png')} width={26} className="ml20" />
|
||||
</div>}
|
||||
</div>
|
||||
|
|
@ -145,7 +148,7 @@ function ProjectList() {
|
|||
const url = i.author ? `/${i.author.login}/${i.identifier}${i.author.login === "gh_mirrors" ? "/about" : "/about"}` : ``
|
||||
const { author = {} } = i;
|
||||
return <div key={index} className="project_list_top_item">
|
||||
{i.topics && <div className='proListTopics df mb20'>
|
||||
{i.topics && <div className='proListTopics df mb15'>
|
||||
{i.topics.map(item => <Tooltip title={item.name}><Link to={`/explore/topic/${item.id}/${encodeURIComponent(item.name)}`} className='proListTopic task-hide'>{item.name}</Link></Tooltip>)}
|
||||
</div>}
|
||||
<Link to={url}><div className="task-hide font-22" title={i.name}>{author.name}/{i.name}</div></Link>
|
||||
|
|
@ -154,7 +157,7 @@ function ProjectList() {
|
|||
{i.description}
|
||||
</div>
|
||||
</Tooltip>}
|
||||
{author && <div className="mt25">
|
||||
{author && <div className="mt35">
|
||||
{author.image_url && <img src={getImageUrl(`${author.image_url}`)} alt="" className="author_img mr10" />}
|
||||
{author.name}
|
||||
{timeAgo(i.updated_on)}更新
|
||||
|
|
@ -172,7 +175,7 @@ function ProjectList() {
|
|||
<div className="project_list_all_box">
|
||||
<div className="width1600 mb30">
|
||||
<div className="cate_list_box">
|
||||
<span className={`cate_item font-15 font-bd ${cateID ? '' : 'active'}`} onClick={() => {setPage(1); setCateID(undefined) }}>最近更新</span>
|
||||
<span className={`cate_item font-15 ${cateID ? '' : 'active'}`} onClick={() => {setPage(1); setCateID(undefined) }}>最近更新</span>
|
||||
{cateList.map(cate => {
|
||||
const isActive = cate.id === cateID;
|
||||
return <span key={cate.id} className={`cate_item font-15 ${isActive ? 'active' : ''}`} onClick={() => {setPage(1); setCateID(cate.id) }}>{cate.name}</span>
|
||||
|
|
@ -250,7 +253,7 @@ function ProjectList() {
|
|||
})}
|
||||
</span>
|
||||
</div>
|
||||
<Collapse expandIconPosition="right" className="hot_project_Collapse">
|
||||
<Collapse accordion expandIconPosition="right" className="hot_project_Collapse" defaultActiveKey={projectsListByHot[1].id}>
|
||||
{projectsListByHot.map(project => {
|
||||
return <Panel header={project.name} key={project.id}>
|
||||
<div>{project.description || '暂无数据'}</div>
|
||||
|
|
|
|||
|
|
@ -1,3 +1,4 @@
|
|||
@import '../../../animations.scss';
|
||||
.project_home {
|
||||
font-family: "alibabaReg";
|
||||
color: #091221;
|
||||
|
|
@ -19,6 +20,19 @@
|
|||
.p_h_title {
|
||||
font-family: "DouyinSansBold";
|
||||
letter-spacing: 4px;
|
||||
&>:first-child {
|
||||
--duration: 200ms;
|
||||
--delay: 240ms
|
||||
}
|
||||
&>:nth-child(2) {
|
||||
--duration: 200ms;
|
||||
--delay: 400ms;
|
||||
}
|
||||
&>*{
|
||||
position: relative;
|
||||
--offsetTop: 56px;
|
||||
animation: itemUp var(--duration) ease-in-out var(--delay) forwards, bgOpacity var(--duration) linear var(--delay) reverse backwards
|
||||
}
|
||||
}
|
||||
|
||||
.p_h_title_text {
|
||||
|
|
@ -27,6 +41,35 @@
|
|||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
|
||||
.search_p_h_box{
|
||||
display: inline-block;
|
||||
margin: 0 auto;
|
||||
border: 4px solid rgba(9, 18, 33, 0);
|
||||
--offsetTop: 26px;
|
||||
animation: itemUp .4s ease-in-out .76s forwards, bgOpacity .4s linear .76s reverse backwards;
|
||||
&:before {
|
||||
animation: rotate 8s linear 1.5s infinite;
|
||||
background: conic-gradient(
|
||||
from 180deg at 50% 50%,
|
||||
#9a8bff 0deg,
|
||||
#ffac8b 45deg,
|
||||
transparent 90deg,
|
||||
transparent 180deg,
|
||||
#9a8bff 180deg,
|
||||
#ffac8b 225deg,
|
||||
transparent 270deg
|
||||
);
|
||||
z-index: 0;
|
||||
}
|
||||
&:hover{
|
||||
border: 4px solid rgba(9, 18, 33, 0.1);
|
||||
&:before{
|
||||
animation: none;
|
||||
background: #091221;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search_p_h {
|
||||
width: 660px;
|
||||
height: 52px;
|
||||
|
|
@ -62,6 +105,21 @@
|
|||
|
||||
.project_home_banner {
|
||||
position: relative;
|
||||
&_img1, &_img2, &_project1, &_project2, &_project3, &_project4 {
|
||||
--scale-during: 0.5s;
|
||||
--scale-delay: 0.96s;
|
||||
--rotate-during: 0.5s;
|
||||
--rotate-delay: 0.96s;
|
||||
--opacity-during: 0.5s;
|
||||
--opacity-delay: 0.96s;
|
||||
animation: voiceScale var(--scale-during) ease-in-out var(--scale-delay), bgOpacity var(--opacity-during) ease-in-out var(--opacity-delay) reverse backwards;
|
||||
// animation: voiceScale var(--scale-during) ease-in-out var(--scale-delay), voiceRotate var(--rotate-during) ease-in-out var(--rotate-delay), bgOpacity var(--opacity-during) ease-in-out var(--opacity-delay) reverse backwards;
|
||||
}
|
||||
.author_img_box{
|
||||
--rotate-during: 0.5s;
|
||||
--rotate-delay: 0.96s;
|
||||
animation: voiceRotate var(--rotate-during) ease-in-out var(--rotate-delay);
|
||||
}
|
||||
|
||||
&_img1 {
|
||||
position: absolute;
|
||||
|
|
@ -72,7 +130,7 @@
|
|||
&_img2 {
|
||||
position: absolute;
|
||||
top: 45%;
|
||||
right: 14%;
|
||||
right: 12%;
|
||||
}
|
||||
|
||||
&_project1 {
|
||||
|
|
@ -83,6 +141,10 @@
|
|||
.bannerProject {
|
||||
right: 45px;
|
||||
top: 44px;
|
||||
animation-delay: 1s !important;
|
||||
}
|
||||
.author_img{
|
||||
animation-delay: 1s !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -94,17 +156,17 @@
|
|||
.bannerProject {
|
||||
right: 90px;
|
||||
top: 0px;
|
||||
animation-delay: 4s !important;
|
||||
animation-delay: 4.5s !important;
|
||||
}
|
||||
.author_img{
|
||||
animation-delay: 4s !important;
|
||||
animation-delay: 4.5s !important;
|
||||
}
|
||||
}
|
||||
|
||||
&_project3 {
|
||||
position: absolute;
|
||||
top: 22%;
|
||||
right: 22%;
|
||||
right: 20%;
|
||||
|
||||
.icon8_img {
|
||||
margin-top: -20px;
|
||||
|
|
@ -113,34 +175,35 @@
|
|||
.bannerProject {
|
||||
left: 47px;
|
||||
top: 0px;
|
||||
animation-delay: 8s !important;
|
||||
animation-delay: 8.5s !important;
|
||||
}
|
||||
.author_img{
|
||||
animation-delay: 8s !important;
|
||||
animation-delay: 8.5s !important;
|
||||
}
|
||||
}
|
||||
|
||||
&_project4 {
|
||||
position: absolute;
|
||||
bottom: -10%;
|
||||
right: 20.3%;
|
||||
right: 18.3%;
|
||||
|
||||
.bannerProject {
|
||||
left: 47px;
|
||||
top: 0px;
|
||||
animation-delay: 12s !important;
|
||||
animation-delay: 12.5s !important;
|
||||
}
|
||||
.author_img{
|
||||
animation-delay: 12s !important;
|
||||
animation-delay: 12.5s !important;
|
||||
}
|
||||
}
|
||||
|
||||
.author_img {
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
border: 1.5px solid white;
|
||||
border: 2px solid white;
|
||||
background-color: #F6F6F6;
|
||||
animation: scalemax 2s forwards;
|
||||
animation: scalemax 17s infinite;
|
||||
filter: drop-shadow(13px 13px 13px rgba(110, 170, 166, .15)) drop-shadow(2.5px 2.5px 7.5px rgba(19, 75, 83, .1));
|
||||
}
|
||||
|
||||
.bannerProject {
|
||||
|
|
@ -150,7 +213,7 @@
|
|||
padding: 10px 12px;
|
||||
width: 238px;
|
||||
opacity: 0;
|
||||
animation: slideLeftFadeIn 3s forwards;
|
||||
animation: slideLeftFadeIn 17s infinite;
|
||||
|
||||
.icon-66 {
|
||||
background-image: linear-gradient(180deg, rgba(33, 73, 212, 0.04) 0%, rgba(33, 73, 212, 0.14) 100%);
|
||||
|
|
@ -169,6 +232,9 @@
|
|||
display: grid;
|
||||
gap: 20px;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
position: relative;
|
||||
--offsetTop: 36px;
|
||||
animation: itemUp .4s ease-in-out 1.05s forwards, bgOpacity .4s linear 1.05s reverse backwards;
|
||||
}
|
||||
|
||||
.project_list_top_item {
|
||||
|
|
@ -215,6 +281,9 @@
|
|||
padding: 40px 0 100px;
|
||||
background-image: linear-gradient(179.88deg, #ffffff 0%, rgba(255, 255, 255, 0.62) 16.1%, rgba(255, 255, 255, 0) 100%);
|
||||
border-radius: 40px 40px 0 0;
|
||||
position: relative;
|
||||
--offsetTop: 66px;
|
||||
animation: itemUp .4s ease-in-out 1.35s forwards, bgOpacity .4s linear 1.35s reverse backwards;
|
||||
|
||||
.cate_list_box {
|
||||
display: flex;
|
||||
|
|
@ -250,6 +319,10 @@
|
|||
transition: left 0.5s ease-in-out;
|
||||
}
|
||||
}
|
||||
&:hover{
|
||||
transition: font-weight 0.5s;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -273,6 +346,16 @@
|
|||
&:hover {
|
||||
background-color: #f7f9fd;
|
||||
font-weight: bold;
|
||||
position: relative;
|
||||
a{
|
||||
color:#27254c;
|
||||
}
|
||||
&::before{
|
||||
content: '\e8d6';
|
||||
font-family: 'iconfont';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&:not(:last-of-type) {
|
||||
|
|
@ -392,9 +475,12 @@
|
|||
0%{
|
||||
scale: 1;
|
||||
}
|
||||
40%{
|
||||
5%{
|
||||
scale: 1.28;
|
||||
}
|
||||
25.1%{
|
||||
scale: 1;
|
||||
}
|
||||
100%{
|
||||
scale: 1;
|
||||
}
|
||||
|
|
@ -405,12 +491,18 @@
|
|||
opacity: 0.4;
|
||||
width: 200px;
|
||||
}
|
||||
20%{
|
||||
5%{
|
||||
width: 238px;
|
||||
}
|
||||
50%{
|
||||
20%{
|
||||
opacity: 1;
|
||||
}
|
||||
25%{
|
||||
opacity: 0;
|
||||
}
|
||||
25.1%{
|
||||
opacity: 0;
|
||||
}
|
||||
100%{
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -137,11 +137,11 @@ function List(props) {
|
|||
<div className="forums-list-box">
|
||||
<div className="forums-banner-box">
|
||||
<div className="width1600 center">
|
||||
<div className="font-60 font-bd forums-banner-title1">论坛交流·<span className="carousel-text">解锁头脑风暴</span></div>
|
||||
<div className="font-18 mb35">开源动态,社区前言新闻速递,开启开源新视野</div>
|
||||
<div className="font-60 font-bd forums-banner-title1 mb10"><span>论坛交流·</span><span className="carousel-text">开始思想的</span><span className="carousel-text">联接与互动</span></div>
|
||||
<div className="font-18 mb35 forums-banner-title2">需求反馈 技术交流 创意分享</div>
|
||||
{forumsDoMain && rollingButton({href: `${forumsDoMain}/forums/new`, name: '发布帖子', hoverName: '发布帖子', classname: "add-forums"})}
|
||||
</div>
|
||||
<div className="width1600 df pt50">
|
||||
<div className="width1600 df pt50 forums-hot-list">
|
||||
{forumsImgList && !!forumsImgList.length && <Carousel autoplay className='forums-list-left-Carousel' beforeChange={(_, nextId)=>{setActiveId(nextId)}}>
|
||||
{forumsImgList.map((item, index)=>{
|
||||
return <img src={httpUrl + item.memo_image_info.url} alt=''key={index}/>
|
||||
|
|
|
|||
|
|
@ -1,3 +1,4 @@
|
|||
@import '../../animations.scss';
|
||||
.forums-list-box {
|
||||
color: #091221;
|
||||
background-color: #f1f6fd;
|
||||
|
|
@ -21,13 +22,40 @@
|
|||
.forums-banner-title1 {
|
||||
font-family: 'DouyinSansBold';
|
||||
line-height: normal;
|
||||
|
||||
&>:first-child {
|
||||
--duration: 200ms;
|
||||
--delay: 240ms
|
||||
}
|
||||
&>:nth-child(2) {
|
||||
--duration: 200ms;
|
||||
--delay: 400ms;
|
||||
}
|
||||
&>:nth-child(3) {
|
||||
--duration: 200ms;
|
||||
--delay: 600ms;
|
||||
}
|
||||
&>*{
|
||||
position: relative;
|
||||
--offsetTop: 56px;
|
||||
animation: itemUp var(--duration) ease-in-out var(--delay) forwards, bgOpacity var(--duration) linear var(--delay) reverse backwards
|
||||
}
|
||||
}
|
||||
|
||||
.carousel-text {
|
||||
background-image: linear-gradient(313.07deg, #d62ece 0%, #1664ff 65.83%, #06050e 100%);
|
||||
background-image: linear-gradient(313.07deg, #d62ece 0%, #1664ff 100%);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
&:nth-of-type(2){
|
||||
background-image: linear-gradient(313.07deg, #1664ff 0%, #06050e 100%);
|
||||
}
|
||||
}
|
||||
|
||||
.forums-banner-title2{
|
||||
position: relative;
|
||||
--offsetTop: 26px;
|
||||
animation: itemUp .4s ease-in-out .86s forwards, bgOpacity .4s linear .86s reverse backwards;
|
||||
}
|
||||
|
||||
.add-forums {
|
||||
|
|
@ -36,6 +64,9 @@
|
|||
border-radius: 30px;
|
||||
border: 4px solid #CCD3E8;
|
||||
line-height: 52px;
|
||||
position: relative;
|
||||
--offsetTop: 26px;
|
||||
animation: itemUp .4s ease-in-out 1.16s forwards, bgOpacity .4s linear 1.16s reverse backwards;
|
||||
|
||||
&:hover {
|
||||
span {
|
||||
|
|
@ -105,7 +136,7 @@
|
|||
}
|
||||
|
||||
.forums-list-item:hover, .forums-list-item-active {
|
||||
background-image: linear-gradient(180deg,#f7f9fd00 0%, #f7f9fd 100%);
|
||||
background-image: linear-gradient(180deg,#f7f9fd00 0%, #f7f9fd 100%);
|
||||
border-radius: 4px;
|
||||
font-weight: bold;
|
||||
|
||||
|
|
@ -126,12 +157,21 @@
|
|||
.forums-list2 {
|
||||
padding: 0 25px 12px 25px;
|
||||
}
|
||||
|
||||
.forums-hot-list{
|
||||
position: relative;
|
||||
--offsetTop: 56px;
|
||||
animation: itemUp .4s ease-in-out 1.36s forwards, bgOpacity .4s linear 1.36s reverse backwards;
|
||||
}
|
||||
}
|
||||
|
||||
.forums-list3-box {
|
||||
padding: 80px 0 60px;
|
||||
background-image: linear-gradient(179.88deg, #ffffff 0%, rgba(255, 255, 255, 0.62) 16.1%, rgba(255, 255, 255, 0) 100%);
|
||||
border-radius: 40px;
|
||||
position: relative;
|
||||
--offsetTop: 66px;
|
||||
animation: itemUp .4s ease-in-out 1.56s forwards, bgOpacity .4s linear 1.56s reverse backwards;
|
||||
.user-img{
|
||||
width:24px;
|
||||
height:24px;
|
||||
|
|
|
|||
|
|
@ -16,10 +16,11 @@ class Shixunauthority extends Component {
|
|||
{(!current_user || !current_user.login) && (
|
||||
<p style={{display:"inline"}}>您可尝试<a href={`/login`} className="color-blue">登录</a>或</p>
|
||||
)}
|
||||
<a href="/" className="color-blue">返回首页</a>,也可以通过
|
||||
<a href="/" className="color-blue">返回首页</a>
|
||||
{/* ,也可以通过
|
||||
<a target="_blank"
|
||||
href="https://qm.qq.com/cgi-bin/qm/qr?k=YVGUhY7uK8ovpyd7tG_lHe2qGZ63LOij&jump_from=webapi"
|
||||
className="color-blue">QQ</a>向我们反馈
|
||||
className="color-blue">QQ</a>向我们反馈 */}
|
||||
</p>
|
||||
</div>
|
||||
{/*<div style="clear:both;"></div>*/}
|
||||
|
|
|
|||
|
|
@ -17,10 +17,10 @@ class http500 extends Component {
|
|||
<p style={{display:"inline"}}>您可尝试<a href={`/login`} className="color-blue">登录</a>或</p>
|
||||
)}
|
||||
<a href="/" className="color-blue">返回首页</a>
|
||||
,也可通过
|
||||
{/* ,也可通过
|
||||
<a target="_blank"
|
||||
href="https://qm.qq.com/cgi-bin/qm/qr?k=YVGUhY7uK8ovpyd7tG_lHe2qGZ63LOij&jump_from=webapi"
|
||||
className="color-blue">QQ</a>向我们反馈
|
||||
className="color-blue">QQ</a>向我们反馈 */}
|
||||
</p>
|
||||
</div>
|
||||
{/*<div style="clear:both;"></div>*/}
|
||||
|
|
|
|||
|
|
@ -12,10 +12,10 @@ class Shixunnopage extends Component {
|
|||
<p>服务器异常,请稍后重试</p>
|
||||
您可尝试<a href="javascript:location.reload();" className="color-blue">刷新页面</a>或<a href="/"
|
||||
className="color-blue">返回首页</a>
|
||||
,也可以通过
|
||||
{/* ,也可以通过
|
||||
<a target="_blank"
|
||||
href="https://qm.qq.com/cgi-bin/qm/qr?k=YVGUhY7uK8ovpyd7tG_lHe2qGZ63LOij&jump_from=webapi"
|
||||
className="color-blue">QQ</a>向我们反馈
|
||||
className="color-blue">QQ</a>向我们反馈 */}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -55,8 +55,8 @@ function List() {
|
|||
return (
|
||||
<div className="community-news-box">
|
||||
<div className="center">
|
||||
<div className="font-60 font-bd pt80 lineh-80">社区动态·<span className="carousel-text">洞见速递</span></div>
|
||||
<div className="font-18">开源动态,社区前言新闻速递,开启开源新视野</div>
|
||||
<div className="font-60 font-bd pt80 lineh-80 community-news-title1 mb10"><span>社区动态·</span><span className="carousel-text">实时感知开源脉搏</span></div>
|
||||
<div className="font-18 community-news-title2">技术前沿 精彩活动 项目动态</div>
|
||||
</div>
|
||||
<div className="width1600 community-news-1">
|
||||
<div className="community-news-title font-20 font-bd color-white">阅见精要×新闻精髓</div>
|
||||
|
|
|
|||
|
|
@ -1,3 +1,4 @@
|
|||
@import '../../animations.scss';
|
||||
.community-news-box{
|
||||
color: #091221;
|
||||
background-color: #f1f6fd;
|
||||
|
|
@ -12,6 +13,26 @@
|
|||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
}
|
||||
.community-news-title1{
|
||||
&>:first-child {
|
||||
--duration: 200ms;
|
||||
--delay: 240ms
|
||||
}
|
||||
&>:nth-child(2) {
|
||||
--duration: 200ms;
|
||||
--delay: 400ms;
|
||||
}
|
||||
&>*{
|
||||
position: relative;
|
||||
--offsetTop: 56px;
|
||||
animation: itemUp var(--duration) ease-in-out var(--delay) forwards, bgOpacity var(--duration) linear var(--delay) reverse backwards
|
||||
}
|
||||
}
|
||||
.community-news-title2{
|
||||
position: relative;
|
||||
--offsetTop: 26px;
|
||||
animation: itemUp .4s ease-in-out .46s forwards, bgOpacity .4s linear .46s reverse backwards;
|
||||
}
|
||||
}
|
||||
.community-news-1{
|
||||
margin-top: 60px;
|
||||
|
|
@ -20,6 +41,8 @@
|
|||
background-image: url('../image/bk5.png');
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
--offsetTop: 56px;
|
||||
animation: itemUp .4s ease-in-out .76s forwards, bgOpacity .4s linear .76s reverse backwards;
|
||||
.community-news-title{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
|
|
@ -152,6 +175,9 @@
|
|||
.activities-box{
|
||||
background-image: url('../image/bk6.png');
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
--offsetTop: 56px;
|
||||
animation: itemUp .4s ease-in-out .96s forwards, bgOpacity .4s linear .96s reverse backwards;
|
||||
}
|
||||
.activity-list-box{
|
||||
display: grid;
|
||||
|
|
|
|||
Loading…
Reference in New Issue