Template:少女前线/styles.css:修订间差异
模板页面
更多操作
创建页面,内容为“.gfl-nav { border: 1px solid #aaa; background: #f9f9f9; padding: 10px; font-size: 14px; margin-bottom: 1em; } .gfl-header { display: flex; justify-content: space-between; align-items: center; border-bottom: 2px solid #333; padding-bottom: 5px; margin-bottom: 10px; } .gfl-menu { display: flex; flex-wrap: wrap; gap: 5px; } .gfl-item { position: relative; flex: 1; min-width: 100px; } .gfl-title {…” |
无编辑摘要 |
||
| 第1行: | 第1行: | ||
.gfl-nav { | .gfl-nav { | ||
border: 1px solid #aaa; | border: 1px solid var(--border-color-base, #aaa); | ||
background: | background-color: var(--background-color-neutral-subtle, rgba(128, 128, 128, 0.1)); | ||
backdrop-filter: blur(4px); | |||
padding: 10px; | padding: 10px; | ||
font-size: 14px; | font-size: 14px; | ||
margin-bottom: 1em; | margin-bottom: 1em; | ||
color: var(--color-base, inherit); | |||
} | } | ||
.gfl-header { | .gfl-header { | ||
| 第10行: | 第12行: | ||
justify-content: space-between; | justify-content: space-between; | ||
align-items: center; | align-items: center; | ||
border-bottom: 2px solid #333; | border-bottom: 2px solid var(--border-color-interactive, #333); | ||
padding-bottom: 5px; | padding-bottom: 5px; | ||
margin-bottom: 10px; | margin-bottom: 10px; | ||
| 第27行: | 第29行: | ||
display: block; | display: block; | ||
padding: 8px; | padding: 8px; | ||
background: #eee; | background-color: var(--background-color-interactive-subtle, #eee); | ||
font-weight: bold; | font-weight: bold; | ||
text-align: center; | text-align: center; | ||
cursor: pointer; | cursor: pointer; | ||
border: 1px solid #ccc; | border: 1px solid var(--border-color-base, #ccc); | ||
color: var(--color-base, inherit); | |||
} | } | ||
.gfl-content { | .gfl-content { | ||
| 第40行: | 第43行: | ||
z-index: 100; | z-index: 100; | ||
min-width: 200px; | min-width: 200px; | ||
background: | background-color: var(--background-color-base, #fff); | ||
border: 1px solid #aaa; | color: var(--color-base, #202122); | ||
box-shadow: 0 2px 5px rgba(0,0,0,0. | border: 1px solid var(--border-color-base, #aaa); | ||
box-shadow: 0 2px 5px rgba(0,0,0,0.3); | |||
padding: 10px; | padding: 10px; | ||
} | } | ||
| 第49行: | 第53行: | ||
} | } | ||
.gfl-item:hover .gfl-title { | .gfl-item:hover .gfl-title { | ||
background: #333; | background-color: var(--background-color-primary, #333); | ||
color: | color: var(--color-inverted, #fff); | ||
} | } | ||
.gfl-content ul { | .gfl-content ul { | ||
2026年5月6日 (三) 23:29的版本
.gfl-nav {
border: 1px solid var(--border-color-base, #aaa);
background-color: var(--background-color-neutral-subtle, rgba(128, 128, 128, 0.1));
backdrop-filter: blur(4px);
padding: 10px;
font-size: 14px;
margin-bottom: 1em;
color: var(--color-base, inherit);
}
.gfl-header {
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 2px solid var(--border-color-interactive, #333);
padding-bottom: 5px;
margin-bottom: 10px;
}
.gfl-menu {
display: flex;
flex-wrap: wrap;
gap: 5px;
}
.gfl-item {
position: relative;
flex: 1;
min-width: 100px;
}
.gfl-title {
display: block;
padding: 8px;
background-color: var(--background-color-interactive-subtle, #eee);
font-weight: bold;
text-align: center;
cursor: pointer;
border: 1px solid var(--border-color-base, #ccc);
color: var(--color-base, inherit);
}
.gfl-content {
display: none;
position: absolute;
top: 100%;
left: 0;
z-index: 100;
min-width: 200px;
background-color: var(--background-color-base, #fff);
color: var(--color-base, #202122);
border: 1px solid var(--border-color-base, #aaa);
box-shadow: 0 2px 5px rgba(0,0,0,0.3);
padding: 10px;
}
.gfl-item:hover .gfl-content {
display: block;
}
.gfl-item:hover .gfl-title {
background-color: var(--background-color-primary, #333);
color: var(--color-inverted, #fff);
}
.gfl-content ul {
list-style: none;
margin: 0;
padding: 0;
}