archvillainette
882c086a6d
first pass with impeccable Reviewed-on: #18 Reviewed-by: xtul <mpiasecki720@protonmail.com> Co-authored-by: vickydotbat <vickydotbat@tutamail.com> Co-committed-by: vickydotbat <vickydotbat@tutamail.com>
422 lines
14 KiB
SCSS
422 lines
14 KiB
SCSS
body.template-category .category-header {
|
|
padding: 1rem;
|
|
}
|
|
|
|
body.template-category .category-header .icon {
|
|
border-radius: 6px !important;
|
|
}
|
|
|
|
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: var(--wg-space-xs) !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: var(--wg-space-sm);
|
|
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: var(--wg-space-md) !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% var(--wg-ledger-line), auto, auto;
|
|
border: 1px solid var(--wg-ledger-border) !important;
|
|
border-left: 1px 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"]::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% var(--wg-ledger-line), 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) !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: var(--wg-space-sm) !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) !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) !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"],
|
|
li[component="category/topic"] [component="topic/tags"],
|
|
li[component="category/topic"] .timeago,
|
|
li[component="category/topic"] .permalink {
|
|
font-family: var(--wg-font-ui);
|
|
font-weight: 600;
|
|
letter-spacing: 0;
|
|
}
|
|
|
|
li[component="category/topic"] [component="topic/labels"] .badge {
|
|
letter-spacing: 0.015em;
|
|
text-transform: uppercase;
|
|
font-weight: 600 !important;
|
|
}
|
|
|
|
// timestamps are data, not labels — the Engraving Rule keeps them plain
|
|
li[component="category/topic"] [component="topic/labels"] .badge.timeago {
|
|
letter-spacing: 0;
|
|
text-transform: none;
|
|
}
|
|
|
|
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;
|
|
gap: 0.28rem;
|
|
padding: 0.22rem 0.48rem 0.22rem 0.42rem;
|
|
text-transform: none;
|
|
}
|
|
|
|
li[component="category/topic"] .tag i,
|
|
li[component="category/topic"] .tag-item i,
|
|
.tag-list .tag i {
|
|
color: #d8c28a;
|
|
font-size: 0.68rem;
|
|
opacity: 0.88;
|
|
}
|
|
|
|
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;
|
|
padding: var(--wg-space-2xs) var(--wg-space-xs);
|
|
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) !important;
|
|
}
|
|
|
|
li[component="category/topic"] .meta.stats .fs-5,
|
|
li[component="category/topic"] .meta.stats .ff-secondary {
|
|
color: var(--wg-text) !important;
|
|
font-size: 1.1rem !important;
|
|
}
|
|
|
|
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);
|
|
font-weight: 600;
|
|
}
|
|
|
|
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);
|
|
}
|
|
|
|
// Harmony marks teasers with .border-2 + .lh-sm: keep the gilt edge at 1px
|
|
// and give the clamped teaser text breathing room
|
|
.lastpost.border-2 {
|
|
border-width: 1px !important;
|
|
}
|
|
|
|
.lastpost.lh-sm,
|
|
.lastpost .lh-sm {
|
|
line-height: 1.35 !important;
|
|
}
|
|
|
|
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);
|
|
}
|