修改弃暗投明对话框的颜色
广告
{{v.name}}
📋 原始需求(task.md):
修改弃暗投明对话框的颜色为和弃暗投明按钮类似的绿色,而正常的裁员440人的对话框保持现在的红色
修改弃暗投明对话框的颜色为和弃暗投明按钮类似的绿色,而正常的裁员440人的对话框保持现在的红色
弃暗投明是"从良"的好结局,沿用被查时的红色对话框在情绪上是错位的。需要让对话框配色跟随结局:弃暗投明用绿色,裁满 440 人保持红色。
问题分析
对话框的红色分散在三处:外边框 #7a3b2e、标题 #c0392b、按钮底色与按下阴影 #c0392b / #8e2a20。要换色必须覆盖这三者,且不能影响原结局。
解决方案
- 新增
.dialog-quit修饰类:边框、标题、总用时统一改为#2f7d4d,按钮换成与"弃暗投明"按钮相同的绿色渐变#3f9d63 → #2f7d4d,按下阴影改为#215c38 - 对话框根节点绑定
:class="{ 'dialog-quit': isQuit }",isQuit由endType === 'quit'计算得出 - 只有弃暗投明结局才会加上修饰类,裁满 440 人仍走原有红色样式,两种结局互不干扰
验证
读取运行时计算样式:弃暗投明时对话框类名含 dialog-quit、边框与标题为 rgb(47,125,77)、按钮为绿色渐变;裁满 440 时为 rgb(122,59,46) / rgb(192,57,43),与改动前一致。