Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* CSS placed here will be applied to all skins */
/* ===============================
Big Book of Gaming - Featured Wikis Grid
=============================== */
/* Grid layout: 2 per row desktop, 1 per row mobile */
.bbog-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 40px;
margin-top: 20px;
}
@media (max-width: 700px) {
.bbog-grid {
grid-template-columns: 1fr;
}
}
/* Card container: NO background/border/box.
IMPORTANT: do NOT reset children, so Citizen can style the "Enter Wiki" link */
.bbog-card {
text-align: center;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
border-radius: 0 !important;
}
/* Title */
.bbog-featured-title {
font-size: 1.1rem;
font-weight: 600;
margin: 0 0 14px 0;
}
/* Kill MediaWiki/Citizen file wrapper backgrounds just for the image area */
.bbog-featured-img figure,
.bbog-featured-img figure[typeof*="mw:File"],
.bbog-featured-img .mw-parser-output figure[typeof*="mw:File"],
.bbog-featured-img .thumb,
.bbog-featured-img .thumbinner,
.bbog-featured-img .mw-file-element,
.bbog-featured-img .mw-file-description,
.bbog-featured-img .mw-file-caption,
.bbog-featured-img a.image {
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
padding: 0 !important;
margin: 0 auto !important;
border-radius: 0 !important;
}
/* Image: responsive, rounded, subtle hover */
.bbog-featured-img img {
display: block !important;
width: 100% !important;
height: auto !important;
max-width: 560px !important;
margin: 0 auto !important;
border-radius: 14px !important;
transition: transform 0.15s ease;
}
.bbog-featured-img img:hover {
transform: scale(1.02);
}
/* Spacing above the Enter Wiki link.
Do NOT style the link itself so Citizen can keep its button look */
.bbog-featured-link {
margin-top: 14px;
}