🎨 style: 优化代码
This commit is contained in:
parent
bbc1aeee73
commit
3ce77614e0
|
@ -17,6 +17,7 @@
|
|||
z-index: 1003;
|
||||
overflow: auto;
|
||||
scrollbar-width: none;
|
||||
background-color: rgb(250, 67, 59);
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
display: none
|
||||
|
@ -28,12 +29,12 @@
|
|||
}
|
||||
|
||||
.box {
|
||||
padding: 15px 8px;
|
||||
padding: 15px 8px 20px;
|
||||
box-sizing: border-box;
|
||||
min-height: 667px;
|
||||
width: 100%;
|
||||
background: url('https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/redPacktes/common_img_main_1.png') no-repeat top center;
|
||||
background-size: cover;
|
||||
background-size: 100%;
|
||||
}
|
||||
|
||||
.effect_date {
|
||||
|
@ -133,17 +134,29 @@
|
|||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.instruction-box {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.instruction {
|
||||
width: 100%;
|
||||
background: url('http://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/redPacktes/common_img_bg.png') no-repeat top center;
|
||||
background-size: cover;
|
||||
height: 498px;
|
||||
background: url('https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/redPacktes/common_img_text.png') no-repeat top center;
|
||||
background-size: 100% 100%;
|
||||
font-size: 12px;
|
||||
color: #959595;
|
||||
padding: 30px 10px 10px;
|
||||
padding: 0 10px 10px;
|
||||
box-sizing: border-box;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
|
||||
.instruction-header {
|
||||
width: 100%;
|
||||
height: 43px;
|
||||
background: url('https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/redPacktes/common_img_header.png') no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
|
||||
.TextBlock {
|
||||
|
@ -169,10 +182,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.instruction-1 {
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
.center {
|
||||
text-align: center;
|
||||
}
|
||||
|
|
|
@ -93,36 +93,39 @@ export default ({ data }) => {
|
|||
alt=""
|
||||
/>
|
||||
</div>
|
||||
<div className="instruction">
|
||||
<div className="instruction-1">
|
||||
<p className="center">
|
||||
<img
|
||||
className="notice"
|
||||
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/redPacktes/common_title_notice.png"
|
||||
alt=""
|
||||
/>
|
||||
</p>
|
||||
<div className="instruction-box">
|
||||
<div className="instruction-header"></div>
|
||||
<div className="instruction">
|
||||
<div className="instruction-1">
|
||||
<p className="center">
|
||||
<img
|
||||
className="notice"
|
||||
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/redPacktes/common_title_notice.png"
|
||||
alt=""
|
||||
/>
|
||||
</p>
|
||||
|
||||
{data.instruction || [1, 2, 3].includes(data.receive_type) ? (
|
||||
<>
|
||||
{createElement()}
|
||||
<h3 className="instruction-text">使用规则</h3>
|
||||
<p
|
||||
className="scroll"
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: data.instruction
|
||||
}}
|
||||
></p>
|
||||
</>
|
||||
) : (
|
||||
<Placeholder.TextBlock
|
||||
className="TextBlock"
|
||||
animate
|
||||
widths={widths}
|
||||
rows={20}
|
||||
dashed={false}
|
||||
/>
|
||||
)}
|
||||
{data.instruction || [1, 2, 3].includes(data.receive_type) ? (
|
||||
<>
|
||||
{createElement()}
|
||||
<h3 className="instruction-text">使用规则</h3>
|
||||
<p
|
||||
className="scroll"
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: data.instruction
|
||||
}}
|
||||
></p>
|
||||
</>
|
||||
) : (
|
||||
<Placeholder.TextBlock
|
||||
className="TextBlock"
|
||||
animate
|
||||
widths={widths}
|
||||
rows={20}
|
||||
dashed={false}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue