First Pass
This commit is contained in:
@@ -0,0 +1,86 @@
|
|||||||
|
# AGENTS.md
|
||||||
|
|
||||||
|
## Project
|
||||||
|
|
||||||
|
This repository is `nodebb-theme-westgate`, a NodeBB theme for the Shadows Over Westgate forum.
|
||||||
|
|
||||||
|
It is forked from `nodebb-theme-quickstart` and should remain a small, focused NodeBB child theme rather than a full replacement for NodeBB or Harmony.
|
||||||
|
|
||||||
|
## Local Environment
|
||||||
|
|
||||||
|
- Theme repo: `/home/vicky/Projects/nodebb-dev/nodebb-theme-westgate`
|
||||||
|
- Working NodeBB install: `/home/vicky/Projects/nodebb-dev/forum`
|
||||||
|
- Development workflow uses Grunt hot reload from the NodeBB install.
|
||||||
|
- This theme targets NodeBB 4.x compatibility, as declared in `package.json`.
|
||||||
|
|
||||||
|
## Theme Direction
|
||||||
|
|
||||||
|
The visual target is black velvet silk, darkness, vampirism, decadence, and decay.
|
||||||
|
|
||||||
|
Use this palette direction:
|
||||||
|
|
||||||
|
- Plum and near-black as the dominant base.
|
||||||
|
- Muted gold for accents, borders, small highlights, and important affordances.
|
||||||
|
- Red only sparingly, preferably as a subtle detail or state color.
|
||||||
|
- Avoid bright, playful, clinical, or flat SaaS-style treatment.
|
||||||
|
- Favor depth, restraint, texture, and rich contrast over loud ornament.
|
||||||
|
|
||||||
|
Reference prior theme work in this repo through files prefixed with `____`:
|
||||||
|
|
||||||
|
- `____live-copy.css`
|
||||||
|
- `____wikijs-live-copy.scss`
|
||||||
|
- `____bootstrap-overrides.scss`
|
||||||
|
|
||||||
|
`____live-copy.css` is the clearest reference for the intended slick gradient treatment. Use that direction for foreground elements such as panels, topic rows, buttons, borders, accents, and active states. Keep gradients rich and polished, but avoid turning the entire page into a decorative gradient background.
|
||||||
|
|
||||||
|
When adding new visuals, study the `____` reference files first and match the existing direction before introducing new motifs.
|
||||||
|
|
||||||
|
## NodeBB Theme Rules
|
||||||
|
|
||||||
|
Follow the current NodeBB theme model:
|
||||||
|
|
||||||
|
- `theme.json` defines theme metadata and the base theme.
|
||||||
|
- This project uses `baseTheme: "nodebb-theme-harmony"`.
|
||||||
|
- Keep this as a child theme unless the user explicitly asks for a larger rewrite.
|
||||||
|
- `theme.scss` is the theme entry point and must stay imports-only.
|
||||||
|
- Do not append substantive CSS/SCSS directly to `theme.scss`.
|
||||||
|
- Do not add new root-level theme styling files.
|
||||||
|
- Put substantive Westgate-specific style overrides under focused files in `scss/`.
|
||||||
|
- Keep `scss/overrides.scss` focused on Bootstrap/Harmony variable overrides that must load before Bootstrap.
|
||||||
|
- Template overrides belong under `templates/` and must preserve the same relative path as the Harmony template they replace.
|
||||||
|
- Do not copy or redefine Harmony templates unless an actual override is needed.
|
||||||
|
- If a template does not exist here, NodeBB inherits it from the configured base theme.
|
||||||
|
|
||||||
|
NodeBB theme documentation: https://docs.nodebb.org/development/themes/
|
||||||
|
|
||||||
|
## Current Files Of Interest
|
||||||
|
|
||||||
|
- `theme.json`: theme metadata and `baseTheme`.
|
||||||
|
- `plugin.json`: hooks, scripts, modules, template path, and static dirs.
|
||||||
|
- `theme.scss`: NodeBB SCSS entry point.
|
||||||
|
- `scss/overrides.scss`: current Westgate override layer.
|
||||||
|
- `lib/theme.js` and `lib/controllers.js`: server-side theme hooks/controllers.
|
||||||
|
- `public/client.js`: client-side theme behavior.
|
||||||
|
- `templates/`: local template overrides and admin templates.
|
||||||
|
|
||||||
|
## Working Practices
|
||||||
|
|
||||||
|
- Keep edits scoped to the theme package unless the task explicitly names the NodeBB install.
|
||||||
|
- Do not modify the working NodeBB install at `/home/vicky/Projects/nodebb-dev/forum` except for running build/dev commands or when explicitly asked.
|
||||||
|
- Prefer existing NodeBB, Harmony, Bootstrap, and local theme patterns over introducing new frameworks.
|
||||||
|
- Keep selectors maintainable and avoid broad global overrides unless they are intentional theme-wide tokens or resets.
|
||||||
|
- Avoid unrelated formatting churn.
|
||||||
|
- Before overriding a template, inspect the corresponding Harmony template and copy only what is necessary.
|
||||||
|
- Preserve accessibility: readable contrast, visible focus states, usable hover/active states, and no text hidden purely for visual effect unless there is an accessible alternative.
|
||||||
|
|
||||||
|
## Validation
|
||||||
|
|
||||||
|
Use the local NodeBB workflow when practical:
|
||||||
|
|
||||||
|
- From `/home/vicky/Projects/nodebb-dev/forum`, run the existing Grunt hot-reload task used by the project.
|
||||||
|
- Rebuild NodeBB assets when template or SCSS changes require it.
|
||||||
|
- For template overrides, verify that the rendered route uses the local template rather than falling back unexpectedly.
|
||||||
|
- For style work, check both desktop and mobile widths.
|
||||||
|
- Playwright browser validation is available in this environment after asset rebuilds; use it for rendered route checks and desktop/mobile screenshots against `http://localhost:4567`.
|
||||||
|
|
||||||
|
If validation cannot be run, report what was changed and what still needs to be checked in the running forum.
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 306 KiB |
+5
-1
@@ -29,7 +29,11 @@
|
|||||||
"git add"
|
"git add"
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
"dependencies": {},
|
"dependencies": {
|
||||||
|
"@fontsource/cinzel": "^5.2.8",
|
||||||
|
"@fontsource/ibm-plex-mono": "^5.2.7",
|
||||||
|
"@fontsource/jost": "^5.2.8"
|
||||||
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@commitlint/cli": "11.0.0",
|
"@commitlint/cli": "11.0.0",
|
||||||
"@commitlint/config-angular": "11.0.0",
|
"@commitlint/config-angular": "11.0.0",
|
||||||
|
|||||||
+3
-2
@@ -17,7 +17,8 @@
|
|||||||
"../client/account/theme.js": "../nodebb-theme-harmony/public/settings.js"
|
"../client/account/theme.js": "../nodebb-theme-harmony/public/settings.js"
|
||||||
},
|
},
|
||||||
"staticDirs": {
|
"staticDirs": {
|
||||||
"inter": "node_modules/@fontsource/inter/files",
|
"cinzel": "node_modules/@fontsource/cinzel/files",
|
||||||
"poppins": "node_modules/@fontsource/poppins/files"
|
"jost": "node_modules/@fontsource/jost/files",
|
||||||
|
"ibm-plex-mono": "node_modules/@fontsource/ibm-plex-mono/files"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
+63
-29
@@ -1,42 +1,75 @@
|
|||||||
// only overrides to bs5 variables here
|
// only overrides to bs5 variables here
|
||||||
|
|
||||||
|
$font-path: "./plugins/nodebb-theme-westgate";
|
||||||
|
|
||||||
|
$wg-ink: #0f0d12;
|
||||||
|
$wg-ink-2: #141119;
|
||||||
|
$wg-panel: #18141d;
|
||||||
|
$wg-panel-2: #110f15;
|
||||||
|
$wg-plum: #2a1222;
|
||||||
|
$wg-plum-soft: #3a1830;
|
||||||
|
$wg-gold: #c2a35a;
|
||||||
|
$wg-gold-soft: #a8893f;
|
||||||
|
$wg-text: #e6e0d6;
|
||||||
|
$wg-text-soft: #b9b2a6;
|
||||||
|
$wg-text-muted: #9a9086;
|
||||||
|
$wg-red: #8e3438;
|
||||||
|
|
||||||
// below are the default values from harmony theme overrides.scss file
|
// below are the default values from harmony theme overrides.scss file
|
||||||
// feel free to change these for your custom theme
|
// feel free to change these for your custom theme
|
||||||
|
|
||||||
// Harmony colours
|
// Harmony colours
|
||||||
$white: #fff !default;
|
$white: #f3ede4 !default;
|
||||||
$gray-100: #f8f9fa !default;
|
$gray-100: #e6e0d6 !default;
|
||||||
$gray-200: #e9ecef !default;
|
$gray-200: #cfc5b7 !default;
|
||||||
$gray-300: #dee2e6 !default;
|
$gray-300: #b9b2a6 !default;
|
||||||
$gray-400: #ced4da !default;
|
$gray-400: #9a9086 !default;
|
||||||
$gray-500: #adb5bd !default;
|
$gray-500: #7f756f !default;
|
||||||
$gray-600: #6c757d !default;
|
$gray-600: #625760 !default;
|
||||||
$gray-700: #495057 !default;
|
$gray-700: #3a323c !default;
|
||||||
$gray-800: #343a40 !default;
|
$gray-800: #241f28 !default;
|
||||||
$gray-900: #212529 !default;
|
$gray-900: #141119 !default;
|
||||||
$black: #000 !default;
|
$black: #09080b !default;
|
||||||
|
|
||||||
$blue: #0d6efd !default;
|
$blue: #8fb3c4 !default;
|
||||||
$red: #dc3545 !default;
|
$red: $wg-red !default;
|
||||||
$yellow: #ffc107 !default;
|
$yellow: $wg-gold !default;
|
||||||
$green: #198754 !default;
|
$green: #789365 !default;
|
||||||
$cyan: #0dcaf0 !default;
|
$cyan: #7cafc2 !default;
|
||||||
|
|
||||||
$primary: $blue !default;
|
$primary: $wg-gold !default;
|
||||||
$secondary: $gray-600 !default;
|
$secondary: $wg-text-muted !default;
|
||||||
$success: $green !default;
|
$success: $green !default;
|
||||||
$info: $cyan !default;
|
$info: $cyan !default;
|
||||||
$warning: $yellow !default;
|
$warning: $yellow !default;
|
||||||
$danger: $red !default;
|
$danger: $red !default;
|
||||||
$light: $gray-100 !default;
|
$light: $wg-text !default;
|
||||||
$dark: $gray-900 !default;
|
$dark: $wg-ink !default;
|
||||||
|
|
||||||
$body-color: $gray-800 !default;
|
$body-color: $wg-text-soft !default;
|
||||||
$body-bg: $white !default;
|
$body-bg: $wg-ink !default;
|
||||||
$body-tertiary-bg: $gray-200 !default;
|
$body-tertiary-bg: $wg-panel !default;
|
||||||
$text-muted: $gray-600 !default;
|
$text-muted: $wg-text-muted !default;
|
||||||
$border-color: $gray-200 !default;
|
$border-color: rgba($wg-gold, 0.14) !default;
|
||||||
$link-color: shade-color($blue, 20%) !default;
|
$link-color: $wg-gold !default;
|
||||||
|
$link-hover-color: lighten($wg-gold, 9%) !default;
|
||||||
|
|
||||||
|
$card-bg: $wg-panel !default;
|
||||||
|
$card-cap-bg: $wg-panel-2 !default;
|
||||||
|
$card-border-color: rgba($wg-gold, 0.12) !default;
|
||||||
|
$dropdown-bg: #18141d !default;
|
||||||
|
$dropdown-border-color: rgba($wg-gold, 0.16) !default;
|
||||||
|
$dropdown-link-color: $wg-text-soft !default;
|
||||||
|
$dropdown-link-hover-color: $wg-text !default;
|
||||||
|
$dropdown-link-hover-bg: rgba($wg-gold, 0.08) !default;
|
||||||
|
$input-bg: rgba($white, 0.025) !default;
|
||||||
|
$input-color: $wg-text !default;
|
||||||
|
$input-border-color: rgba($wg-gold, 0.18) !default;
|
||||||
|
$input-focus-border-color: rgba($wg-gold, 0.42) !default;
|
||||||
|
$input-placeholder-color: rgba($wg-text-soft, 0.62) !default;
|
||||||
|
$btn-border-radius: 6px !default;
|
||||||
|
$border-radius: 8px !default;
|
||||||
|
$border-radius-sm: 6px !default;
|
||||||
|
|
||||||
$btn-ghost-hover-color: mix($light, $dark, 90%);
|
$btn-ghost-hover-color: mix($light, $dark, 90%);
|
||||||
$btn-ghost-active-color: lighten($btn-ghost-hover-color, 5%);
|
$btn-ghost-active-color: lighten($btn-ghost-hover-color, 5%);
|
||||||
@@ -64,13 +97,14 @@ $link-decoration: none;
|
|||||||
$link-hover-decoration: underline;
|
$link-hover-decoration: underline;
|
||||||
|
|
||||||
// Custom fonts
|
// Custom fonts
|
||||||
$font-family-sans-serif: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
$font-family-sans-serif: "Jost", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
||||||
$font-family-secondary: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
|
$font-family-secondary: "Cinzel", Georgia, "Times New Roman", serif !default;
|
||||||
|
$font-family-monospace: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default;
|
||||||
$font-weight-semibold: 500 !default;
|
$font-weight-semibold: 500 !default;
|
||||||
$small-font-size: 0.875rem !default;
|
$small-font-size: 0.875rem !default;
|
||||||
|
|
||||||
$breadcrumb-divider: quote("→");
|
$breadcrumb-divider: quote("→");
|
||||||
$breadcrumb-divider-color: $gray-500 !default;
|
$breadcrumb-divider-color: $wg-gold-soft !default;
|
||||||
$breadcrumb-active-color: $body-color !default;
|
$breadcrumb-active-color: $body-color !default;
|
||||||
$breadcrumb-item-padding-x: 12px !default;
|
$breadcrumb-item-padding-x: 12px !default;
|
||||||
|
|
||||||
|
|||||||
@@ -0,0 +1,178 @@
|
|||||||
|
body.template-categories #content > .row,
|
||||||
|
.westgate-categories-page {
|
||||||
|
margin-top: 0.25rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.categories-list,
|
||||||
|
ul.westgate-categories-list {
|
||||||
|
position: relative;
|
||||||
|
display: grid;
|
||||||
|
gap: 0.75rem;
|
||||||
|
padding-left: 0.9rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.categories-list::before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: 1.1rem;
|
||||||
|
bottom: 1.1rem;
|
||||||
|
left: 0.45rem;
|
||||||
|
width: 1px;
|
||||||
|
background: linear-gradient(to bottom, rgba(194, 163, 90, 0.18), rgba(194, 163, 90, 0.04));
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="categories/category"] {
|
||||||
|
position: relative;
|
||||||
|
isolation: isolate;
|
||||||
|
margin: 0 !important;
|
||||||
|
padding: 1rem !important;
|
||||||
|
overflow: visible;
|
||||||
|
transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="categories/category"]::before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: 1.75rem;
|
||||||
|
left: -0.9rem;
|
||||||
|
width: 0.9rem;
|
||||||
|
height: 1px;
|
||||||
|
background: linear-gradient(to right, rgba(194, 163, 90, 0.2), rgba(194, 163, 90, 0.08));
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="categories/category"].unread {
|
||||||
|
border-color: rgba(194, 163, 90, 0.24) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="categories/category"] .icon {
|
||||||
|
border: 1px solid rgba(246, 223, 163, 0.24);
|
||||||
|
border-radius: 6px !important;
|
||||||
|
box-shadow:
|
||||||
|
inset 0 1px 0 var(--wg-etched-highlight),
|
||||||
|
inset 0 -2px 5px rgba(0, 0, 0, 0.38),
|
||||||
|
0 0 0 1px rgba(72, 48, 24, 0.42),
|
||||||
|
0 8px 18px rgba(0, 0, 0, 0.28);
|
||||||
|
filter: saturate(0.82) contrast(1.08);
|
||||||
|
text-shadow:
|
||||||
|
0 1px 0 rgba(0, 0, 0, 0.72),
|
||||||
|
0 -1px 0 rgba(255, 238, 190, 0.16);
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="categories/category"] h2.title {
|
||||||
|
position: relative;
|
||||||
|
padding-bottom: 0.18rem;
|
||||||
|
font-size: 1.24rem !important;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="categories/category"] h2.title a {
|
||||||
|
color: var(--wg-text) !important;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="categories/category"] h2.title::after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: -0.45rem;
|
||||||
|
height: 1px;
|
||||||
|
background: linear-gradient(to right, rgba(194, 163, 90, 0.13), rgba(194, 163, 90, 0.045) 58%, transparent 94%);
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="categories/category"] .description {
|
||||||
|
color: var(--wg-text-muted) !important;
|
||||||
|
line-height: 1.45;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.category-children {
|
||||||
|
margin-top: 0.55rem !important;
|
||||||
|
padding-top: 0.35rem;
|
||||||
|
border-top: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-children-item > div,
|
||||||
|
.westgate-category-child {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.35rem;
|
||||||
|
max-width: 100%;
|
||||||
|
padding: 0.2rem 0.55rem;
|
||||||
|
background: rgba(44, 22, 34, 0.3);
|
||||||
|
border: 1px solid rgba(194, 163, 90, 0.11);
|
||||||
|
border-radius: 999px;
|
||||||
|
transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.westgate-category-child .icon,
|
||||||
|
.westgate-child-icon,
|
||||||
|
.category-children-item i.fa-caret-right {
|
||||||
|
width: 18px !important;
|
||||||
|
height: 18px !important;
|
||||||
|
min-width: 18px;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
background: linear-gradient(145deg, rgba(96, 65, 32, 0.54), rgba(36, 18, 29, 0.78));
|
||||||
|
border: 1px solid rgba(246, 223, 163, 0.22);
|
||||||
|
border-radius: 4px !important;
|
||||||
|
box-shadow:
|
||||||
|
inset 0 1px 0 rgba(255, 240, 190, 0.26),
|
||||||
|
inset 0 -1px 3px rgba(0, 0, 0, 0.42),
|
||||||
|
0 0 0 1px rgba(27, 17, 18, 0.54);
|
||||||
|
filter: saturate(0.78) contrast(1.08);
|
||||||
|
font-size: 0.7rem !important;
|
||||||
|
line-height: 18px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-children-item i.fa-caret-right {
|
||||||
|
color: var(--wg-ledger-ink) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-children-item > div:hover,
|
||||||
|
.westgate-category-child:hover {
|
||||||
|
background: rgba(70, 30, 48, 0.4);
|
||||||
|
border-color: rgba(194, 163, 90, 0.24);
|
||||||
|
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-children-item a {
|
||||||
|
color: #d8c28a !important;
|
||||||
|
font-weight: 600;
|
||||||
|
text-decoration: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-children-item a:hover {
|
||||||
|
color: #e0c878 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="categories/category"] .meta.stats > div {
|
||||||
|
min-height: 3.55rem;
|
||||||
|
background: rgba(255, 255, 255, 0.018) !important;
|
||||||
|
border: 1px solid rgba(194, 163, 90, 0.09) !important;
|
||||||
|
border-radius: 3px !important;
|
||||||
|
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="categories/category"] .meta.stats .fs-5,
|
||||||
|
li[component="categories/category"] .meta.stats .ff-secondary {
|
||||||
|
color: var(--wg-text) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="categories/category"] .meta.stats .text-xs,
|
||||||
|
li[component="categories/category"] .meta.stats .text-muted,
|
||||||
|
li[component="categories/category"] .teaser,
|
||||||
|
li[component="categories/category"] .post-content {
|
||||||
|
color: var(--wg-text-muted) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="categories/category"] .lastpost {
|
||||||
|
border-left-color: rgba(194, 163, 90, 0.36) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="categories/category"] .teaser .avatar {
|
||||||
|
box-shadow: 0 0 0 1px rgba(194, 163, 90, 0.2);
|
||||||
|
}
|
||||||
@@ -0,0 +1,320 @@
|
|||||||
|
.btn-primary {
|
||||||
|
--bs-btn-bg: #5a4a1a;
|
||||||
|
--bs-btn-border-color: #a8893f;
|
||||||
|
--bs-btn-color: #f0e6d8;
|
||||||
|
--bs-btn-hover-bg: #6a5720;
|
||||||
|
--bs-btn-hover-border-color: #c2a35a;
|
||||||
|
--bs-btn-hover-color: #fff4dd;
|
||||||
|
--bs-btn-active-bg: #493914;
|
||||||
|
--bs-btn-active-border-color: #c2a35a;
|
||||||
|
background-image: linear-gradient(to bottom, #5a4a1a 0%, #473914 100%);
|
||||||
|
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 2px 8px rgba(0, 0, 0, 0.24);
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-primary:hover,
|
||||||
|
.btn-primary:focus {
|
||||||
|
background-image: linear-gradient(to bottom, #6a5720 0%, #53431a 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-secondary,
|
||||||
|
.btn-ghost,
|
||||||
|
.btn-outline-secondary {
|
||||||
|
--bs-btn-color: #d8cec0;
|
||||||
|
--bs-btn-bg: rgba(8, 7, 10, 0.12);
|
||||||
|
--bs-btn-border-color: rgba(216, 194, 138, 0.28);
|
||||||
|
--bs-btn-hover-color: var(--wg-text);
|
||||||
|
--bs-btn-hover-bg: rgba(194, 163, 90, 0.075);
|
||||||
|
--bs-btn-hover-border-color: rgba(216, 194, 138, 0.44);
|
||||||
|
--bs-btn-active-bg: rgba(194, 163, 90, 0.12);
|
||||||
|
--bs-btn-active-border-color: rgba(216, 194, 138, 0.5);
|
||||||
|
background-image: linear-gradient(to bottom, rgba(255, 244, 221, 0.018), rgba(0, 0, 0, 0.06));
|
||||||
|
box-shadow: inset 0 1px 0 rgba(255, 244, 221, 0.035);
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-footer .btn-secondary,
|
||||||
|
.bootbox .modal-footer .btn-secondary,
|
||||||
|
.modal-footer .btn[data-bs-dismiss="modal"],
|
||||||
|
.modal-footer .btn[data-dismiss="modal"] {
|
||||||
|
--bs-btn-color: #d8cec0;
|
||||||
|
--bs-btn-bg: rgba(8, 7, 10, 0.16);
|
||||||
|
--bs-btn-border-color: rgba(216, 194, 138, 0.34);
|
||||||
|
--bs-btn-hover-color: #fff4dd;
|
||||||
|
--bs-btn-hover-bg: rgba(194, 163, 90, 0.09);
|
||||||
|
--bs-btn-hover-border-color: rgba(216, 194, 138, 0.52);
|
||||||
|
--bs-btn-active-bg: rgba(194, 163, 90, 0.13);
|
||||||
|
background-image: linear-gradient(to bottom, rgba(255, 244, 221, 0.024), rgba(0, 0, 0, 0.08));
|
||||||
|
box-shadow:
|
||||||
|
inset 0 1px 0 rgba(255, 244, 221, 0.04),
|
||||||
|
0 2px 8px rgba(0, 0, 0, 0.22);
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-control,
|
||||||
|
.form-select,
|
||||||
|
.bootstrap-tagsinput,
|
||||||
|
.composer textarea,
|
||||||
|
.composer input,
|
||||||
|
.composer .write,
|
||||||
|
.composer .preview,
|
||||||
|
.composer .CodeMirror,
|
||||||
|
.composer .CodeMirror-scroll,
|
||||||
|
.quick-reply,
|
||||||
|
.quick-reply .card,
|
||||||
|
.quick-reply .card-body,
|
||||||
|
.quick-reply .quickreply-message,
|
||||||
|
[component="topic/quickreply/container"],
|
||||||
|
[component="topic/quickreply/container"] .card,
|
||||||
|
[component="topic/quickreply/container"] .card-body {
|
||||||
|
background-color: rgba(18, 15, 22, 0.96) !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.18) !important;
|
||||||
|
color: var(--wg-text) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-control:focus,
|
||||||
|
.form-select:focus,
|
||||||
|
.bootstrap-tagsinput:focus,
|
||||||
|
.composer textarea:focus,
|
||||||
|
.composer input:focus,
|
||||||
|
.composer .CodeMirror-focused {
|
||||||
|
background-color: rgba(255, 255, 255, 0.04) !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.42) !important;
|
||||||
|
box-shadow: 0 0 0 0.18rem rgba(194, 163, 90, 0.12) !important;
|
||||||
|
color: var(--wg-text) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-control::placeholder,
|
||||||
|
.bootstrap-tagsinput::placeholder,
|
||||||
|
.composer textarea::placeholder,
|
||||||
|
.quick-reply textarea::placeholder,
|
||||||
|
textarea[component="topic/quickreply/text"]::placeholder {
|
||||||
|
color: rgba(185, 178, 166, 0.62) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tool-modal {
|
||||||
|
background: transparent !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.16) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tool-modal .bootstrap-tagsinput {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.35rem;
|
||||||
|
min-height: 3rem;
|
||||||
|
padding: 0.45rem 0.55rem !important;
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, transparent calc(100% - 1px), rgba(194, 163, 90, 0.055) calc(100% - 1px)),
|
||||||
|
rgba(12, 10, 15, 0.92) !important;
|
||||||
|
background-size: 100% 1.65rem, auto;
|
||||||
|
border-color: rgba(194, 163, 90, 0.28) !important;
|
||||||
|
box-shadow:
|
||||||
|
inset 0 1px 0 rgba(255, 244, 221, 0.035),
|
||||||
|
0 0 0 1px rgba(0, 0, 0, 0.28) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tool-modal .bootstrap-tagsinput .tag,
|
||||||
|
.tool-modal .bootstrap-tagsinput .badge {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
min-height: 1.35rem;
|
||||||
|
margin: 0 !important;
|
||||||
|
padding: 0.2rem 0.48rem !important;
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, rgba(216, 194, 138, 0.13), rgba(70, 45, 52, 0.28)) !important;
|
||||||
|
border: 1px solid rgba(194, 163, 90, 0.3) !important;
|
||||||
|
border-radius: 3px !important;
|
||||||
|
color: #e5d6b5 !important;
|
||||||
|
font-family: var(--wg-font-ui);
|
||||||
|
font-size: 0.75rem;
|
||||||
|
line-height: 1.1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tool-modal .bootstrap-tagsinput .tag [data-role="remove"],
|
||||||
|
.tool-modal .bootstrap-tagsinput .badge [data-role="remove"] {
|
||||||
|
color: rgba(230, 224, 214, 0.78);
|
||||||
|
margin-left: 0.32rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tool-modal .bootstrap-tagsinput input {
|
||||||
|
flex: 1 1 15rem;
|
||||||
|
min-width: 13rem;
|
||||||
|
height: 1.6rem;
|
||||||
|
margin: 0;
|
||||||
|
color: var(--wg-text) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tool-modal .bootstrap-tagsinput .ui-autocomplete {
|
||||||
|
min-width: 14rem;
|
||||||
|
padding: 0.35rem;
|
||||||
|
background: linear-gradient(to bottom, rgba(23, 19, 28, 0.99), rgba(12, 10, 15, 0.99)) !important;
|
||||||
|
border: 1px solid rgba(194, 163, 90, 0.22) !important;
|
||||||
|
border-radius: 4px;
|
||||||
|
box-shadow: 0 12px 24px rgba(0, 0, 0, 0.42);
|
||||||
|
}
|
||||||
|
|
||||||
|
.tool-modal .bootstrap-tagsinput .ui-menu-item,
|
||||||
|
.tool-modal .bootstrap-tagsinput .ui-menu-item-wrapper {
|
||||||
|
color: var(--wg-text-soft);
|
||||||
|
font-family: var(--wg-font-ui);
|
||||||
|
}
|
||||||
|
|
||||||
|
.composer,
|
||||||
|
.composer .composer-container,
|
||||||
|
.composer .resizer,
|
||||||
|
.composer .formatting-bar,
|
||||||
|
.composer .title-container,
|
||||||
|
.composer .tags-container,
|
||||||
|
.composer .category-list-container,
|
||||||
|
.composer .preview-container,
|
||||||
|
.composer .write-container,
|
||||||
|
.composer .imagedrop,
|
||||||
|
[component="composer"],
|
||||||
|
[component="composer"] .card,
|
||||||
|
[component="composer"] .card-header,
|
||||||
|
[component="composer"] .card-body {
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, transparent calc(100% - 1px), rgba(194, 163, 90, 0.055) calc(100% - 1px)),
|
||||||
|
linear-gradient(100deg, rgba(32, 19, 30, 0.98), rgba(13, 12, 17, 0.98)) !important;
|
||||||
|
background-size: 100% 1.82rem, auto;
|
||||||
|
border-color: rgba(194, 163, 90, 0.18) !important;
|
||||||
|
color: var(--wg-text-soft) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.composer .formatting-bar .btn,
|
||||||
|
.composer .btn-toolbar .btn,
|
||||||
|
[component="composer"] .btn,
|
||||||
|
.quick-reply .btn,
|
||||||
|
[component="topic/quickreply/container"] .btn {
|
||||||
|
color: var(--wg-text-soft) !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.12) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.composer .formatting-bar .btn:hover,
|
||||||
|
.composer .btn-toolbar .btn:hover,
|
||||||
|
[component="composer"] .btn:hover,
|
||||||
|
.quick-reply .btn:hover,
|
||||||
|
[component="topic/quickreply/container"] .btn:hover {
|
||||||
|
background: rgba(194, 163, 90, 0.08) !important;
|
||||||
|
color: var(--wg-text) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-content,
|
||||||
|
.modal-header,
|
||||||
|
.modal-footer,
|
||||||
|
.offcanvas,
|
||||||
|
.offcanvas-header,
|
||||||
|
.offcanvas-body {
|
||||||
|
background: linear-gradient(180deg, rgba(23, 19, 28, 0.98), rgba(13, 12, 17, 0.99)) !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.16) !important;
|
||||||
|
color: var(--wg-text-soft) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-tabs,
|
||||||
|
.nav-pills,
|
||||||
|
.list-group {
|
||||||
|
border-color: rgba(194, 163, 90, 0.12) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-tabs .nav-link,
|
||||||
|
.nav-pills .nav-link,
|
||||||
|
.list-group-item {
|
||||||
|
color: var(--wg-text-soft) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-tabs .nav-link.active,
|
||||||
|
.nav-pills .nav-link.active,
|
||||||
|
.list-group-item.active {
|
||||||
|
background: rgba(194, 163, 90, 0.12) !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.26) !important;
|
||||||
|
color: var(--wg-text) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-menu {
|
||||||
|
background: linear-gradient(to bottom, rgba(24, 20, 29, 0.98), rgba(17, 15, 21, 0.99)) !important;
|
||||||
|
border: 1px solid rgba(194, 163, 90, 0.16) !important;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.34);
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-item,
|
||||||
|
.dropdown-menu .nav-link {
|
||||||
|
color: var(--wg-text-soft) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-item:hover,
|
||||||
|
.dropdown-item:focus,
|
||||||
|
.dropdown-menu .nav-link:hover,
|
||||||
|
.dropdown-menu .nav-link:focus {
|
||||||
|
background: rgba(194, 163, 90, 0.08) !important;
|
||||||
|
color: var(--wg-text) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.badge {
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-link {
|
||||||
|
background: rgba(255, 255, 255, 0.018);
|
||||||
|
border-color: rgba(194, 163, 90, 0.1);
|
||||||
|
color: var(--wg-text-soft);
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-link:hover,
|
||||||
|
.page-link:focus,
|
||||||
|
.active > .page-link {
|
||||||
|
background: rgba(194, 163, 90, 0.12);
|
||||||
|
border-color: rgba(194, 163, 90, 0.25);
|
||||||
|
color: var(--wg-text);
|
||||||
|
}
|
||||||
|
|
||||||
|
.tooltip-inner {
|
||||||
|
background: #221c24 !important;
|
||||||
|
border: 1px solid rgba(194, 163, 90, 0.65) !important;
|
||||||
|
border-radius: 6px !important;
|
||||||
|
color: var(--wg-text) !important;
|
||||||
|
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 4px 12px rgba(0, 0, 0, 0.35) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tooltip .tooltip-arrow {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
[component="sidebar/left"],
|
||||||
|
[component="sidebar/right"],
|
||||||
|
.bottombar-nav {
|
||||||
|
background: linear-gradient(180deg, rgba(20, 18, 25, 0.96), rgba(13, 12, 17, 0.98)) !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.12) !important;
|
||||||
|
color: var(--wg-text-soft) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
[component="sidebar/left"] .nav-link,
|
||||||
|
[component="sidebar/right"] .nav-link,
|
||||||
|
.bottombar-nav .nav-link {
|
||||||
|
color: var(--wg-text-soft) !important;
|
||||||
|
border-radius: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
[component="sidebar/left"] .nav-link:hover,
|
||||||
|
[component="sidebar/left"] .nav-link:focus,
|
||||||
|
[component="sidebar/right"] .nav-link:hover,
|
||||||
|
[component="sidebar/right"] .nav-link:focus,
|
||||||
|
.bottombar-nav .nav-link:hover,
|
||||||
|
.bottombar-nav .nav-link:focus {
|
||||||
|
background: rgba(194, 163, 90, 0.08);
|
||||||
|
color: var(--wg-text) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
[component="sidebar/right"] .text-secondary,
|
||||||
|
[component="sidebar/right"] [data-widget-area="sidebar-footer"] {
|
||||||
|
color: var(--wg-text-muted) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
[component="navigation/count"],
|
||||||
|
[component="unread/count"] {
|
||||||
|
background-color: var(--wg-red) !important;
|
||||||
|
color: #f2dddd;
|
||||||
|
}
|
||||||
|
|
||||||
|
:focus-visible {
|
||||||
|
outline: 2px solid var(--wg-focus) !important;
|
||||||
|
outline-offset: 2px;
|
||||||
|
}
|
||||||
@@ -0,0 +1,224 @@
|
|||||||
|
body.template-topic h1[component="post/header"] .topic-title {
|
||||||
|
color: var(--wg-text);
|
||||||
|
text-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
body.template-topic .topic-info,
|
||||||
|
body.template-topic [component="topic/stats"] {
|
||||||
|
color: var(--wg-text-muted);
|
||||||
|
}
|
||||||
|
|
||||||
|
body.template-topic .topic-info .badge,
|
||||||
|
body.template-topic [component="topic/stats"] .badge {
|
||||||
|
background: rgba(8, 7, 10, 0.22) !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.16) !important;
|
||||||
|
color: var(--wg-ledger-ink-muted) !important;
|
||||||
|
font-family: var(--wg-font-ui);
|
||||||
|
}
|
||||||
|
|
||||||
|
ul[component="topic"].posts {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul[component="topic"].posts::before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: 1.3rem;
|
||||||
|
bottom: 1.5rem;
|
||||||
|
left: 1.55rem;
|
||||||
|
width: 1px;
|
||||||
|
background: linear-gradient(to bottom, rgba(194, 163, 90, 0.18), rgba(194, 163, 90, 0.07));
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="post"] {
|
||||||
|
color: var(--wg-text-soft);
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="post"] .post-container-parent > .bg-body {
|
||||||
|
background: var(--wg-bg) !important;
|
||||||
|
box-shadow: 0 0 0 5px var(--wg-bg), 0 0 0 6px rgba(194, 163, 90, 0.18) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="post"] .post-container {
|
||||||
|
position: relative;
|
||||||
|
padding: 1rem 1rem 0.85rem;
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, transparent calc(100% - 1px), var(--wg-ledger-ruling) calc(100% - 1px)),
|
||||||
|
var(--wg-ledger-panel) !important;
|
||||||
|
background-size: 100% 1.82rem, auto;
|
||||||
|
border: 1px solid var(--wg-ledger-border) !important;
|
||||||
|
border-left: 2px solid rgba(194, 163, 90, 0.32) !important;
|
||||||
|
border-radius: 6px !important;
|
||||||
|
box-shadow: var(--wg-ledger-shadow) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="post"] .post-container::before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: 2.95rem;
|
||||||
|
right: 1rem;
|
||||||
|
left: 1rem;
|
||||||
|
height: 1px;
|
||||||
|
background: linear-gradient(to right, rgba(194, 163, 90, 0.16), rgba(194, 163, 90, 0.05), transparent);
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="post"].topic-owner-post .post-container,
|
||||||
|
li[component="post"].self-post .post-container {
|
||||||
|
border-left-color: rgba(194, 163, 90, 0.46) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="post"] .post-header {
|
||||||
|
min-height: 2rem;
|
||||||
|
padding-bottom: 0.45rem;
|
||||||
|
color: var(--wg-ledger-ink-muted);
|
||||||
|
font-family: var(--wg-font-ui);
|
||||||
|
font-size: 0.86rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="post"] .post-header a.fw-bold {
|
||||||
|
color: var(--wg-ledger-ink) !important;
|
||||||
|
font-weight: 600 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="post"] .post-index {
|
||||||
|
color: var(--wg-ledger-ink-muted) !important;
|
||||||
|
font-family: var(--wg-font-code);
|
||||||
|
font-size: 0.78rem;
|
||||||
|
font-variant-numeric: tabular-nums;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="post"] .content,
|
||||||
|
li[component="post"] .content p,
|
||||||
|
li[component="post"] .content li,
|
||||||
|
li[component="post"] .content blockquote,
|
||||||
|
.topic-text,
|
||||||
|
.post-content {
|
||||||
|
color: var(--wg-text-soft);
|
||||||
|
line-height: 1.68;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="post"] .content {
|
||||||
|
padding-top: 0.35rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="post"] .content h1,
|
||||||
|
li[component="post"] .content h2,
|
||||||
|
li[component="post"] .content h3,
|
||||||
|
li[component="post"] .content h4 {
|
||||||
|
color: var(--wg-text);
|
||||||
|
font-family: var(--wg-font-display);
|
||||||
|
text-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="post"] .content blockquote {
|
||||||
|
background: rgba(35, 27, 23, 0.36);
|
||||||
|
border-left: 3px solid rgba(194, 163, 90, 0.4);
|
||||||
|
padding: 0.75rem 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="post"] .post-footer {
|
||||||
|
border-bottom: 0 !important;
|
||||||
|
border-top: 1px solid rgba(194, 163, 90, 0.095);
|
||||||
|
padding-top: 0.55rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="post"] [component="post/actions"] .btn,
|
||||||
|
li[component="post"] [component="post/reply-count"] {
|
||||||
|
color: var(--wg-text-muted) !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.1) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="post"] [component="post/actions"] .btn:hover,
|
||||||
|
li[component="post"] [component="post/reply-count"]:hover {
|
||||||
|
color: var(--wg-text) !important;
|
||||||
|
background: rgba(194, 163, 90, 0.08) !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.2) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topic-sidebar-tools .btn,
|
||||||
|
[component="topic/navigator"] {
|
||||||
|
background: rgba(255, 255, 255, 0.018) !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.1) !important;
|
||||||
|
color: var(--wg-text-soft) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
[component="topic/navigator"] .pagination-text,
|
||||||
|
[component="topic/navigator"] .scroller-content,
|
||||||
|
.topic-sidebar-tools,
|
||||||
|
.topic-sidebar-tools .btn {
|
||||||
|
font-family: var(--wg-font-ui);
|
||||||
|
}
|
||||||
|
|
||||||
|
[component="topic/navigator"] .scroller-thumb-icon {
|
||||||
|
background: var(--wg-ledger-ink) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pagination-block {
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, transparent calc(100% - 1px), rgba(194, 163, 90, 0.08) calc(100% - 1px)),
|
||||||
|
rgba(18, 15, 22, 0.96) !important;
|
||||||
|
background-size: 100% 1.55rem, auto;
|
||||||
|
border-color: var(--wg-ledger-border) !important;
|
||||||
|
box-shadow: 0 10px 24px rgba(0, 0, 0, 0.32) !important;
|
||||||
|
color: var(--wg-ledger-ink) !important;
|
||||||
|
font-family: var(--wg-font-ui);
|
||||||
|
}
|
||||||
|
|
||||||
|
.pagination-block.text-bg-light {
|
||||||
|
color: var(--wg-ledger-ink) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pagination-block a,
|
||||||
|
.pagination-block .btn,
|
||||||
|
.pagination-block i {
|
||||||
|
color: var(--wg-ledger-ink) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pagination-block .pagination-text {
|
||||||
|
color: var(--wg-text) !important;
|
||||||
|
font-family: var(--wg-font-display);
|
||||||
|
font-size: 0.82rem;
|
||||||
|
letter-spacing: 0.02em;
|
||||||
|
}
|
||||||
|
|
||||||
|
body.template-topic .sticky-top hr {
|
||||||
|
border-color: rgba(194, 163, 90, 0.12);
|
||||||
|
}
|
||||||
|
|
||||||
|
textarea[component="topic/quickreply/text"],
|
||||||
|
.quick-reply textarea {
|
||||||
|
color: var(--wg-text) !important;
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, transparent calc(100% - 1px), var(--wg-ledger-ruling) calc(100% - 1px)),
|
||||||
|
rgba(18, 15, 22, 0.92) !important;
|
||||||
|
background-size: 100% 1.82rem, auto;
|
||||||
|
border-color: var(--wg-ledger-border) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.quick-reply,
|
||||||
|
[component="topic/quickreply/container"] {
|
||||||
|
background: transparent !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.quick-reply .card,
|
||||||
|
[component="topic/quickreply/container"] .card,
|
||||||
|
.quick-reply .card-body,
|
||||||
|
[component="topic/quickreply/container"] .card-body {
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, transparent calc(100% - 1px), rgba(194, 163, 90, 0.05) calc(100% - 1px)),
|
||||||
|
var(--wg-ledger-panel) !important;
|
||||||
|
background-size: 100% 1.82rem, auto;
|
||||||
|
border-color: var(--wg-ledger-border) !important;
|
||||||
|
box-shadow: var(--wg-ledger-shadow) !important;
|
||||||
|
color: var(--wg-text-soft) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.quick-reply .card-header,
|
||||||
|
[component="topic/quickreply/container"] .card-header {
|
||||||
|
background: rgba(8, 7, 10, 0.22) !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.12) !important;
|
||||||
|
color: var(--wg-ledger-ink-muted) !important;
|
||||||
|
font-family: var(--wg-font-ui);
|
||||||
|
}
|
||||||
@@ -0,0 +1,58 @@
|
|||||||
|
@include media-breakpoint-down(lg) {
|
||||||
|
#panel {
|
||||||
|
background: linear-gradient(180deg, rgba(18, 15, 22, 0.96), rgba(9, 8, 11, 1));
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.categories-list,
|
||||||
|
ul.westgate-categories-list {
|
||||||
|
padding-left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.categories-list::before {
|
||||||
|
content: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="categories/category"],
|
||||||
|
li[component="category/topic"],
|
||||||
|
li[component="post"] .post-container {
|
||||||
|
padding: 0.85rem !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="categories/category"]::before {
|
||||||
|
content: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="categories/category"] h2.title {
|
||||||
|
font-size: 1.1rem !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-children-item > div {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topic-list-header > .card {
|
||||||
|
align-items: stretch !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topic-list-header [component="category/controls"] {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include media-breakpoint-down(md) {
|
||||||
|
.category-header {
|
||||||
|
padding: 0.85rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="post"] .content,
|
||||||
|
li[component="post"] .content p,
|
||||||
|
.topic-text,
|
||||||
|
.post-content {
|
||||||
|
font-size: 1rem;
|
||||||
|
line-height: 1.58;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bottombar-nav {
|
||||||
|
box-shadow: 0 -8px 20px rgba(0, 0, 0, 0.28);
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,184 @@
|
|||||||
|
html,
|
||||||
|
body {
|
||||||
|
background: var(--wg-bg);
|
||||||
|
color: var(--wg-text-soft);
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: var(--wg-font-text);
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
|
-moz-osx-font-smoothing: grayscale;
|
||||||
|
}
|
||||||
|
|
||||||
|
#panel {
|
||||||
|
background: var(--wg-bg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.layout-container,
|
||||||
|
#content {
|
||||||
|
color: var(--wg-text-soft);
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: var(--wg-gold);
|
||||||
|
|
||||||
|
&:hover,
|
||||||
|
&:focus {
|
||||||
|
color: #e0c878;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-muted,
|
||||||
|
.text-secondary,
|
||||||
|
.link-secondary {
|
||||||
|
color: var(--wg-text-muted) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-body,
|
||||||
|
.bg-light,
|
||||||
|
.card,
|
||||||
|
.card-header,
|
||||||
|
.list-group-item {
|
||||||
|
background-color: var(--wg-panel) !important;
|
||||||
|
color: var(--wg-text-soft);
|
||||||
|
border-color: var(--wg-border-soft) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.westgate-surface,
|
||||||
|
.topic-list-header > .card,
|
||||||
|
.category-header,
|
||||||
|
li[component="categories/category"],
|
||||||
|
li[component="category/topic"],
|
||||||
|
li[component="post"] .post-container,
|
||||||
|
.quick-reply textarea,
|
||||||
|
textarea[component="topic/quickreply/text"] {
|
||||||
|
background: var(--wg-velvet-panel) !important;
|
||||||
|
border: 1px solid var(--wg-border) !important;
|
||||||
|
border-radius: 8px !important;
|
||||||
|
box-shadow: var(--wg-velvet-shadow) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.westgate-surface-hover,
|
||||||
|
li[component="categories/category"]:hover,
|
||||||
|
li[component="category/topic"]:hover,
|
||||||
|
li[component="post"] .post-container:hover {
|
||||||
|
background: var(--wg-velvet-panel-hover) !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.22) !important;
|
||||||
|
box-shadow:
|
||||||
|
inset 0 1px 0 rgba(255, 255, 255, 0.035),
|
||||||
|
inset 0 0 38px rgba(120, 36, 84, 0.14),
|
||||||
|
0 12px 30px rgba(0, 0, 0, 0.3) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.badge,
|
||||||
|
.btn,
|
||||||
|
.dropdown-menu,
|
||||||
|
.form-control,
|
||||||
|
.form-select,
|
||||||
|
.pagination,
|
||||||
|
.topic-list-header,
|
||||||
|
.category-tools,
|
||||||
|
.meta.stats,
|
||||||
|
.timeago {
|
||||||
|
font-family: var(--wg-font-ui);
|
||||||
|
letter-spacing: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
.category-title,
|
||||||
|
.topic-title,
|
||||||
|
li[component="categories/category"] h2.title,
|
||||||
|
li[component="category/topic"] h3[component="topic/header"] {
|
||||||
|
color: var(--wg-text);
|
||||||
|
font-family: var(--wg-font-display);
|
||||||
|
font-weight: 600;
|
||||||
|
letter-spacing: 0;
|
||||||
|
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.9), 0 0 10px rgba(104, 32, 76, 0.16);
|
||||||
|
}
|
||||||
|
|
||||||
|
p,
|
||||||
|
li,
|
||||||
|
.description,
|
||||||
|
.post-content,
|
||||||
|
.topic-text,
|
||||||
|
[component="post/content"],
|
||||||
|
[component="chat/message/body"] {
|
||||||
|
font-family: var(--wg-font-text);
|
||||||
|
}
|
||||||
|
|
||||||
|
code,
|
||||||
|
kbd,
|
||||||
|
pre,
|
||||||
|
samp,
|
||||||
|
.text-tabular {
|
||||||
|
font-family: var(--wg-font-code) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.breadcrumb {
|
||||||
|
--bs-breadcrumb-divider-color: var(--wg-gold-soft);
|
||||||
|
color: var(--wg-text-muted);
|
||||||
|
}
|
||||||
|
|
||||||
|
.breadcrumb a,
|
||||||
|
.breadcrumb-item.active {
|
||||||
|
color: var(--wg-text-muted);
|
||||||
|
}
|
||||||
|
|
||||||
|
.alert {
|
||||||
|
background: rgba(194, 163, 90, 0.08);
|
||||||
|
border-color: rgba(194, 163, 90, 0.18);
|
||||||
|
color: var(--wg-text-soft);
|
||||||
|
}
|
||||||
|
|
||||||
|
.alert-danger {
|
||||||
|
background: rgba(142, 52, 56, 0.16);
|
||||||
|
border-color: rgba(142, 52, 56, 0.32);
|
||||||
|
color: #d8b1b1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.avatar,
|
||||||
|
[component="user/picture"] img,
|
||||||
|
.user-icon,
|
||||||
|
.avatar-tooltip .avatar,
|
||||||
|
.avatar-tooltip img {
|
||||||
|
border: 1px solid rgba(216, 194, 138, 0.2);
|
||||||
|
box-shadow:
|
||||||
|
inset 0 1px 0 rgba(255, 238, 190, 0.18),
|
||||||
|
inset 0 -2px 4px rgba(0, 0, 0, 0.44),
|
||||||
|
0 0 0 1px rgba(24, 13, 19, 0.82),
|
||||||
|
0 6px 14px rgba(0, 0, 0, 0.34) !important;
|
||||||
|
filter: saturate(0.9) contrast(1.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-icon {
|
||||||
|
background-image:
|
||||||
|
radial-gradient(circle at 34% 22%, rgba(255, 238, 190, 0.2), transparent 26%),
|
||||||
|
linear-gradient(145deg, rgba(90, 58, 32, 0.42), rgba(44, 17, 34, 0.22)) !important;
|
||||||
|
text-shadow:
|
||||||
|
0 1px 0 rgba(0, 0, 0, 0.78),
|
||||||
|
0 -1px 0 rgba(255, 238, 190, 0.12);
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="post"] .avatar,
|
||||||
|
li[component="category/topic"] .avatar,
|
||||||
|
li[component="category/topic"] .user-icon {
|
||||||
|
border-radius: 999px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.account,
|
||||||
|
.account .profile,
|
||||||
|
.account .cover,
|
||||||
|
.users .users-container,
|
||||||
|
.groups.list,
|
||||||
|
.notifications-list,
|
||||||
|
.chats-list,
|
||||||
|
.settings,
|
||||||
|
.user-profile,
|
||||||
|
.user-card,
|
||||||
|
.profile-card {
|
||||||
|
color: var(--wg-text-soft);
|
||||||
|
}
|
||||||
@@ -0,0 +1,106 @@
|
|||||||
|
@font-face {
|
||||||
|
font-family: "Cinzel";
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 600;
|
||||||
|
font-display: swap;
|
||||||
|
src: url("./plugins/nodebb-theme-westgate/cinzel/cinzel-latin-600-normal.woff2") format("woff2");
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: "Jost";
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
font-display: swap;
|
||||||
|
src: url("./plugins/nodebb-theme-westgate/jost/jost-latin-400-normal.woff2") format("woff2");
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: "Jost";
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 600;
|
||||||
|
font-display: swap;
|
||||||
|
src: url("./plugins/nodebb-theme-westgate/jost/jost-latin-600-normal.woff2") format("woff2");
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: "Jost";
|
||||||
|
font-style: italic;
|
||||||
|
font-weight: 400;
|
||||||
|
font-display: swap;
|
||||||
|
src: url("./plugins/nodebb-theme-westgate/jost/jost-latin-400-italic.woff2") format("woff2");
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: "IBM Plex Mono";
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
font-display: swap;
|
||||||
|
src: url("./plugins/nodebb-theme-westgate/ibm-plex-mono/ibm-plex-mono-latin-400-normal.woff2") format("woff2");
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: "IBM Plex Mono";
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 500;
|
||||||
|
font-display: swap;
|
||||||
|
src: url("./plugins/nodebb-theme-westgate/ibm-plex-mono/ibm-plex-mono-latin-500-normal.woff2") format("woff2");
|
||||||
|
}
|
||||||
|
|
||||||
|
:root {
|
||||||
|
--wg-font-display: "Cinzel", Georgia, "Times New Roman", serif;
|
||||||
|
--wg-font-text: "Jost", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
|
||||||
|
--wg-font-ui: "Jost", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
|
||||||
|
--wg-font-code: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
|
||||||
|
--wg-bg: #0f0d12;
|
||||||
|
--wg-bg-deep: #09080b;
|
||||||
|
--wg-panel: #18141d;
|
||||||
|
--wg-panel-2: #110f15;
|
||||||
|
--wg-panel-3: #201924;
|
||||||
|
--wg-plum: #2a1222;
|
||||||
|
--wg-plum-soft: #3a1830;
|
||||||
|
--wg-gold: #c2a35a;
|
||||||
|
--wg-gold-soft: #a8893f;
|
||||||
|
--wg-red: #8e3438;
|
||||||
|
--wg-text: #e6e0d6;
|
||||||
|
--wg-text-soft: #b9b2a6;
|
||||||
|
--wg-text-muted: #9a9086;
|
||||||
|
--wg-border: rgba(194, 163, 90, 0.14);
|
||||||
|
--wg-border-soft: rgba(194, 163, 90, 0.08);
|
||||||
|
--wg-focus: rgba(194, 163, 90, 0.28);
|
||||||
|
--wg-ledger-panel: linear-gradient(
|
||||||
|
100deg,
|
||||||
|
rgba(38, 22, 35, 0.5) 0%,
|
||||||
|
rgba(19, 17, 24, 0.97) 34%,
|
||||||
|
rgba(13, 12, 17, 0.98) 100%
|
||||||
|
);
|
||||||
|
--wg-ledger-ruling: rgba(194, 163, 90, 0.055);
|
||||||
|
--wg-ledger-rule-strong: rgba(194, 163, 90, 0.16);
|
||||||
|
--wg-ledger-border: rgba(194, 163, 90, 0.18);
|
||||||
|
--wg-ledger-ink: #d8c28a;
|
||||||
|
--wg-ledger-ink-muted: #a99d8f;
|
||||||
|
--wg-ledger-stamp: #a84a4e;
|
||||||
|
--wg-ledger-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.024), inset 0 -1px 0 rgba(0, 0, 0, 0.42), 0 8px 18px rgba(0, 0, 0, 0.2);
|
||||||
|
--wg-etched-highlight: rgba(246, 223, 163, 0.34);
|
||||||
|
--wg-etched-shadow: rgba(23, 12, 16, 0.82);
|
||||||
|
--wg-velvet-panel: linear-gradient(
|
||||||
|
100deg,
|
||||||
|
rgba(42, 18, 34, 0.46) 0%,
|
||||||
|
rgba(25, 22, 31, 0.95) 23%,
|
||||||
|
rgba(18, 16, 23, 0.99) 62%,
|
||||||
|
rgba(13, 12, 17, 0.98) 100%
|
||||||
|
);
|
||||||
|
--wg-velvet-panel-hover: linear-gradient(
|
||||||
|
100deg,
|
||||||
|
rgba(58, 24, 48, 0.56) 0%,
|
||||||
|
rgba(31, 25, 39, 0.98) 23%,
|
||||||
|
rgba(21, 18, 27, 1) 62%,
|
||||||
|
rgba(15, 14, 20, 0.99) 100%
|
||||||
|
);
|
||||||
|
--wg-velvet-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025), inset 0 0 34px rgba(96, 32, 68, 0.11), 0 10px 26px rgba(0, 0, 0, 0.24);
|
||||||
|
--wg-control-bg: linear-gradient(to bottom, rgba(194, 163, 90, 0.15), rgba(194, 163, 90, 0.05));
|
||||||
|
}
|
||||||
|
|
||||||
|
::selection {
|
||||||
|
background: rgba(194, 163, 90, 0.32);
|
||||||
|
color: #fff4dd;
|
||||||
|
}
|
||||||
@@ -0,0 +1,403 @@
|
|||||||
|
body.template-category .category-header {
|
||||||
|
padding: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
body.template-category .category-header .icon {
|
||||||
|
border-radius: 6px !important;
|
||||||
|
box-shadow: 0 0 0 1px rgba(194, 163, 90, 0.2), 0 8px 18px rgba(0, 0, 0, 0.28);
|
||||||
|
}
|
||||||
|
|
||||||
|
body.template-category .category-header h1 {
|
||||||
|
color: var(--wg-text);
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
body.template-category .category-header .description {
|
||||||
|
color: var(--wg-text-muted) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topic-list-header {
|
||||||
|
background: transparent !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topic-list-header > .card {
|
||||||
|
padding: 0.55rem !important;
|
||||||
|
background: rgba(18, 15, 22, 0.78) !important;
|
||||||
|
border-color: var(--wg-ledger-border) !important;
|
||||||
|
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.018) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topic-list-header .btn {
|
||||||
|
background: transparent !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.14) !important;
|
||||||
|
color: var(--wg-text-soft) !important;
|
||||||
|
font-family: var(--wg-font-ui);
|
||||||
|
}
|
||||||
|
|
||||||
|
.topic-list-header .btn:hover,
|
||||||
|
.topic-list-header .btn:focus {
|
||||||
|
background: rgba(194, 163, 90, 0.075) !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.26) !important;
|
||||||
|
color: var(--wg-text) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul[component="category"] {
|
||||||
|
display: grid;
|
||||||
|
gap: 0.85rem;
|
||||||
|
padding: 0 !important;
|
||||||
|
background: transparent !important;
|
||||||
|
border: 0 !important;
|
||||||
|
box-shadow: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] {
|
||||||
|
position: relative;
|
||||||
|
isolation: isolate;
|
||||||
|
margin: 0 !important;
|
||||||
|
padding: 0.95rem 1rem !important;
|
||||||
|
overflow: hidden;
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, transparent calc(100% - 1px), var(--wg-ledger-ruling) calc(100% - 1px)),
|
||||||
|
linear-gradient(to right, rgba(194, 163, 90, 0.08), transparent 5.25rem),
|
||||||
|
var(--wg-ledger-panel) !important;
|
||||||
|
background-size: 100% 1.78rem, auto, auto;
|
||||||
|
border: 1px solid var(--wg-ledger-border) !important;
|
||||||
|
border-left: 2px solid rgba(194, 163, 90, 0.34) !important;
|
||||||
|
border-radius: 6px !important;
|
||||||
|
box-shadow: var(--wg-ledger-shadow) !important;
|
||||||
|
transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"]:not(.unread) {
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, transparent calc(100% - 1px), rgba(194, 163, 90, 0.026) calc(100% - 1px)),
|
||||||
|
linear-gradient(to right, rgba(194, 163, 90, 0.024), transparent 5.25rem),
|
||||||
|
linear-gradient(100deg, rgba(24, 17, 25, 0.28) 0%, rgba(14, 13, 18, 0.91) 42%, rgba(9, 8, 12, 0.95) 100%) !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.085) !important;
|
||||||
|
border-left-color: rgba(194, 163, 90, 0.12) !important;
|
||||||
|
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.014), inset 0 -1px 0 rgba(0, 0, 0, 0.36) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"]:not(.unread) .avatar,
|
||||||
|
li[component="category/topic"]:not(.unread) .user-icon {
|
||||||
|
opacity: 0.78;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"]::before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: 0.85rem;
|
||||||
|
bottom: 0.85rem;
|
||||||
|
left: 4.55rem;
|
||||||
|
width: 1px;
|
||||||
|
background: linear-gradient(to bottom, transparent, var(--wg-ledger-rule-strong), transparent);
|
||||||
|
pointer-events: none;
|
||||||
|
opacity: 0.65;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"]::after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
left: 0;
|
||||||
|
height: 1px;
|
||||||
|
background: linear-gradient(to right, rgba(194, 163, 90, 0.28), rgba(194, 163, 90, 0.05), transparent);
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"].unread:nth-child(even) {
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, transparent calc(100% - 1px), rgba(216, 194, 138, 0.055) calc(100% - 1px)),
|
||||||
|
linear-gradient(to right, rgba(216, 194, 138, 0.09), transparent 5.25rem),
|
||||||
|
var(--wg-ledger-panel) !important;
|
||||||
|
background-size: 100% 1.78rem, auto, auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"]:hover {
|
||||||
|
border-color: rgba(194, 163, 90, 0.18) !important;
|
||||||
|
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.026), inset 0 0 16px rgba(120, 36, 84, 0.07), 0 8px 18px rgba(0, 0, 0, 0.2) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"].unread {
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, transparent calc(100% - 1px), rgba(216, 194, 138, 0.052) calc(100% - 1px)),
|
||||||
|
linear-gradient(to right, rgba(216, 194, 138, 0.085), transparent 5.65rem),
|
||||||
|
var(--wg-ledger-panel) !important;
|
||||||
|
border-color: rgba(216, 194, 138, 0.17) !important;
|
||||||
|
border-left-color: var(--wg-ledger-ink) !important;
|
||||||
|
box-shadow:
|
||||||
|
var(--wg-ledger-shadow),
|
||||||
|
inset 2px 0 0 rgba(216, 194, 138, 0.1) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"].pinned {
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, transparent calc(100% - 1px), rgba(216, 194, 138, 0.045) calc(100% - 1px)),
|
||||||
|
linear-gradient(90deg, rgba(194, 163, 90, 0.075), transparent 5.75rem),
|
||||||
|
var(--wg-ledger-panel) !important;
|
||||||
|
border-left-color: rgba(216, 194, 138, 0.44) !important;
|
||||||
|
box-shadow:
|
||||||
|
var(--wg-ledger-shadow),
|
||||||
|
inset 0 -1px 0 rgba(216, 194, 138, 0.055) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"].pinned:not(.unread) {
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, transparent calc(100% - 1px), rgba(194, 163, 90, 0.036) calc(100% - 1px)),
|
||||||
|
linear-gradient(90deg, rgba(122, 101, 45, 0.09), transparent 5.75rem),
|
||||||
|
linear-gradient(100deg, rgba(28, 22, 26, 0.36), rgba(13, 12, 17, 0.94)) !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.12) !important;
|
||||||
|
border-left-color: rgba(194, 163, 90, 0.28) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"].pinned:has(+ li[component="category/topic"]:not(.pinned)) {
|
||||||
|
margin-bottom: 0.85rem !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"].pinned:has(+ li[component="category/topic"]:not(.pinned))::after {
|
||||||
|
top: auto;
|
||||||
|
bottom: -0.48rem;
|
||||||
|
left: 0.25rem;
|
||||||
|
right: 0.25rem;
|
||||||
|
height: 1px;
|
||||||
|
background:
|
||||||
|
linear-gradient(to right, transparent, rgba(216, 194, 138, 0.22), rgba(142, 52, 56, 0.1), transparent);
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"].locked {
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, transparent calc(100% - 1px), rgba(150, 72, 78, 0.04) calc(100% - 1px)),
|
||||||
|
linear-gradient(90deg, rgba(93, 47, 54, 0.11), transparent 5.75rem),
|
||||||
|
var(--wg-ledger-panel) !important;
|
||||||
|
border-color: rgba(168, 74, 78, 0.18) !important;
|
||||||
|
border-left-color: rgba(168, 74, 78, 0.42) !important;
|
||||||
|
box-shadow:
|
||||||
|
var(--wg-ledger-shadow),
|
||||||
|
0 0 12px rgba(142, 52, 56, 0.09),
|
||||||
|
inset 2px 0 0 rgba(142, 52, 56, 0.1) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"].locked:not(.unread) {
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, transparent calc(100% - 1px), rgba(150, 72, 78, 0.034) calc(100% - 1px)),
|
||||||
|
linear-gradient(90deg, rgba(82, 39, 46, 0.1), transparent 5.75rem),
|
||||||
|
linear-gradient(100deg, rgba(24, 16, 21, 0.38), rgba(11, 10, 14, 0.95)) !important;
|
||||||
|
border-color: rgba(168, 74, 78, 0.14) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"].locked.pinned {
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, transparent calc(100% - 1px), rgba(194, 163, 90, 0.045) calc(100% - 1px)),
|
||||||
|
linear-gradient(90deg, rgba(168, 74, 78, 0.1), rgba(194, 163, 90, 0.065) 4.4rem, transparent 7rem),
|
||||||
|
var(--wg-ledger-panel) !important;
|
||||||
|
border-color: rgba(168, 74, 78, 0.2) !important;
|
||||||
|
border-left-color: rgba(168, 74, 78, 0.58) !important;
|
||||||
|
box-shadow:
|
||||||
|
var(--wg-ledger-shadow),
|
||||||
|
0 0 14px rgba(142, 52, 56, 0.085),
|
||||||
|
inset 2px 0 0 rgba(216, 194, 138, 0.13) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"].pinned::after,
|
||||||
|
li[component="category/topic"].locked::after {
|
||||||
|
height: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"].pinned [component="topic/pinned"] {
|
||||||
|
background: rgba(93, 78, 32, 0.34) !important;
|
||||||
|
border-color: rgba(216, 194, 138, 0.28) !important;
|
||||||
|
color: var(--wg-ledger-ink) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"].locked [component="topic/locked"] {
|
||||||
|
background: rgba(72, 31, 38, 0.38) !important;
|
||||||
|
border-color: rgba(168, 74, 78, 0.32) !important;
|
||||||
|
color: #d7aaa5 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"].locked.pinned [component="topic/pinned"],
|
||||||
|
li[component="category/topic"].locked.pinned [component="topic/locked"] {
|
||||||
|
border-style: double !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] h3[component="topic/header"],
|
||||||
|
li[component="category/topic"] .title {
|
||||||
|
color: #ded5ca !important;
|
||||||
|
font-size: 1.15rem !important;
|
||||||
|
line-height: 1.2;
|
||||||
|
text-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.topics-list li[component="category/topic"].unread .title,
|
||||||
|
ul[component="category"] li[component="category/topic"].unread .title {
|
||||||
|
color: #f0e7da !important;
|
||||||
|
text-shadow: 0 0 7px rgba(216, 194, 138, 0.045);
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.topics-list li[component="category/topic"]:not(.unread) .title,
|
||||||
|
ul[component="category"] li[component="category/topic"]:not(.unread) .title {
|
||||||
|
color: #bdb4a8 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] h3[component="topic/header"] a,
|
||||||
|
li[component="category/topic"] .title a,
|
||||||
|
li[component="category/topic"].unread h3[component="topic/header"] a.text-reset,
|
||||||
|
li[component="category/topic"].unread .title a.text-reset {
|
||||||
|
--bs-link-color-rgb: 222, 213, 202;
|
||||||
|
color: inherit !important;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"]:hover h3[component="topic/header"] a,
|
||||||
|
li[component="category/topic"]:hover .title a {
|
||||||
|
color: #efe7da !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] .badge,
|
||||||
|
.topic-info .badge,
|
||||||
|
a[component="topic/category"] {
|
||||||
|
position: relative;
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, rgba(255, 241, 196, 0.035), rgba(8, 7, 10, 0.2)) !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.18) !important;
|
||||||
|
border-radius: 3px !important;
|
||||||
|
box-shadow:
|
||||||
|
inset 0 1px 0 rgba(255, 238, 190, 0.055),
|
||||||
|
inset 0 -1px 0 rgba(0, 0, 0, 0.3);
|
||||||
|
color: var(--wg-ledger-ink-muted) !important;
|
||||||
|
font-family: var(--wg-font-ui);
|
||||||
|
font-size: 0.72rem;
|
||||||
|
line-height: 1.15;
|
||||||
|
padding: 0.18rem 0.38rem;
|
||||||
|
text-decoration: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] [component="topic/labels"] .badge {
|
||||||
|
letter-spacing: 0.015em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] [component="topic/labels"] .badge i {
|
||||||
|
color: var(--wg-ledger-ink);
|
||||||
|
margin-right: 0.12rem;
|
||||||
|
opacity: 0.86;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] [component="topic/watched"] {
|
||||||
|
background: linear-gradient(to bottom, rgba(59, 72, 50, 0.25), rgba(8, 7, 10, 0.2)) !important;
|
||||||
|
border-color: rgba(143, 166, 100, 0.22) !important;
|
||||||
|
color: #b7c59d !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] [component="topic/ignored"],
|
||||||
|
li[component="category/topic"] [component="topic/moved"] {
|
||||||
|
background: linear-gradient(to bottom, rgba(72, 67, 58, 0.22), rgba(8, 7, 10, 0.18)) !important;
|
||||||
|
border-color: rgba(169, 157, 143, 0.16) !important;
|
||||||
|
color: #aaa095 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] [component="topic/scheduled"] {
|
||||||
|
background: linear-gradient(to bottom, rgba(70, 56, 90, 0.24), rgba(8, 7, 10, 0.2)) !important;
|
||||||
|
border-color: rgba(160, 135, 190, 0.2) !important;
|
||||||
|
color: #c0aed0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] .tag,
|
||||||
|
li[component="category/topic"] .tag-item,
|
||||||
|
.tag-list .tag {
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, rgba(255, 241, 196, 0.026), rgba(8, 7, 10, 0.2)) !important;
|
||||||
|
border-color: rgba(194, 163, 90, 0.22) !important;
|
||||||
|
border-left: 1px solid rgba(216, 194, 138, 0.32) !important;
|
||||||
|
color: #cdbb8b !important;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
font-family: var(--wg-font-ui);
|
||||||
|
font-size: 0.72rem;
|
||||||
|
font-weight: 500 !important;
|
||||||
|
letter-spacing: 0;
|
||||||
|
line-height: 1.15;
|
||||||
|
min-height: 1.38rem;
|
||||||
|
padding: 0.22rem 0.48rem;
|
||||||
|
text-transform: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] [component="topic/tags"] a {
|
||||||
|
text-decoration: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] .tag::before,
|
||||||
|
li[component="category/topic"] .tag-item::before,
|
||||||
|
.tag-list .tag::before {
|
||||||
|
content: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] [component="topic/select"] {
|
||||||
|
width: 1.15rem;
|
||||||
|
height: 1.15rem;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
background:
|
||||||
|
linear-gradient(to bottom, rgba(255, 241, 196, 0.045), rgba(8, 7, 10, 0.28));
|
||||||
|
border: 1px solid rgba(194, 163, 90, 0.22);
|
||||||
|
border-radius: 3px;
|
||||||
|
box-shadow:
|
||||||
|
inset 0 1px 0 rgba(255, 238, 190, 0.06),
|
||||||
|
0 0 0 1px rgba(0, 0, 0, 0.3);
|
||||||
|
color: var(--wg-ledger-ink-muted) !important;
|
||||||
|
font-size: 0.72rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] [component="topic/select"]:hover,
|
||||||
|
li[component="category/topic"] [component="topic/select"]:focus {
|
||||||
|
border-color: rgba(216, 194, 138, 0.42);
|
||||||
|
color: var(--wg-ledger-ink) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] .meta.stats > div {
|
||||||
|
min-height: 3.25rem;
|
||||||
|
background: rgba(8, 7, 10, 0.18) !important;
|
||||||
|
border: 0 !important;
|
||||||
|
border-inline-start: 1px solid rgba(194, 163, 90, 0.12) !important;
|
||||||
|
border-radius: 0 !important;
|
||||||
|
box-shadow: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] .meta.stats .fs-5,
|
||||||
|
li[component="category/topic"] .meta.stats .ff-secondary {
|
||||||
|
color: var(--wg-text) !important;
|
||||||
|
font-family: var(--wg-font-code);
|
||||||
|
font-size: 1.1rem !important;
|
||||||
|
font-variant-numeric: tabular-nums;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] .meta.stats .text-xs,
|
||||||
|
li[component="category/topic"] .meta.stats .text-muted,
|
||||||
|
li[component="category/topic"] [component="topic/teaser"],
|
||||||
|
li[component="category/topic"] [component="topic/teaser"] .post-content {
|
||||||
|
color: var(--wg-text-muted) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] .meta.stats .text-xs,
|
||||||
|
li[component="category/topic"] .meta.stats .text-muted {
|
||||||
|
font-family: var(--wg-font-ui);
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] [component="topic/teaser"] .lastpost {
|
||||||
|
background: transparent !important;
|
||||||
|
border-left-color: rgba(194, 163, 90, 0.42) !important;
|
||||||
|
color: var(--wg-ledger-ink-muted);
|
||||||
|
}
|
||||||
|
|
||||||
|
li[component="category/topic"] [component="topic/teaser"] .permalink,
|
||||||
|
li[component="category/topic"] [component="topic/teaser"] .timeago {
|
||||||
|
color: var(--wg-ledger-ink-muted) !important;
|
||||||
|
font-family: var(--wg-font-ui);
|
||||||
|
}
|
||||||
|
|
||||||
|
.topic-thumbs .topic-thumb {
|
||||||
|
background: rgba(255, 255, 255, 0.025) !important;
|
||||||
|
border: 1px solid rgba(194, 163, 90, 0.12);
|
||||||
|
}
|
||||||
@@ -0,0 +1,29 @@
|
|||||||
|
<div data-widget-area="header">
|
||||||
|
{{{ each widgets.header }}}
|
||||||
|
{{widgets.header.html}}
|
||||||
|
{{{ end }}}
|
||||||
|
</div>
|
||||||
|
<div class="row flex-fill py-2 westgate-categories-page">
|
||||||
|
<div class="{{{ if widgets.sidebar.length }}}col-lg-9 col-sm-12{{{ else }}}col-lg-12{{{ end }}}">
|
||||||
|
{{{ if pagination.pages.length }}}
|
||||||
|
<div><!-- IMPORT partials/category/selector-dropdown-left.tpl --></div>
|
||||||
|
{{{ end }}}
|
||||||
|
<ul class="categories-list westgate-categories-list list-unstyled" itemscope itemtype="http://www.schema.org/ItemList">
|
||||||
|
{{{ each categories }}}
|
||||||
|
<!-- IMPORT partials/categories/item.tpl -->
|
||||||
|
{{{ end }}}
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<!-- IMPORT partials/paginator.tpl -->
|
||||||
|
</div>
|
||||||
|
<div data-widget-area="sidebar" class="col-lg-3 col-sm-12 {{{ if !widgets.sidebar.length }}}hidden{{{ end }}}">
|
||||||
|
{{{ each widgets.sidebar }}}
|
||||||
|
{{widgets.sidebar.html}}
|
||||||
|
{{{ end }}}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div data-widget-area="footer">
|
||||||
|
{{{ each widgets.footer }}}
|
||||||
|
{{widgets.footer.html}}
|
||||||
|
{{{ end }}}
|
||||||
|
</div>
|
||||||
@@ -0,0 +1,12 @@
|
|||||||
|
<ul class="list-unstyled category-children row row-cols-1 row-cols-md-2 g-2 my-1 w-100">
|
||||||
|
{{{ each ./children }}}
|
||||||
|
{{{ if !./isSection }}}
|
||||||
|
<li data-cid="{./cid}" class="category-children-item small">
|
||||||
|
<div class="westgate-category-child d-flex gap-1">
|
||||||
|
{buildCategoryIcon(@value, "18px", "westgate-child-icon rounded-1")}
|
||||||
|
<a href="{{{ if ./link }}}{./link}{{{ else }}}{config.relative_path}/category/{./slug}{{{ end }}}" class="text-reset fw-semibold flex-1">{./name}</a>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
{{{ end }}}
|
||||||
|
{{{ end }}}
|
||||||
|
</ul>
|
||||||
@@ -0,0 +1,71 @@
|
|||||||
|
<li component="categories/category" data-cid="{./cid}" class="westgate-category-card w-100 py-3 py-lg-4 gap-lg-0 gap-2 d-flex flex-column flex-lg-row align-items-start category-{./cid} {./unread-class}">
|
||||||
|
<meta itemprop="name" content="{./name}">
|
||||||
|
|
||||||
|
<div class="d-flex col-lg-7 gap-2 gap-lg-3">
|
||||||
|
<div class="flex-shrink-0">
|
||||||
|
{buildCategoryIcon(@value, "40px", "rounded-1")}
|
||||||
|
</div>
|
||||||
|
<div class="flex-grow-1 d-flex flex-wrap gap-1 me-0 me-lg-2">
|
||||||
|
<h2 class="title text-break fs-4 fw-semibold m-0 tracking-tight w-100">
|
||||||
|
<!-- IMPORT partials/categories/link.tpl -->
|
||||||
|
</h2>
|
||||||
|
{{{ if ./descriptionParsed }}}
|
||||||
|
<div class="description text-muted text-sm w-100 line-clamp-sm-5">
|
||||||
|
{./descriptionParsed}
|
||||||
|
</div>
|
||||||
|
{{{ end }}}
|
||||||
|
{{{ if !./link }}}
|
||||||
|
<div class="d-flex gap-1 d-block d-lg-none w-100">
|
||||||
|
<span class="badge text-body border stats text-xs text-muted">
|
||||||
|
<i class="fa fa-fw fa-list"></i>
|
||||||
|
<span class="fw-normal">{humanReadableNumber(./totalTopicCount, 0)}</span>
|
||||||
|
</span>
|
||||||
|
<span class="badge text-body border stats text-xs text-muted">
|
||||||
|
<i class="fa-regular fa-fw fa-message"></i>
|
||||||
|
<span class="fw-normal">{humanReadableNumber(./totalPostCount, 0)}</span>
|
||||||
|
</span>
|
||||||
|
{{{ if ./teaser }}}
|
||||||
|
<a href="{config.relative_path}{./teaser.url}" class="border badge bg-transparent text-muted fw-normal timeago {{{ if (!./teaser.timestampISO || config.theme.mobileTopicTeasers) }}}hidden{{{ end }}}" title="{./teaser.timestampISO}"></a>
|
||||||
|
{{{ end }}}
|
||||||
|
</div>
|
||||||
|
{{{ end }}}
|
||||||
|
{{{ if !config.hideSubCategories }}}
|
||||||
|
{{{ if ./children.length }}}
|
||||||
|
<ul class="list-unstyled category-children row row-cols-1 row-cols-md-2 g-2 my-1 w-100">
|
||||||
|
{{{ each ./children }}}
|
||||||
|
{{{ if !./isSection }}}
|
||||||
|
<li data-cid="{./cid}" class="category-children-item small">
|
||||||
|
<div class="westgate-category-child d-flex gap-1">
|
||||||
|
{buildCategoryIcon(@value, "18px", "westgate-child-icon rounded-1")}
|
||||||
|
<a href="{{{ if ./link }}}{./link}{{{ else }}}{config.relative_path}/category/{./slug}{{{ end }}}" class="text-reset fw-semibold flex-1">{./name}</a>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
{{{ end }}}
|
||||||
|
{{{ end }}}
|
||||||
|
</ul>
|
||||||
|
{{{ end }}}
|
||||||
|
{{{ end }}}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{{ if !./link }}}
|
||||||
|
<div class="d-flex col-lg-5 col-12 align-content-stretch">
|
||||||
|
<div class="meta stats d-none d-lg-grid col-6 gap-1 pe-2 text-muted" style="grid-template-columns: 1fr 1fr;">
|
||||||
|
<div class="card card-header border-0 p-2 overflow-hidden rounded-1 d-flex flex-column align-items-center">
|
||||||
|
<span class="fs-5 ff-secondary lh-1" title="{formattedNumber(./totalTopicCount)}">{humanReadableNumber(./totalTopicCount, 0)}</span>
|
||||||
|
<span class="d-none d-xl-flex text-lowercase text-xs">[[global:topics]]</span>
|
||||||
|
<i class="d-xl-none fa fa-fw text-xs text-muted opacity-75 fa-list"></i>
|
||||||
|
</div>
|
||||||
|
<div class="card card-header border-0 p-2 overflow-hidden rounded-1 d-flex flex-column align-items-center">
|
||||||
|
<span class="fs-5 ff-secondary lh-1" title="{formattedNumber(./totalPostCount)}">{humanReadableNumber(./totalPostCount, 0)}</span>
|
||||||
|
<span class="d-none d-xl-flex text-lowercase text-xs">[[global:posts]]</span>
|
||||||
|
<i class="d-xl-none fa-regular fa-fw text-xs text-muted opacity-75 fa-message"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{{ if !config.hideCategoryLastPost }}}
|
||||||
|
<div component="topic/teaser" class="teaser ps-5 ps-lg-0 col-lg-6 col-12 {{{ if !config.theme.mobileTopicTeasers }}}d-none d-lg-block{{{ end }}}">
|
||||||
|
<!-- IMPORT partials/categories/lastpost.tpl -->
|
||||||
|
</div>
|
||||||
|
{{{ end }}}
|
||||||
|
</div>
|
||||||
|
{{{ end }}}
|
||||||
|
</li>
|
||||||
@@ -0,0 +1,24 @@
|
|||||||
|
<div class="lastpost westgate-lastpost border-start border-2 lh-sm h-100" style="border-color: {./bgColor}!important;">
|
||||||
|
{{{ each ./posts }}}
|
||||||
|
{{{ if @first }}}
|
||||||
|
<div component="category/posts" class="ps-2 text-xs d-flex flex-column h-100 gap-1">
|
||||||
|
<div class="text-nowrap text-truncate">
|
||||||
|
<a class="text-decoration-none avatar-tooltip" title="{./user.displayname}" href="{config.relative_path}/user/{./user.userslug}">{buildAvatar(posts.user, "18px", true)}</a>
|
||||||
|
<a class="permalink text-muted timeago text-xs" href="{config.relative_path}/topic/{./topic.slug}{{{ if ./index }}}/{./index}{{{ end }}}" title="{./timestampISO}" aria-label="[[global:lastpost]]"></a>
|
||||||
|
</div>
|
||||||
|
<div class="post-content text-xs text-break line-clamp-sm-2 lh-sm position-relative flex-fill">
|
||||||
|
<a class="stretched-link" tabindex="-1" href="{config.relative_path}/topic/{./topic.slug}{{{ if ./index }}}/{./index}{{{ end }}}" aria-label="[[global:lastpost]]"></a>
|
||||||
|
{./content}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{{ end }}}
|
||||||
|
{{{ end }}}
|
||||||
|
|
||||||
|
{{{ if !./posts.length }}}
|
||||||
|
<div component="category/posts" class="ps-2">
|
||||||
|
<div class="post-content overflow-hidden text-xs">
|
||||||
|
[[category:no-new-posts]]
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{{ end }}}
|
||||||
|
</div>
|
||||||
@@ -0,0 +1,131 @@
|
|||||||
|
<ul component="category" class="topics-list westgate-topics-list list-unstyled" itemscope itemtype="http://www.schema.org/ItemList" data-nextstart="{nextStart}" data-set="{set}">
|
||||||
|
|
||||||
|
{{{ each topics }}}
|
||||||
|
<li component="category/topic" class="westgate-topic-row category-item hover-parent d-flex flex-column flex-lg-row align-items-start {function.generateTopicClass}" <!-- IMPORT partials/data/category.tpl -->>
|
||||||
|
<link itemprop="url" content="{config.relative_path}/topic/{./slug}" />
|
||||||
|
<meta itemprop="name" content="{function.stripTags, ./title}" />
|
||||||
|
<meta itemprop="itemListOrder" content="descending" />
|
||||||
|
<meta itemprop="position" content="{increment(./index, "1")}" />
|
||||||
|
<a id="{./index}" data-index="{./index}" component="topic/anchor"></a>
|
||||||
|
|
||||||
|
<div class="d-flex p-0 col-12 col-lg-7 gap-2 gap-lg-3 pe-2 align-items-start {{{ if config.theme.mobileTopicTeasers }}}mb-2 mb-lg-0{{{ end }}}">
|
||||||
|
<div class="flex-shrink-0 position-relative">
|
||||||
|
<a class="d-inline-block text-decoration-none avatar-tooltip" title="{./user.displayname}" href="{{{ if ./user.userslug }}}{config.relative_path}/user/{./user.userslug}{{{ else }}}#{{{ end }}}">
|
||||||
|
{buildAvatar(./user, "40px", true)}
|
||||||
|
</a>
|
||||||
|
{{{ if showSelect }}}
|
||||||
|
<div class="checkbox position-absolute top-100 start-50 translate-middle-x pt-2 m-0 d-none d-lg-flex" style="max-width:max-content">
|
||||||
|
<i component="topic/select" class="fa text-muted pointer fa-square-o p-1 hover-visible"></i>
|
||||||
|
</div>
|
||||||
|
{{{ end }}}
|
||||||
|
</div>
|
||||||
|
<div class="flex-grow-1 d-flex flex-wrap gap-1 position-relative">
|
||||||
|
<h3 component="topic/header" class="title text-break text-wrap-pretty fs-5 fw-semibold m-0 tracking-tight w-100 {{{ if showSelect }}}me-4 me-lg-0{{{ end }}}">
|
||||||
|
<a class="text-reset" href="{{{ if topics.noAnchor }}}#{{{ else }}}{config.relative_path}/topic/{./slug}{{{ if ./bookmark }}}/{./bookmark}{{{ end }}}{{{ end }}}">{./title}</a>
|
||||||
|
</h3>
|
||||||
|
<span component="topic/labels" class="d-flex flex-wrap gap-1 w-100">
|
||||||
|
<span component="topic/watched" class="badge border border-gray-300 text-body {{{ if !./followed }}}hidden{{{ end }}}">
|
||||||
|
<i class="fa fa-bell-o"></i>
|
||||||
|
<span>[[topic:watching]]</span>
|
||||||
|
</span>
|
||||||
|
<span component="topic/ignored" class="badge border border-gray-300 text-body {{{ if !./ignored }}}hidden{{{ end }}}">
|
||||||
|
<i class="fa fa-eye-slash"></i>
|
||||||
|
<span>[[topic:ignoring]]</span>
|
||||||
|
</span>
|
||||||
|
<span component="topic/scheduled" class="badge border border-gray-300 text-body {{{ if !./scheduled }}}hidden{{{ end }}}">
|
||||||
|
<i class="fa fa-clock-o"></i>
|
||||||
|
<span>[[topic:scheduled]]</span>
|
||||||
|
</span>
|
||||||
|
<span component="topic/pinned" class="badge border border-gray-300 text-body {{{ if (./scheduled || !./pinned) }}}hidden{{{ end }}}">
|
||||||
|
<i class="fa fa-thumb-tack"></i>
|
||||||
|
<span>{{{ if !./pinExpiry }}}[[topic:pinned]]{{{ else }}}[[topic:pinned-with-expiry, {isoTimeToLocaleString(./pinExpiryISO, config.userLang)}]]{{{ end }}}</span>
|
||||||
|
</span>
|
||||||
|
<span component="topic/locked" class="badge border border-gray-300 text-body {{{ if !./locked }}}hidden{{{ end }}}">
|
||||||
|
<i class="fa fa-lock"></i>
|
||||||
|
<span>[[topic:locked]]</span>
|
||||||
|
</span>
|
||||||
|
<span component="topic/moved" class="badge border border-gray-300 text-body {{{ if (!./oldCid || (./oldCid == "-1")) }}}hidden{{{ end }}}">
|
||||||
|
<i class="fa fa-arrow-circle-right"></i>
|
||||||
|
<span>[[topic:moved]]</span>
|
||||||
|
</span>
|
||||||
|
{{{each ./icons}}}<span class="lh-1">{@value}</span>{{{end}}}
|
||||||
|
|
||||||
|
{{{ if (!template.category || (cid != ./cid)) }}}
|
||||||
|
{buildCategoryLabel(./category, "a", "border")}
|
||||||
|
{{{ end }}}
|
||||||
|
|
||||||
|
<span data-tid="{./tid}" component="topic/tags" class="lh-1 tag-list d-flex flex-wrap gap-1 {{{ if !./tags.length }}}hidden{{{ end }}}">
|
||||||
|
{{{ each ./tags }}}
|
||||||
|
<a href="{config.relative_path}/tags/{./valueEncoded}"><span class="badge border border-gray-300 fw-normal tag tag-class-{./class}" data-tag="{./value}">{./valueEscaped}</span></a>
|
||||||
|
{{{ end }}}
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<div class="d-flex gap-1 d-block d-lg-none w-100">
|
||||||
|
<span class="badge text-body border stats text-xs text-muted">
|
||||||
|
<i class="fa-regular fa-fw fa-message"></i>
|
||||||
|
<span component="topic/post-count" class="fw-normal">{humanReadableNumber(./postcount, 0)}</span>
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<a href="{config.relative_path}/topic/{./slug}{{{ if (./teaser.timestampISO && !config.theme.mobileTopicTeasers) }}}/{./teaser.index}{{{ end }}}" class="border badge bg-transparent text-muted fw-normal timeago" title="{{{ if (./teaser.timestampISO && !config.theme.mobileTopicTeasers) }}}{./teaser.timestampISO}{{{ else }}}{./timestampISO}{{{ end }}}"></a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<a href="{config.relative_path}/topic/{./slug}" class="d-none d-lg-block badge bg-transparent text-muted fw-normal timeago" title="{./timestampISO}"></a>
|
||||||
|
</span>
|
||||||
|
{{{ if showSelect }}}
|
||||||
|
<div class="checkbox position-absolute top-0 end-0 m-0 d-flex d-lg-none" style="max-width:max-content">
|
||||||
|
<i component="topic/select" class="fa fa-square-o text-muted pointer p-1"></i>
|
||||||
|
</div>
|
||||||
|
{{{ end }}}
|
||||||
|
</div>
|
||||||
|
{{{ if ./thumbs.length }}}
|
||||||
|
<a class="topic-thumbs position-relative text-decoration-none flex-shrink-0 d-none d-xl-block" href="{config.relative_path}/topic/{./slug}{{{ if ./bookmark }}}/{./bookmark}{{{ end }}}" aria-label="[[topic:thumb-image]]">
|
||||||
|
<img class="topic-thumb rounded-1 bg-light" style="width:auto;max-width: 5.33rem;height: 3.33rem;object-fit: contain;" src="{./thumbs.0.url}" alt=""/>
|
||||||
|
<span data-numthumbs="{./thumbs.length}" class="px-1 position-absolute bottom-0 end-0 badge rounded-1 opacity-75 fw-semibold text-bg-light" style="margin: 0.125rem; z-index: 1;">{./thumbs.length}</span>
|
||||||
|
</a>
|
||||||
|
{{{ end }}}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="d-flex p-0 col-lg-5 col-12 align-content-stretch">
|
||||||
|
<div class="meta stats d-none d-lg-grid col-6 gap-1 pe-2 text-muted" style="grid-template-columns: {{{ if !reputation:disabled }}}1fr{{{ end }}} 1fr 1fr;">
|
||||||
|
{{{ if !reputation:disabled }}}
|
||||||
|
<div class="stats-votes card card-header border-0 p-2 overflow-hidden rounded-1 d-flex flex-column align-items-center">
|
||||||
|
<span class="fs-5 ff-secondary lh-1" title="{./votes}">{humanReadableNumber(./votes, 0)}</span>
|
||||||
|
<span class="d-none d-xl-flex text-lowercase text-xs">[[global:votes]]</span>
|
||||||
|
<i class="d-xl-none fa fa-fw text-xs text-muted opacity-75 fa-chevron-up"></i>
|
||||||
|
</div>
|
||||||
|
{{{ end }}}
|
||||||
|
<div class="stats-postcount card card-header border-0 p-2 overflow-hidden rounded-1 d-flex flex-column align-items-center">
|
||||||
|
<span class="fs-5 ff-secondary lh-1" title="{./postcount}">{humanReadableNumber(./postcount, 0)}</span>
|
||||||
|
<span class="d-none d-xl-flex text-lowercase text-xs">[[global:posts]]</span>
|
||||||
|
<i class="d-xl-none fa-regular fa-fw text-xs text-muted opacity-75 fa-message"></i>
|
||||||
|
</div>
|
||||||
|
<div class="stats-viewcount card card-header border-0 p-2 overflow-hidden rounded-1 d-flex flex-column align-items-center">
|
||||||
|
<span class="fs-5 ff-secondary lh-1" title="{./viewcount}">{humanReadableNumber(./viewcount, 0)}</span>
|
||||||
|
<span class="d-none d-xl-flex text-lowercase text-xs">[[global:views]]</span>
|
||||||
|
<i class="d-xl-none fa fa-fw text-xs text-muted opacity-75 fa-eye"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div component="topic/teaser" class="meta teaser ps-5 ps-lg-0 col-lg-6 col-12 {{{ if !config.theme.mobileTopicTeasers }}}d-none d-lg-block{{{ end }}}">
|
||||||
|
<div class="lastpost border-start border-2 lh-sm h-100 d-flex flex-column gap-1" style="border-color: {./category.bgColor}!important;">
|
||||||
|
{{{ if ./unreplied }}}
|
||||||
|
<div class="ps-2 text-xs">
|
||||||
|
[[category:no-replies]]
|
||||||
|
</div>
|
||||||
|
{{{ else }}}
|
||||||
|
{{{ if ./teaser.pid }}}
|
||||||
|
<div class="ps-2">
|
||||||
|
<a href="{{{ if ./teaser.user.userslug }}}{config.relative_path}/user/{./teaser.user.userslug}{{{ else }}}#{{{ end }}}" class="text-decoration-none avatar-tooltip" title="{./teaser.user.displayname}">{buildAvatar(./teaser.user, "18px", true)}</a>
|
||||||
|
<a class="permalink text-muted timeago text-xs" href="{config.relative_path}/topic/{./slug}/{./teaser.index}" title="{./teaser.timestampISO}" aria-label="[[global:lastpost]]"></a>
|
||||||
|
</div>
|
||||||
|
<div class="post-content text-xs ps-2 line-clamp-sm-2 lh-sm text-break position-relative flex-fill">
|
||||||
|
<a class="stretched-link" tabindex="-1" href="{config.relative_path}/topic/{./slug}/{./teaser.index}" aria-label="[[global:lastpost]]"></a>
|
||||||
|
{./teaser.content}
|
||||||
|
</div>
|
||||||
|
{{{ end }}}
|
||||||
|
{{{ end }}}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
{{{end}}}
|
||||||
|
</ul>
|
||||||
+7
-3
@@ -1,4 +1,8 @@
|
|||||||
// override harmony font-path
|
|
||||||
$font-path: "./plugins/nodebb-theme-westgate";
|
|
||||||
|
|
||||||
@import "../nodebb-theme-harmony/theme";
|
@import "../nodebb-theme-harmony/theme";
|
||||||
|
@import "./scss/westgate/tokens";
|
||||||
|
@import "./scss/westgate/surfaces";
|
||||||
|
@import "./scss/westgate/categories";
|
||||||
|
@import "./scss/westgate/topics";
|
||||||
|
@import "./scss/westgate/posts";
|
||||||
|
@import "./scss/westgate/controls";
|
||||||
|
@import "./scss/westgate/responsive";
|
||||||
|
|||||||
@@ -186,6 +186,21 @@
|
|||||||
minimatch "^3.0.4"
|
minimatch "^3.0.4"
|
||||||
strip-json-comments "^3.1.1"
|
strip-json-comments "^3.1.1"
|
||||||
|
|
||||||
|
"@fontsource/cinzel@^5.2.8":
|
||||||
|
version "5.2.8"
|
||||||
|
resolved "https://registry.yarnpkg.com/@fontsource/cinzel/-/cinzel-5.2.8.tgz#3f33487cd56e3de642558af0e054a51624747599"
|
||||||
|
integrity sha512-B9WeF/jPlOJOrcXfX96cy4KfM+s1QcU2C9W2hE3azBOBzPvzFkNpBovT5JmhAeicE/s4HZWKF9LF5hmEcqlbsw==
|
||||||
|
|
||||||
|
"@fontsource/ibm-plex-mono@^5.2.7":
|
||||||
|
version "5.2.7"
|
||||||
|
resolved "https://registry.yarnpkg.com/@fontsource/ibm-plex-mono/-/ibm-plex-mono-5.2.7.tgz#1e0ec89cef7b669c624664df018e6d1369e883f1"
|
||||||
|
integrity sha512-MKAb8qV+CaiMQn2B0dIi1OV3565NYzp3WN5b4oT6LTkk+F0jR6j0ZN+5BKJiIhffDC3rtBULsYZE65+0018z9w==
|
||||||
|
|
||||||
|
"@fontsource/jost@^5.2.8":
|
||||||
|
version "5.2.8"
|
||||||
|
resolved "https://registry.yarnpkg.com/@fontsource/jost/-/jost-5.2.8.tgz#0a7f74b796fe7889b30a597950643583203318e0"
|
||||||
|
integrity sha512-PEK7oGJL8r+YZm6BriWhmCql9DhVYTMt0iEQbZHo8mqfIPIZo67Tm68xEIaRA0yB3wsHA7Tm66yMQDIxq3Bjqw==
|
||||||
|
|
||||||
"@humanwhocodes/config-array@^0.9.2":
|
"@humanwhocodes/config-array@^0.9.2":
|
||||||
version "0.9.2"
|
version "0.9.2"
|
||||||
resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.9.2.tgz#68be55c737023009dfc5fe245d51181bb6476914"
|
resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.9.2.tgz#68be55c737023009dfc5fe245d51181bb6476914"
|
||||||
|
|||||||
Reference in New Issue
Block a user