add bg
This commit is contained in:
parent
73d18b8eea
commit
775fe04413
BIN
src/assets/ditu.png
Normal file
BIN
src/assets/ditu.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 2.7 MiB |
@ -18,6 +18,7 @@
|
|||||||
|
|
||||||
.CenterData {
|
.CenterData {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
background: #fff4;
|
||||||
width: 2472px;
|
width: 2472px;
|
||||||
height: 240px;
|
height: 240px;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
@ -25,6 +26,7 @@
|
|||||||
|
|
||||||
.V3DBG {
|
.V3DBG {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
background: #f004;
|
||||||
width: 2472px;
|
width: 2472px;
|
||||||
height: 640px;
|
height: 640px;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
@ -32,10 +34,11 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.V3DBorder {
|
.V3DBorder {
|
||||||
|
background: #00f3;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 486px;
|
height: 486px;
|
||||||
margin-top: 160px;
|
margin-top: 160px;
|
||||||
background: url('../assets/3D.png');
|
// background: url('../assets/3D.png');
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
}
|
}
|
||||||
@ -48,3 +51,16 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.bgDitu {
|
||||||
|
position: fixed;
|
||||||
|
z-index: -1000;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
/* background: #f003; */
|
||||||
|
background: url(../assets/ditu.png) no-repeat;
|
||||||
|
background-position: -800px 0;
|
||||||
|
background-size: 100%;
|
||||||
|
}
|
||||||
|
@ -36,6 +36,7 @@ export default function Home({ active }) {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="Main">
|
<div className="Main">
|
||||||
|
{active != '总览' && <div className="bgDitu"></div>}
|
||||||
<AnimatePresence mode="wait">
|
<AnimatePresence mode="wait">
|
||||||
<div
|
<div
|
||||||
className="left-side"
|
className="left-side"
|
||||||
|
@ -15,6 +15,7 @@ function EnergyAnalysis(props) {
|
|||||||
console.log('[rendering...] 加载 能耗分析页面');
|
console.log('[rendering...] 加载 能耗分析页面');
|
||||||
return (
|
return (
|
||||||
<div className={cls.grid}>
|
<div className={cls.grid}>
|
||||||
|
<div className={cls.bgDitu}></div>
|
||||||
<div className={cls.vgrid + ' col-1'}>
|
<div className={cls.vgrid + ' col-1'}>
|
||||||
<SmokeHandle />
|
<SmokeHandle />
|
||||||
<Oxygen />
|
<Oxygen />
|
||||||
|
@ -3,8 +3,22 @@
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
gap: 24px;
|
gap: 24px;
|
||||||
grid-template-columns: 900px 900px 16px 900px 900px;
|
grid-template-columns: 900px 900px 16px 900px 900px;
|
||||||
/* grid-template-rows: 128px 389px 389px; */
|
/* grid-template-rows: 128px 389px 389px; */
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
/* overflow: hidden; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.bgDitu {
|
||||||
|
position: fixed;
|
||||||
|
z-index: -1000;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
/* background: #f003; */
|
||||||
|
background: url(../../assets/ditu.png) no-repeat;
|
||||||
|
background-position: -800px 0;
|
||||||
|
background-size: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.vgrid {
|
.vgrid {
|
||||||
@ -38,9 +52,8 @@
|
|||||||
background: url(../../assets/line.png) 0 60% no-repeat;
|
background: url(../../assets/line.png) 0 60% no-repeat;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.oxygen {
|
||||||
.oxygen {}
|
}
|
||||||
|
|
||||||
.no {
|
.no {
|
||||||
|
}
|
||||||
}
|
|
||||||
|
Loading…
Reference in New Issue
Block a user