优化UI81页面文本样式,增加行间距和列表格式,提升可读性

This commit is contained in:
yuchenglong
2025-12-03 18:14:35 +08:00
parent e3804268f5
commit 25b822260b
2 changed files with 42 additions and 18 deletions
+17 -8
View File
@@ -111,12 +111,10 @@
font-size: 28px; font-size: 28px;
font-family: NotoSansCJKsc-Medium; font-family: NotoSansCJKsc-Medium;
font-weight: 500; font-weight: 500;
text-align: center;
line-height: 26px;
margin: 0 0 53px 0;
text-align: left; text-align: left;
/* 增加行高,避免文字过于紧凑 */
line-height: 40px;
margin: 0 0 36px 0;
} }
.ui81-paragraph h4 { .ui81-paragraph h4 {
@@ -124,8 +122,8 @@
font-family: NotoSansCJKsc-Bold; font-family: NotoSansCJKsc-Bold;
font-weight: 700; font-weight: 700;
text-align: left; text-align: left;
line-height: 40px; line-height: 44px;
margin-bottom: 60px; margin-bottom: 24px;
} }
.ui81-paragraph p { .ui81-paragraph p {
@@ -133,6 +131,17 @@
font-family: NotoSansCJKsc-Medium; font-family: NotoSansCJKsc-Medium;
font-weight: 500; font-weight: 500;
text-align: left; text-align: left;
line-height: 60px; line-height: 44px;
margin-bottom: 20px; margin-bottom: 20px;
} }
/* 列表样式:增加行间距和项间距 */
.ui81-list {
padding-left: 28px;
margin: 0 0 36px 0;
}
.ui81-list li {
margin-bottom: 14px;
line-height: 40px;
font-size: 28px;
}
+24 -9
View File
@@ -24,17 +24,32 @@ const UI81: React.FC = () => {
<DecorLine /> <DecorLine />
<span className="ui81-paragraph"> <span className="ui81-paragraph">
<h4>尊敬的 {localStorage.getItem("name")} 先生/女士,体检过程中请您特别留意:</h4> <h4>
<p>1.请您先行检查空腹项目后再用餐(需空腹:腹部超声、静脉采血、上腹部CT/MR、幽门螺旋杆菌呼气检测等)。</p> 尊敬的 {localStorage.getItem("name")}
<p>2.怀备孕及哺乳期的妇女,请勿检查胸片,钼靶,CT,口腔全景片等放射科项目。</p> 先生/女士,体检过程中请您特别留意:
<p>3.有假乳(植入假体)或有乳房重塑手术病史的女性不建议行乳腺钼靶检查。</p> </h4>
<p>4.自愿放弃检查时,需您签字确认,明确理解弃检项目的意义,自愿承担因弃检导致筛查信息的不完整后果。</p> <ol className="ui81-list">
<p>5.所有延期项目请在一个月内完成,否则将按自动弃检处理。</p> <li>
<p>6.体检完成后请将该体检导引单交至B1楼前台的工作人员。</p> 请您先行完成需要空腹的项目后再用餐(需空腹:腹部超声、静脉采血、上腹部
<p>7.若您有长期服用任何药物、或体检过程中感到头晕、心慌等不适,请随时告知工作人员。</p> CT/MR、幽门螺旋杆菌呼气检测等)。
</li>
<li>
怀孕、备孕及哺乳期的妇女,请勿进行胸片、钼靶、CT、口腔全景片等放射科检查。
</li>
<li>
有假乳(植入假体)或有乳房重塑手术病史的女性,不建议行乳腺钼靶检查。
</li>
<li>
自愿放弃检查时,需您签字确认,明确理解弃检项目的意义,自愿承担因弃检导致筛查信息不完整的后果。
</li>
<li>所有延期项目请在一个月内完成,否则将按自动弃检处理。</li>
<li>体检完成后请将该体检导引单交至 B1 楼前台的工作人员。</li>
<li>
若您有长期服用任何药物,或体检过程中感到头晕、心慌等不适,请随时告知工作人员。
</li>
</ol>
</span> </span>
<div className="ui81-confirm-section"> <div className="ui81-confirm-section">
<ConfirmButton text="我知道了" onClick={handleConfirm} /> <ConfirmButton text="我知道了" onClick={handleConfirm} />
</div> </div>