No edit summary |
No edit summary |
||
| Line 64: | Line 64: | ||
/* ========================================================== | /* ========================================================== | ||
Social Card Icons | Social Card Icons (BIGGER) | ||
========================================================== */ | ========================================================== */ | ||
.hf-social-card-icon img { | .hf-social-card-icon img { | ||
width: 40px | width: 56px; /* was 40px */ | ||
height: 40px | height: 56px; /* was 40px */ | ||
object-fit: contain; | object-fit: contain; | ||
display: block; | display: block; | ||
| Line 76: | Line 76: | ||
/* ========================================================== | /* ========================================================== | ||
HOLDFAST SIDEBAR LOGO (LARGER + CLEAN) | |||
========================================================== */ | ========================================================== */ | ||
body.skin-holdfast .hf-sidebar-logo { | body.skin-holdfast .hf-sidebar-logo { | ||
position: absolute; | |||
top: -10px; | |||
left: 20px; | |||
display: flex; | display: flex; | ||
align-items: center; | align-items: center; | ||
justify-content: center; | justify-content: center; | ||
max-width: | width: auto !important; | ||
max-height: | height: auto !important; | ||
max-width: 340px; /* increased size */ | |||
max-height: 200px; /* increased size */ | |||
z-index: 1002; | |||
box-shadow: 0 4px 24px 10px #00000040; | |||
} | } | ||
| Line 93: | Line 104: | ||
max-width: 100%; | max-width: 100%; | ||
max-height: | max-height: 200px; | ||
object-fit: contain; | object-fit: contain; | ||
| Line 100: | Line 111: | ||
/* ========================================================== | /* ========================================================== | ||
DISCORD BUTTON (LARGER) | |||
========================================================== */ | |||
body.skin-holdfast .hf-discord-btn, | |||
body.skin-holdfast .hf-events-btn { | |||
font-size: 16px; /* increase text size */ | |||
padding: 10px 14px; /* bigger clickable area */ | |||
border-radius: 6px; | |||
} | |||
/* If buttons contain icons */ | |||
body.skin-holdfast .hf-discord-btn img, | |||
body.skin-holdfast .hf-events-btn img { | |||
width: 28px; | |||
height: 28px; | |||
object-fit: contain; | |||
} | |||
/* ========================================================== | |||
HOLDFAST BACKGROUND IMAGE (RESPONSIVE) | |||
========================================================== */ | ========================================================== */ | ||
| Line 107: | Line 137: | ||
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
background-size: contain !important; | background-size: contain !important; | ||
background-position: left top !important; | background-position: left top !important; | ||
-webkit-mask-size: contain !important; | -webkit-mask-size: contain !important; | ||
mask-size: contain !important; | mask-size: contain !important; | ||
width: min(100%, 1600px) !important; | width: min(100%, 1600px) !important; | ||
} | } | ||
Revision as of 19:50, 28 June 2026
/* CSS placed here will be applied to all skins */
/* ==========================================================
Holdfast - Upcoming Release Image
========================================================== */
body.skin-holdfast .hf-upcoming-release-image {
flex: 0 0 320px;
max-width: 320px;
overflow: hidden;
display: flex;
align-items: stretch;
}
body.skin-holdfast .hf-upcoming-release-image img {
width: 100% !important;
height: 100% !important;
object-fit: cover;
object-position: center;
display: block;
}
/* ==========================================================
TOC Hiding
========================================================== */
.toc,
#toc,
.toctoggle,
.mw-table-of-contents-container {
display: none !important;
}
/* ==========================================================
Task Table Styling
========================================================== */
.wn-task-table td {
vertical-align: top;
}
.wn-status {
padding: 4px 8px;
border-radius: 4px;
font-weight: bold;
display: inline-block;
}
/* Status colors */
.wn-task.wn-status-not-started .wn-status-cell {
color: #b00020;
font-weight: bold;
}
.wn-task.wn-status-in-progress .wn-status-cell {
color: #b26a00;
font-weight: bold;
}
.wn-task.wn-status-done .wn-status-cell {
color: #1b7f3a;
font-weight: bold;
}
/* ==========================================================
Social Card Icons (BIGGER)
========================================================== */
.hf-social-card-icon img {
width: 56px; /* was 40px */
height: 56px; /* was 40px */
object-fit: contain;
display: block;
margin: 0 auto;
}
/* ==========================================================
HOLDFAST SIDEBAR LOGO (LARGER + CLEAN)
========================================================== */
body.skin-holdfast .hf-sidebar-logo {
position: absolute;
top: -10px;
left: 20px;
display: flex;
align-items: center;
justify-content: center;
width: auto !important;
height: auto !important;
max-width: 340px; /* increased size */
max-height: 200px; /* increased size */
z-index: 1002;
box-shadow: 0 4px 24px 10px #00000040;
}
body.skin-holdfast .hf-sidebar-logo img {
width: auto !important;
height: auto !important;
max-width: 100%;
max-height: 200px;
object-fit: contain;
display: block;
}
/* ==========================================================
DISCORD BUTTON (LARGER)
========================================================== */
body.skin-holdfast .hf-discord-btn,
body.skin-holdfast .hf-events-btn {
font-size: 16px; /* increase text size */
padding: 10px 14px; /* bigger clickable area */
border-radius: 6px;
}
/* If buttons contain icons */
body.skin-holdfast .hf-discord-btn img,
body.skin-holdfast .hf-events-btn img {
width: 28px;
height: 28px;
object-fit: contain;
}
/* ==========================================================
HOLDFAST BACKGROUND IMAGE (RESPONSIVE)
========================================================== */
body.skin-holdfast .hf-page::before {
background-image: url(/images/holdfast-background-image.png);
background-repeat: no-repeat;
background-size: contain !important;
background-position: left top !important;
-webkit-mask-size: contain !important;
mask-size: contain !important;
width: min(100%, 1600px) !important;
}