57 lines
1.4 KiB
HTML
57 lines
1.4 KiB
HTML
<!--
|
|
Layout: two-column
|
|
双栏页 — 对比/并列内容
|
|
Agent 填充左右两栏,可调整比例(默认 1:1)
|
|
-->
|
|
<section class="slide slide--two-column" data-slide="{{N}}">
|
|
<h2 class="twocol-title">{{页面标题}}</h2>
|
|
<div class="twocol-grid">
|
|
<div class="twocol-left">
|
|
<h3>{{左栏标题}}</h3>
|
|
<p>{{左栏内容}}</p>
|
|
</div>
|
|
<div class="twocol-right">
|
|
<h3>{{右栏标题}}</h3>
|
|
<p>{{右栏内容}}</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<style>
|
|
.slide--two-column {
|
|
display: grid;
|
|
grid-template-rows: auto 1fr;
|
|
align-items: start;
|
|
}
|
|
.slide--two-column .twocol-title {
|
|
font-size: var(--font-size-heading);
|
|
margin-bottom: var(--spacing-md);
|
|
}
|
|
.slide--two-column .twocol-grid {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
gap: var(--spacing-lg);
|
|
align-items: start;
|
|
align-self: center;
|
|
min-height: 0;
|
|
overflow: hidden;
|
|
}
|
|
.slide--two-column .twocol-left,
|
|
.slide--two-column .twocol-right {
|
|
padding: var(--spacing-md);
|
|
background: var(--color-surface);
|
|
border-radius: var(--border-radius);
|
|
box-shadow: var(--shadow-sm);
|
|
}
|
|
.slide--two-column .twocol-grid h3 {
|
|
font-size: var(--font-size-subheading);
|
|
margin-bottom: var(--spacing-sm);
|
|
color: var(--color-primary);
|
|
}
|
|
.slide--two-column .twocol-grid p {
|
|
font-size: var(--font-size-body);
|
|
color: var(--color-text-secondary);
|
|
line-height: 1.7;
|
|
}
|
|
</style>
|