diff --git a/src/forge/Main/projecthome/v2/components/supplyChainGovernance.jsx b/src/forge/Main/projecthome/v2/components/supplyChainGovernance.jsx
index 12d17d787..9b877d364 100644
--- a/src/forge/Main/projecthome/v2/components/supplyChainGovernance.jsx
+++ b/src/forge/Main/projecthome/v2/components/supplyChainGovernance.jsx
@@ -10,7 +10,6 @@ const SupplyChainGovernance = () => {
id: 'security',
title: '供应链安全漏洞库',
subtitle: '汇聚漏洞信息,恶意代码信息,组件信息三类关键供应链安全信息要素',
- image: require('../image/supply-chain-security.png').default,
width: '40%',
tag: ["漏洞", "恶意代码", "组件"],
tagIcon: icon1
@@ -19,7 +18,7 @@ const SupplyChainGovernance = () => {
id: 'software',
title: '软件供应链治理',
subtitle: '实施软供链成分与安全分析,形成清单并定位漏洞',
- image: require('../image/software-supply-chain.png').default,
+ image: require('../image/gif2.gif').default,
width: '28.5%',
tag: ["成分分析", "安全性分析", "软件治理"],
tagIcon: icon2
@@ -28,7 +27,7 @@ const SupplyChainGovernance = () => {
id: 'risk',
title: '实时风险预警',
subtitle: '据新漏洞评估波及范围,并示警软件供应链',
- image: require('../image/risk-warning.png').default,
+ image: require('../image/gif4.gif').default,
width: '28.5%',
tag: ["风险预警", "影响范围", "实时监测"],
tagIcon: icon1
@@ -37,6 +36,7 @@ const SupplyChainGovernance = () => {
id: 'vulnerability',
title: '已知漏洞监测',
subtitle: '提供供应链已知漏洞检测、恶意代码检测、\n克隆漏洞检测、二进制漏洞检测等多种安\n全性分析能力',
+ image: require('../image/gif3.gif').default,
width: '48%',
tag: ["恶意代码检测", "二进制漏洞检测", "克隆漏洞检测"],
tagIcon: icon3
@@ -45,6 +45,7 @@ const SupplyChainGovernance = () => {
id: 'assessment',
title: '软件治理能力评估',
subtitle: '数据构建、多维分析、量化打分、结果融合\n的软件治理能力评估体系',
+ image: require('../image/gif.webp').default,
width: '',
tag: ["软件治理", "能力评估", "多维分析"],
tagIcon: icon3
@@ -73,9 +74,7 @@ const SupplyChainGovernance = () => {
{item.title}
{item.subtitle}
{/* 图片 */}
- {/* {item.image &&
-

-
} */}
+ {item.image &&
}
))}
diff --git a/src/forge/Main/projecthome/v2/image/gif2.gif b/src/forge/Main/projecthome/v2/image/gif2.gif
new file mode 100644
index 000000000..30681c58d
Binary files /dev/null and b/src/forge/Main/projecthome/v2/image/gif2.gif differ
diff --git a/src/forge/Main/projecthome/v2/image/gif3.gif b/src/forge/Main/projecthome/v2/image/gif3.gif
new file mode 100644
index 000000000..bee50bd92
Binary files /dev/null and b/src/forge/Main/projecthome/v2/image/gif3.gif differ
diff --git a/src/forge/Main/projecthome/v2/image/gif4.gif b/src/forge/Main/projecthome/v2/image/gif4.gif
new file mode 100644
index 000000000..72784d866
Binary files /dev/null and b/src/forge/Main/projecthome/v2/image/gif4.gif differ
diff --git a/src/forge/Main/projecthome/v2/image/software-assessment.png b/src/forge/Main/projecthome/v2/image/software-assessment.png
index b4775a42b..5e1f3d112 100644
Binary files a/src/forge/Main/projecthome/v2/image/software-assessment.png and b/src/forge/Main/projecthome/v2/image/software-assessment.png differ
diff --git a/src/forge/Main/projecthome/v2/image/software-supply-chain.png b/src/forge/Main/projecthome/v2/image/software-supply-chain.png
index 9a8ba089b..a4da7159c 100644
Binary files a/src/forge/Main/projecthome/v2/image/software-supply-chain.png and b/src/forge/Main/projecthome/v2/image/software-supply-chain.png differ
diff --git a/src/forge/Main/projecthome/v2/image/vulnerability-detection.png b/src/forge/Main/projecthome/v2/image/vulnerability-detection.png
index 4a46ad105..bd747fc5a 100644
Binary files a/src/forge/Main/projecthome/v2/image/vulnerability-detection.png and b/src/forge/Main/projecthome/v2/image/vulnerability-detection.png differ
diff --git a/src/forge/Main/projecthome/v2/index.scss b/src/forge/Main/projecthome/v2/index.scss
index 76bbd81c1..1186f6617 100644
--- a/src/forge/Main/projecthome/v2/index.scss
+++ b/src/forge/Main/projecthome/v2/index.scss
@@ -586,36 +586,38 @@
}
}
- .image-container {
- width: 100%;
-
- .item-image {
- max-width: 100%;
- }
- }
-
&.governance-item0 {
height:478px;
background-image: url('./image/supply-chain-security.png');
background-size: 100% 100%;
- .image-container {
- position: relative;
- top: -157px;
- }
}
&.governance-item1 {
background-image: url('./image/software-supply-chain.png');
background-size: 100% 100%;
+ position: relative;
.tag-text {
color:#417aff;
background-color:#edf2ff;
}
+ .item-gif{
+ width: 55px;
+ position: absolute;
+ bottom: 47px;
+ right: 66px;
+ }
}
&.governance-item2 {
background-image: url('./image/risk-warning.png');
background-size: 100% 100%;
+ position: relative;
+ .item-gif{
+ width: 22px;
+ position: absolute;
+ bottom: 144px;
+ left: 175px;
+ }
}
&.governance-item3 {
@@ -625,6 +627,7 @@
background-size: auto 100%;
background-position: right;
background-repeat: no-repeat;
+ position: relative;
.tag-text {
color:#8d56da;
background-color:#f8f3ff;
@@ -633,6 +636,12 @@
padding-top: 20px;
padding-bottom: 10px;
}
+ .item-gif{
+ width: 60px;
+ position: absolute;
+ bottom: 63px;
+ right: 95px;
+ }
}
&.governance-item4 {
@@ -644,6 +653,7 @@
background-size: auto 100%;
background-position: right;
background-repeat: no-repeat;
+ position: relative;
.tag-text {
color:#8d56da;
background-color:#f8f3ff;
@@ -660,6 +670,13 @@
div {
// color: white;
}
+ .item-gif{
+ width: 200px;
+ position: absolute;
+ bottom: -60px;
+ right: -25px;
+ transform: scaleX(-1);
+ }
}
}
}