模板:Character section/styles.css
来自星砂岛百科
更多操作
.char-section {
margin: var(--space-sm, 8px) 0 var(--space-lg, 18px);
color: var(--color-base, #202122);
font-family: var(--font-family-base);
}
.char-section > h2:first-child {
margin-bottom: var(--space-sm, 10px);
}
.char-tabber {
margin: var(--space-sm, 8px) 0 var(--space-md, 12px);
}
.char-tabber .tabber__header,
.char-tabber .tabbernav {
margin-bottom: var(--space-sm, 10px);
}
.char-empty {
margin: var(--space-sm, 10px) 0;
padding: var(--space-sm, 10px) var(--space-md, 12px);
border: 1px dashed var(--border-color-base, #a2a9b1);
border-radius: var(--border-radius-base, 8px);
background: var(--color-surface-1, #f8f9fa);
color: var(--color-subtle, #54595d);
text-align: center;
line-height: 1.6;
font-size: var(--font-size-small, 0.875rem);
}
.char-note {
margin: var(--space-sm, 10px) 0 var(--space-md, 12px);
padding: var(--space-sm, 10px) var(--space-md, 12px);
border-inline-start: 3px solid var(--border-color-interactive, #36c);
border-radius: var(--border-radius-base, 8px);
background: var(--color-surface-1, #f8f9fa);
color: var(--color-base, #202122);
line-height: 1.6;
font-size: var(--font-size-small, 0.875rem);
}
.char-card,
.char-news-panel {
margin: var(--space-sm, 10px) 0;
padding: var(--space-md, 12px);
border: 1px solid var(--border-color-base, #c8ccd1);
border-radius: var(--border-radius-medium, 12px);
background: var(--color-surface-0, #fff);
}
.char-card-title,
.char-chat-prompt,
.char-chat-subgroup,
.char-gift-subtitle,
.char-schedule-heading,
.char-news-label {
color: var(--color-emphasized, #101418);
font-size: var(--font-size-small, 0.875rem);
font-weight: var(--font-weight-semi-bold, 600);
line-height: 1.5;
}
.char-card-title {
margin-bottom: var(--space-sm, 10px);
}
.char-chat-prompt {
margin-bottom: var(--space-sm, 10px);
}
.char-chat-card + .char-chat-card,
.char-chat-group + .char-chat-group,
.char-chat-weekday + .char-chat-weekday,
.char-gift-block + .char-gift-block,
.char-schedule-group + .char-schedule-group {
margin-top: var(--space-md, 14px);
}
.char-chat-reply + .char-chat-reply,
.char-gift-subblock + .char-gift-subblock {
margin-top: var(--space-sm, 10px);
}
.char-chat-subgroup {
margin: var(--space-sm, 10px) 0 var(--space-2xs, 6px);
}
.char-gift-items,
.char-gift-lines {
margin-top: var(--space-2xs, 6px);
}
.char-table-wrap {
margin: var(--space-sm, 10px) 0;
overflow-x: auto;
}
.char-table-wrap table,
.char-table-wrap .wikitable {
width: 100%;
margin: 0;
}
.char-data-table {
background: var(--color-surface-0, #fff);
font-size: var(--font-size-small, 0.875rem);
}
.char-data-table th,
.char-data-table td {
vertical-align: top;
line-height: 1.6;
}
.char-news-panel {
background: linear-gradient(
180deg,
var(--color-surface-0, #fff) 0%,
var(--color-surface-1, #f8f9fa) 100%
);
}
.char-news-identity {
display: grid;
gap: var(--space-xs, 8px);
}
.char-news-headline {
display: grid;
gap: var(--space-2xs, 4px);
}
.char-news-name {
color: var(--color-emphasized, #101418);
font-size: 1.1rem;
font-weight: 700;
line-height: 1.4;
}
.char-news-signature {
padding: var(--space-xs, 8px) var(--space-sm, 10px);
border-radius: var(--border-radius-base, 8px);
background: var(--color-surface-0, #fff);
color: var(--color-subtle, #54595d);
line-height: 1.7;
}
.char-news-metrics {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: var(--space-sm, 10px);
margin: var(--space-md, 12px) 0;
}
.char-news-metric {
padding: var(--space-sm, 10px) var(--space-md, 12px);
border: 1px solid var(--border-color-base, #c8ccd1);
border-radius: var(--border-radius-base, 8px);
background: var(--color-surface-0, #fff);
}
.char-news-metric-label {
color: var(--color-subtle, #54595d);
font-size: var(--font-size-small, 0.875rem);
}
.char-news-metric-value {
margin-top: var(--space-2xs, 4px);
color: var(--color-emphasized, #101418);
font-size: 1.05rem;
font-weight: 700;
}
.char-news-samples {
margin-top: var(--space-md, 12px);
padding-top: var(--space-sm, 10px);
border-top: 1px solid var(--border-color-base, #c8ccd1);
}
.char-news-list {
margin: var(--space-xs, 8px) 0 0 1.4em;
}
.char-news-list li + li {
margin-top: var(--space-2xs, 6px);
}
.char-schedule-heading {
margin: 0 0 var(--space-2xs, 6px);
}
.char-schedule-heading b {
font-weight: inherit;
}
@media (max-width: 720px) {
.char-card,
.char-news-panel {
padding: var(--space-sm, 10px);
}
.char-news-metrics {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
/* [[分类:模板样式]] */