diff --git a/src/animations.scss b/src/animations.scss index f6058a585..a7ac1c8ee 100644 --- a/src/animations.scss +++ b/src/animations.scss @@ -44,4 +44,10 @@ to { transform: scale(-4deg) } +} + +@keyframes resourceShow { + to { + transform: scale(1); + } } \ No newline at end of file diff --git a/src/forge/projectHome/explore/index.jsx b/src/forge/projectHome/explore/index.jsx index 3a9eec2fe..37a3fc14c 100644 --- a/src/forge/projectHome/explore/index.jsx +++ b/src/forge/projectHome/explore/index.jsx @@ -137,9 +137,9 @@ function ProjectHomePage(props) {
技术赋能 -
开源软件仓库
-
服务可信资源共享
-
汇聚全球顶尖开源力量,构建安全、协同、创新的软件生态
+
开源软件仓库
+
服务可信资源共享
+
汇聚全球顶尖开源力量,构建安全、协同、创新的软件生态
{/*
·护航菌事数智
*/} {/*
汇聚全球顶尖开源力量,构建安全、协同、创新的软件生态,赋能菌事数字化转型与智能化升级
*/} @@ -165,7 +165,7 @@ function ProjectHomePage(props) {
-
+
软件分类: {cateList && !!cateList.length && cateList.map(cate => { @@ -175,7 +175,7 @@ function ProjectHomePage(props) {
-
+
{topicsByCateId && !!topicsByCateId.length &&
  • { setPage(1); setTopicId(undefined) }}> diff --git a/src/forge/projectHome/explore/index.scss b/src/forge/projectHome/explore/index.scss index 5cf872cc7..5c5f00ce5 100644 --- a/src/forge/projectHome/explore/index.scss +++ b/src/forge/projectHome/explore/index.scss @@ -1,3 +1,4 @@ +@import '../../../animations.scss'; .homepage-box { font-family: "alibabaReg"; color: #091221; @@ -17,6 +18,7 @@ color:#ffffff; background-image:linear-gradient(90.73deg,#816af2 0%,#ac97f9 100%); border-radius:10px 0px 10px 0px; + animation: bgOpacity .4s linear .56s reverse backwards; } .p_h_title { @@ -31,11 +33,32 @@ -webkit-text-fill-color: transparent; } + .p_h_title_1{ + position: relative; + --offsetTop: 26px; + animation: itemUp .4s ease-in-out .36s forwards, bgOpacity .4s linear .36s reverse backwards; + } + + .p_h_title_2{ + position: relative; + --offsetTop: 26px; + animation: itemUp .4s ease-in-out .66s forwards, bgOpacity .4s linear .66s reverse backwards; + } + + .p_h_title_3{ + position: relative; + --offsetTop: 26px; + animation: itemUp .4s ease-in-out .86s forwards, bgOpacity .4s linear .86s reverse backwards; + } + .project_count { padding: 0 80px; height: 145px; background-image: url('../image/bk4.png'); background-size: 100% 100%; + position: relative; + --offsetTop: 46px; + animation: itemUp .4s ease-in-out 1.16s forwards, bgOpacity .4s linear 1.16s reverse backwards; .ant-divider-vertical { height: 52px; @@ -54,6 +77,9 @@ padding: 17px 30px; background-image: linear-gradient(145.03deg, #f2e8e9 0%, #f2e8e9 19.38%, #a7b0ff 76.71%, #b3a7ff 100%); border-radius: 15px; + position: relative; + --offsetTop: 46px; + animation: itemUp .4s ease-in-out 1.36s forwards, bgOpacity .4s linear 1.36s reverse backwards; } .needApplyBut { @@ -94,6 +120,10 @@ .homepage_content_v3 { 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; + transform: scale(0.85); + position: relative; + --offsetTop: 56px; + animation: bgOpacity .8s linear 1.56s reverse backwards, resourceShow 0.8s 1.56s ease-in-out forwards;; .cate_list_box { display: flex; @@ -351,6 +381,16 @@ } } } + // .homepage_content_v3_1{ + // position: relative; + // --offsetTop: 66px; + // animation: itemUp .4s ease-in-out 1.86s forwards, bgOpacity .4s linear 1.86s reverse backwards; + // } + // .homepage_content_v3_2{ + // position: relative; + // --offsetTop: 66px; + // animation: itemUp .4s ease-in-out 2s forwards, bgOpacity .4s linear 2s reverse backwards; + // } } .tipByCate_Popover_box{ position: relative; diff --git a/src/forge/projectHome/projectList/index.jsx b/src/forge/projectHome/projectList/index.jsx index 40ebea0bb..8ff374b6d 100644 --- a/src/forge/projectHome/projectList/index.jsx +++ b/src/forge/projectHome/projectList/index.jsx @@ -151,7 +151,7 @@ function ProjectList() { {i.topics &&
    {i.topics.map(item => {item.name})}
    } -
    {author.name}/{i.name}
    +
    {author.name}/{i.name}
    {i.description &&
    {i.description} diff --git a/src/forge/projectHome/projectList/index.scss b/src/forge/projectHome/projectList/index.scss index e23cdeab2..c327dbbf5 100644 --- a/src/forge/projectHome/projectList/index.scss +++ b/src/forge/projectHome/projectList/index.scss @@ -2,7 +2,7 @@ .project_home { font-family: "alibabaReg"; color: #091221; - background-color: #f1f6fd; + background-color: #F3F9FE; background-image: url('../image/bk1.png'); background-size: 100% auto; background-repeat: no-repeat; @@ -241,6 +241,7 @@ padding: 30px; background-image: url('../image/pro_item1.png'); background-size: 100% 100%; + border-radius: 15px; overflow: hidden; &:nth-of-type(3n+1), @@ -250,10 +251,16 @@ &:nth-of-type(3n+2) { background-image: url('../image/pro_item2.png'); + &:hover .project_list_top_item_title{ + color: #2149d4; + } } &:nth-of-type(3n+3) { background-image: url('../image/pro_item3.png'); + &:hover .project_list_top_item_title{ + color: #2149d4; + } } .proListTopics { @@ -273,6 +280,11 @@ height: 0.8em; background-color: #d8d8d8; } + &:hover{ + transition: background-size 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); + background-position: center; + background-size: 105% 105%; + } } }