ShadowsOverWestgate/sow-nodebb-theme
3
0
Fork 0
Code Issues 12 Pull Requests Actions Packages Projects Releases Activity

p1 polish pass

Browse Source 
1. Candy-bright category icon plates — the loudest spell-breaker. Untuned ACP category colors (default orange/red/green) came through nearly raw. The plates now get a translucent plum wash plus a stronger desaturation clamp, so any admin-picked color lands in the velvet register while keeping its per-category hue. This hardens production against future un-tuned categories too, without overriding the documented ACP-color mechanism.
2. Groups page showed the stock gray-triangle covers — the existing velvet override only matched .cover, but the groups list renders .list-cover. Extended the selector; group cards now wear the plum velvet material.
3. 404 page showed a beige dog icon — replaced (CSS mask, no template override) with the existing cowled.svg game icon in old gilt. The lost-page screen now reads as a hooded figure in Westgate rather than stock NodeBB.
4. Token drift — three literal copies of the etched-highlight color now use the existing --wg-etched-highlight token, and a dead transform entry was dropped from the category card transition.
This commit is contained in:
archvillainette
2026-07-11 15:53:40 +02:00
parent 71ecf96a3f
commit 044fc50095
2 changed files with 37 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
scss/westgate/_categories.scss
+18 -6
View File
@@ -20,8 +20,7 @@ li[component="categories/category"] {
transition:
background 0.18s ease,
border-color 0.18s ease,
box-shadow 0.18s ease,
transform 0.18s ease;
box-shadow 0.18s ease;
}
li[component="categories/category"].unread {
@@ -29,8 +28,15 @@ li[component="categories/category"].unread {
}
li[component="categories/category"] .icon {
border: 1px solid rgba(246, 223, 163, 0.34);
border: 1px solid var(--wg-etched-highlight);
border-radius: 6px !important;
// ACP colors arrive candy-bright; the plum wash and filter pull the
// plate into the velvet register while keeping the per-category hue
background-image: linear-gradient(
160deg,
rgba(42, 18, 34, 0.42),
rgba(9, 8, 11, 0.58)
);
box-shadow:
inset 0 1px 0 rgba(255, 242, 204, 0.28),
inset 0 0 0 1px rgba(18, 15, 22, 0.62),
@@ -38,7 +44,7 @@ li[component="categories/category"] .icon {
0 0 0 1px rgba(56, 48, 42, 0.9),
0 0 0 2px rgba(124, 105, 62, 0.24),
0 9px 18px rgba(0, 0, 0, 0.32);
filter: saturate(0.82) contrast(1.12);
filter: saturate(0.62) contrast(1.12);
text-shadow:
0 1px 0 rgba(0, 0, 0, 0.72),
0 -1px 0 rgba(255, 238, 190, 0.18),
@@ -46,7 +52,13 @@ li[component="categories/category"] .icon {
}
body.template-category .category-header .icon {
border: 1px solid rgba(246, 223, 163, 0.34);
border: 1px solid var(--wg-etched-highlight);
background-image: linear-gradient(
160deg,
rgba(42, 18, 34, 0.42),
rgba(9, 8, 11, 0.58)
);
filter: saturate(0.62) contrast(1.12);
box-shadow:
inset 0 1px 0 rgba(255, 242, 204, 0.28),
inset 0 0 0 1px rgba(18, 15, 22, 0.62),
@@ -272,7 +284,7 @@ ul.category-children {
rgba(30, 28, 34, 0.62) 46%,
rgba(36, 18, 29, 0.78)
);
border: 1px solid rgba(246, 223, 163, 0.3);
border: 1px solid var(--wg-etched-highlight);
border-radius: 4px !important;
box-shadow:
inset 0 1px 0 rgba(255, 240, 190, 0.28),
scss/westgate/_surfaces.scss
+19 -1
View File
@@ -224,8 +224,26 @@ li[component="category/topic"] .user-icon {
text-transform: none;
}
// 404: core ships a beige dog glyph; wear the cowl instead
.template-404 i.fa-dog {
display: inline-block;
width: 4.5rem;
height: 4.5rem;
background-color: var(--wg-gold-soft);
-webkit-mask: url("./plugins/nodebb-theme-westgate/game-icons/cowled.svg")
center / contain no-repeat;
mask: url("./plugins/nodebb-theme-westgate/game-icons/cowled.svg")
center / contain no-repeat;
&::before {
content: "";
}
}
// replace core's grey-triangle default cover with the velvet material
.cover[style*="cover-default.png"] {
// (.cover on profiles, .list-cover on the groups list)
.cover[style*="cover-default.png"],
.list-cover[style*="cover-default.png"] {
background-image:
radial-gradient(120% 90% at 18% 0%, rgba(58, 24, 48, 0.6), transparent 60%),
linear-gradient(100deg, #2a1222, #110f15 55%, #09080b) !important;