MediaWiki:Common.css: Difference between revisions
MediaWiki interface page
More actions
No edit summary |
No edit summary |
||
| (7 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
.infobox- | /* Generic infobox styling */ | ||
float: right; | .infobox-item { | ||
float: right; /* ensures the box sits on the right */ | |||
clear: right; /* prevents stacking issues */ | |||
width: 260px; | width: 260px; | ||
border: 1px solid var(--border-color-base); | |||
background-color: var(--background-color-primary); | |||
padding: 10px; | padding: 10px; | ||
margin: 0 0 10px 20px; | margin: 0 0 10px 20px; /* space between content and infobox */ | ||
font-size: 14px; | font-size: 14px; | ||
box-shadow: 0 0 5px rgba(0,0,0,0.1); | box-shadow: 0 0 5px rgba(0,0,0,0.1); | ||
} | } | ||
.infobox-title { | .infobox-item .infobox-title { | ||
font-weight: bold; | font-weight: bold; | ||
font-size: 16px; | font-size: 16px; | ||
text-align: center; | text-align: center; | ||
margin-bottom: 8px; | margin-bottom: 8px; | ||
color: var(--color-base); | |||
} | } | ||
.infobox-image { | .infobox-item .infobox-image { | ||
text-align: center; | text-align: center; | ||
margin-bottom: 8px; | margin-bottom: 8px; | ||
} | } | ||
.infobox-data .infobox-row { | .infobox-item .infobox-data .infobox-row { | ||
display: flex; | display: flex; | ||
justify-content: space-between; | justify-content: space-between; | ||
padding: 6px 8px; | padding: 6px 8px; | ||
border-bottom: 1px solid | border-bottom: 1px solid var(--border-color-subtle); | ||
} | } | ||
.infobox-data .infobox-row:nth-child(odd) { | .infobox-item .infobox-data .infobox-row:nth-child(odd) { | ||
background-color: | background-color: var(--background-color-primary); | ||
} | } | ||
.infobox-data .infobox-row:nth-child(even) { | .infobox-item .infobox-data .infobox-row:nth-child(even) { | ||
background-color: | background-color: var(--background-color-secondary); | ||
} | } | ||
.infobox- | .infobox-item .label { | ||
font-weight: bold; | font-weight: bold; | ||
color: | color: var(--color-base); | ||
} | } | ||
.infobox- | .infobox-item .value { | ||
color: | color: var(--color-subtle); | ||
} | } | ||
/* NPC Generator Button */ | |||
.npc-generator button { | |||
background: linear-gradient(135deg, #6b8cff, #8a5cff); | |||
color: #ffffff; | |||
border: none; | |||
padding: 0.6em 1.4em; | |||
font-size: 1rem; | |||
font-weight: 600; | |||
border-radius: 8px; | |||
cursor: pointer; | |||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4); | |||
transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease; | |||
} | |||
. | .npc-generator button:hover { | ||
background-color: | transform: translateY(-1px); | ||
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.6); | |||
opacity: 0.95; | |||
} | |||
.npc-generator button:active { | |||
transform: translateY(0); | |||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); | |||
} | |||
#npc-output { | |||
background: var(--background-color-neutral, #f8f9fa); | |||
border-radius: 6px; | |||
} | |||
#n-Gods_\26_Deities .citizen-nav__icon { | |||
mask-image: url(/images/Gods.png); | |||
mask-repeat: no-repeat; | |||
mask-size: contain; | |||
background-color: currentColor; | |||
} | |||
#p-gods > h3 { | |||
display: none; | |||
} | |||
#p-gods { | |||
margin-top: 12px; | |||
} | } | ||
#p-gods .citizen-nav__item { | |||
font-weight: 600; | |||
} | } | ||
Latest revision as of 04:23, 17 February 2026
/* Generic infobox styling */
.infobox-item {
float: right; /* ensures the box sits on the right */
clear: right; /* prevents stacking issues */
width: 260px;
border: 1px solid var(--border-color-base);
background-color: var(--background-color-primary);
padding: 10px;
margin: 0 0 10px 20px; /* space between content and infobox */
font-size: 14px;
box-shadow: 0 0 5px rgba(0,0,0,0.1);
}
.infobox-item .infobox-title {
font-weight: bold;
font-size: 16px;
text-align: center;
margin-bottom: 8px;
color: var(--color-base);
}
.infobox-item .infobox-image {
text-align: center;
margin-bottom: 8px;
}
.infobox-item .infobox-data .infobox-row {
display: flex;
justify-content: space-between;
padding: 6px 8px;
border-bottom: 1px solid var(--border-color-subtle);
}
.infobox-item .infobox-data .infobox-row:nth-child(odd) {
background-color: var(--background-color-primary);
}
.infobox-item .infobox-data .infobox-row:nth-child(even) {
background-color: var(--background-color-secondary);
}
.infobox-item .label {
font-weight: bold;
color: var(--color-base);
}
.infobox-item .value {
color: var(--color-subtle);
}
/* NPC Generator Button */
.npc-generator button {
background: linear-gradient(135deg, #6b8cff, #8a5cff);
color: #ffffff;
border: none;
padding: 0.6em 1.4em;
font-size: 1rem;
font-weight: 600;
border-radius: 8px;
cursor: pointer;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
}
.npc-generator button:hover {
transform: translateY(-1px);
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.6);
opacity: 0.95;
}
.npc-generator button:active {
transform: translateY(0);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
}
#npc-output {
background: var(--background-color-neutral, #f8f9fa);
border-radius: 6px;
}
#n-Gods_\26_Deities .citizen-nav__icon {
mask-image: url(/images/Gods.png);
mask-repeat: no-repeat;
mask-size: contain;
background-color: currentColor;
}
#p-gods > h3 {
display: none;
}
#p-gods {
margin-top: 12px;
}
#p-gods .citizen-nav__item {
font-weight: 600;
}