Template:少女前线信息/styles.css:修订间差异
模板页面
更多操作
无编辑摘要 |
无编辑摘要 |
||
| 第3行: | 第3行: | ||
display: flex; | display: flex; | ||
flex-direction: column; | flex-direction: column; | ||
margin-left: auto; /* | margin-left: auto; /* 靠右对齐,同时解决编辑页空白 Bug */ | ||
margin-bottom: 1em; | margin-bottom: 1em; | ||
width: 280px; | width: 280px; | ||
padding: 1px 4px; | |||
background-color: # | /* 还原 Citizen 动态颜色:自动适配深色/浅色模式 */ | ||
border: 1px solid var(--border-color-base, #e0e0e0) !important; | |||
background-color: var(--background-color-base, #ffffff) !important; | |||
color: inherit; | color: inherit; | ||
font-size: 90%; | font-size: 90% !important; | ||
box-sizing: border-box; | box-sizing: border-box; | ||
} | } | ||
/* ===== | /* ===== 各部分标题还原 ===== */ | ||
.gf-infobox .gf-title { | .gf-infobox .gf-title { | ||
margin: 3px 0; | margin: 3px 0; | ||
| 第21行: | 第24行: | ||
font-weight: bold; | font-weight: bold; | ||
text-align: center; | text-align: center; | ||
border-bottom: 1px solid #e0e0e0; | border-bottom: 1px solid var(--border-color-base, #e0e0e0); | ||
} | } | ||
| 第29行: | 第32行: | ||
text-align: center; | text-align: center; | ||
font-weight: bold; | font-weight: bold; | ||
border-bottom: 1px solid #e0e0e0; | border-bottom: 1px solid var(--border-color-base, #e0e0e0); | ||
/* 稍微加一点背景区分分区 */ | |||
background-color: var(--background-color-neutral, rgba(0,0,0,0.05)); | |||
} | } | ||
| 第37行: | 第42行: | ||
text-align: center; | text-align: center; | ||
padding: 0; | padding: 0; | ||
border-bottom: 1px solid #e0e0e0; | border-bottom: 1px solid var(--border-color-base, #e0e0e0); | ||
} | } | ||
| 第45行: | 第50行: | ||
} | } | ||
/* ===== | /* ===== 双栏行容器 (Flex 布局版) ===== */ | ||
.gf-infobox .gf-row { | .gf-infobox .gf-row { | ||
display: flex; | display: flex; | ||
margin: 3px 0; | margin: 3px 0; | ||
border-bottom: 1px solid #f0f0f0; | border-bottom: 1px solid var(--border-color-base, #f0f0f0); | ||
} | } | ||
/* ===== 标签栏(左侧) ===== */ | |||
.gf-infobox .gf-label { | .gf-infobox .gf-label { | ||
display: flex; | display: flex; | ||
justify-content: center; | justify-content: center; | ||
align-items: center; | align-items: center; | ||
flex: 0 0 5em; | flex: 0 0 5em; | ||
padding: 2px 5px; | padding: 2px 5px; | ||
font-weight: bold; | font-weight: bold; | ||
text-align: center; | text-align: center; | ||
border-right: 1px solid #e0e0e0; | border-right: 1px solid var(--border-color-base, #e0e0e0); | ||
/* 这里的背景也可以用变量 */ | |||
background-color: var(--background-color-neutral, rgba(0,0,0,0.03)); | |||
} | } | ||
/* ===== 内容栏(右侧) ===== */ | |||
.gf-infobox .gf-value { | .gf-infobox .gf-value { | ||
padding: 2px 2px 2px 7px; | padding: 2px 2px 2px 7px; | ||
2026年5月8日 (五) 22:39的版本
/* ===== 基础容器 ===== */
.gf-infobox {
display: flex;
flex-direction: column;
margin-left: auto; /* 靠右对齐,同时解决编辑页空白 Bug */
margin-bottom: 1em;
width: 280px;
padding: 1px 4px;
/* 还原 Citizen 动态颜色:自动适配深色/浅色模式 */
border: 1px solid var(--border-color-base, #e0e0e0) !important;
background-color: var(--background-color-base, #ffffff) !important;
color: inherit;
font-size: 90% !important;
box-sizing: border-box;
}
/* ===== 各部分标题还原 ===== */
.gf-infobox .gf-title {
margin: 3px 0;
padding: 0.5em;
font-size: 120%;
font-weight: bold;
text-align: center;
border-bottom: 1px solid var(--border-color-base, #e0e0e0);
}
.gf-infobox .gf-section {
margin: 3px 0;
padding: 0.3em 0.5em;
text-align: center;
font-weight: bold;
border-bottom: 1px solid var(--border-color-base, #e0e0e0);
/* 稍微加一点背景区分分区 */
background-color: var(--background-color-neutral, rgba(0,0,0,0.05));
}
/* ===== 图片容器 ===== */
.gf-infobox .gf-image-container {
margin: 3px 0;
text-align: center;
padding: 0;
border-bottom: 1px solid var(--border-color-base, #e0e0e0);
}
.gf-infobox .infobox-image {
max-width: 100%;
height: auto;
}
/* ===== 双栏行容器 (Flex 布局版) ===== */
.gf-infobox .gf-row {
display: flex;
margin: 3px 0;
border-bottom: 1px solid var(--border-color-base, #f0f0f0);
}
/* ===== 标签栏(左侧) ===== */
.gf-infobox .gf-label {
display: flex;
justify-content: center;
align-items: center;
flex: 0 0 5em;
padding: 2px 5px;
font-weight: bold;
text-align: center;
border-right: 1px solid var(--border-color-base, #e0e0e0);
/* 这里的背景也可以用变量 */
background-color: var(--background-color-neutral, rgba(0,0,0,0.03));
}
/* ===== 内容栏(右侧) ===== */
.gf-infobox .gf-value {
padding: 2px 2px 2px 7px;
flex: 1;
}
.gf-infobox .gf-related {
padding: 2px 5px;
}