fix: 更新财经商贸页面的产品宣传海报设计数量
详细说明: - 将产品宣传海报设计数量从3套更新为2套,以反映最新的设计进度 - 更新相关文本内容以保持一致性 - 修改文件: web_frontend/exhibition-demo/src/data/terminalSimulations/finance.ts, web_frontend/web_result/order-classes/finance/index.html
This commit is contained in:
@@ -339,6 +339,17 @@ body.dark-theme .hero {
|
||||
background-attachment: fixed;
|
||||
}
|
||||
|
||||
/* Footer section - 专属背景 */
|
||||
.section-footer {
|
||||
background-image:
|
||||
linear-gradient(to bottom, rgba(240, 253, 244, 0.92) 0%, rgba(236, 253, 245, 0.95) 100%),
|
||||
url('https://images.unsplash.com/photo-1505751172876-fa1923c5c528?w=1920&q=80') !important;
|
||||
background-size: cover !important;
|
||||
background-position: center !important;
|
||||
background-attachment: fixed !important;
|
||||
padding: var(--spacing-3xl) 0 !important;
|
||||
}
|
||||
|
||||
/* 深色主题下的区块背景 - 每个区块使用对应图片 */
|
||||
body.dark-theme .section:nth-child(1) {
|
||||
background-image:
|
||||
@@ -395,6 +406,16 @@ body.dark-theme .section:nth-child(n+5):nth-child(even) {
|
||||
background-attachment: fixed;
|
||||
}
|
||||
|
||||
/* Footer section - 深色主题背景 */
|
||||
body.dark-theme .section-footer {
|
||||
background-image:
|
||||
linear-gradient(to bottom, rgba(6, 78, 59, 0.92) 0%, rgba(5, 150, 105, 0.90) 100%),
|
||||
url('https://images.unsplash.com/photo-1505751172876-fa1923c5c528?w=1920&q=80') !important;
|
||||
background-size: cover !important;
|
||||
background-position: center !important;
|
||||
background-attachment: fixed !important;
|
||||
}
|
||||
|
||||
/* 深色主题下的特定元素调整 */
|
||||
body.dark-theme .stat-item {
|
||||
background: rgba(16, 185, 129, 0.8);
|
||||
@@ -531,7 +552,7 @@ body.dark-theme tr:hover {
|
||||
}
|
||||
|
||||
.grid-3 {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
}
|
||||
|
||||
.grid-4 {
|
||||
@@ -605,7 +626,7 @@ body.dark-theme tr:hover {
|
||||
}
|
||||
|
||||
.image-container:hover img {
|
||||
transform: scale(1.03); /* 减小放大效果,避免内容看不清 */
|
||||
transform: scale(1.0); /* 取消放大效果 */
|
||||
filter: brightness(1.0); /* 轻微提亮 */
|
||||
}
|
||||
|
||||
@@ -1294,6 +1315,174 @@ body.dark-theme .floating-data-card {
|
||||
}
|
||||
}
|
||||
|
||||
/* ========== Section 2 Bento Grid不规则布局 ========== */
|
||||
.section-2-bento {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: var(--spacing-2xl);
|
||||
margin: var(--spacing-2xl) 0;
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
/* Bento项目尺寸控制 */
|
||||
.bento-item-large {
|
||||
grid-column: span 2; /* 跨2列 - 突出重要内容 */
|
||||
grid-row: span 1;
|
||||
}
|
||||
|
||||
.bento-item-medium {
|
||||
grid-column: span 1; /* 单列 - 次要内容 */
|
||||
grid-row: span 1;
|
||||
}
|
||||
|
||||
/* Bento卡片样式增强 */
|
||||
.section-2-bento .card {
|
||||
background: linear-gradient(135deg,
|
||||
rgba(16, 185, 129, 0.08) 0%,
|
||||
rgba(5, 150, 105, 0.05) 100%);
|
||||
backdrop-filter: blur(20px);
|
||||
-webkit-backdrop-filter: blur(20px);
|
||||
border: 2px solid var(--border-light);
|
||||
border-radius: var(--radius-2xl);
|
||||
padding: var(--spacing-2xl);
|
||||
transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
|
||||
box-shadow: var(--shadow-md);
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.section-2-bento .card:hover {
|
||||
transform: translateY(-12px) scale(1.02);
|
||||
box-shadow: 0 16px 40px rgba(16, 185, 129, 0.25),
|
||||
0 8px 20px rgba(0, 0, 0, 0.12);
|
||||
border-color: var(--primary-green);
|
||||
}
|
||||
|
||||
.section-2-bento .card::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: linear-gradient(135deg, transparent 0%, rgba(16, 185, 129, 0.08) 100%);
|
||||
opacity: 0;
|
||||
transition: opacity var(--transition-base);
|
||||
border-radius: var(--radius-2xl);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.section-2-bento .card:hover::before {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.section-2-bento .card-header {
|
||||
padding: 0 0 var(--spacing-lg) 0;
|
||||
background: transparent;
|
||||
border-bottom: 2px solid var(--border-light);
|
||||
margin-bottom: var(--spacing-lg);
|
||||
}
|
||||
|
||||
.section-2-bento .card-title {
|
||||
font-size: var(--text-2xl);
|
||||
font-weight: var(--font-bold);
|
||||
color: var(--primary-green);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--spacing-sm);
|
||||
}
|
||||
|
||||
.section-2-bento .card-title i {
|
||||
width: 28px !important;
|
||||
height: 28px !important;
|
||||
}
|
||||
|
||||
.section-2-bento .card-body {
|
||||
padding: 0;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.section-2-bento .feature-list {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.section-2-bento .feature-list li {
|
||||
padding: var(--spacing-md) 0;
|
||||
border-bottom: 1px solid var(--border-light);
|
||||
color: var(--text-gray);
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: var(--spacing-sm);
|
||||
font-size: var(--text-base);
|
||||
line-height: 1.8;
|
||||
transition: all var(--transition-fast);
|
||||
}
|
||||
|
||||
.section-2-bento .feature-list li:hover {
|
||||
color: var(--primary-green);
|
||||
padding-left: var(--spacing-sm);
|
||||
background: rgba(16, 185, 129, 0.05);
|
||||
}
|
||||
|
||||
.section-2-bento .feature-list li:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.section-2-bento .feature-list li i {
|
||||
width: 20px !important;
|
||||
height: 20px !important;
|
||||
margin-top: 2px;
|
||||
flex-shrink: 0;
|
||||
color: var(--primary-green);
|
||||
}
|
||||
|
||||
/* 深色主题适配 */
|
||||
body.dark-theme .section-2-bento .card {
|
||||
background: linear-gradient(135deg,
|
||||
rgba(52, 211, 153, 0.15) 0%,
|
||||
rgba(16, 185, 129, 0.1) 100%);
|
||||
}
|
||||
|
||||
body.dark-theme .section-2-bento .card:hover {
|
||||
box-shadow: 0 16px 40px rgba(52, 211, 153, 0.3),
|
||||
0 8px 20px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
/* 响应式布局 */
|
||||
@media (max-width: 1024px) {
|
||||
.section-2-bento {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: var(--spacing-xl);
|
||||
}
|
||||
|
||||
.bento-item-large {
|
||||
grid-column: span 1; /* 平板设备等宽 */
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.section-2-bento {
|
||||
grid-template-columns: 1fr;
|
||||
gap: var(--spacing-lg);
|
||||
}
|
||||
|
||||
.section-2-bento .card {
|
||||
padding: var(--spacing-lg);
|
||||
}
|
||||
|
||||
.section-2-bento .card-title {
|
||||
font-size: var(--text-xl);
|
||||
}
|
||||
|
||||
.section-2-bento .feature-list li {
|
||||
font-size: var(--text-sm);
|
||||
padding: var(--spacing-sm) 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* ========== 图片加载状态 ========== */
|
||||
img {
|
||||
transition: opacity var(--transition-base);
|
||||
|
||||
Reference in New Issue
Block a user