@scalemule/news-publication 0.0.10 → 0.0.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -417,3 +417,134 @@
417
417
  align-items: center;
418
418
  gap: 0.75rem;
419
419
  }
420
+
421
+ /* ==========================================================================
422
+ Dark Theme (Evening Edition) support
423
+ ========================================================================== */
424
+ :root[data-theme="dark"] .sm-cookie-banner-card,
425
+ [data-theme="dark"] .sm-cookie-banner-card,
426
+ .publication[data-theme="dark"] .sm-cookie-banner-card {
427
+ background: rgba(22, 26, 23, 0.96);
428
+ border-color: rgba(255, 255, 255, 0.12);
429
+ color: #eaece8;
430
+ box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(255, 255, 255, 0.08);
431
+ }
432
+
433
+ :root[data-theme="dark"] .sm-cookie-banner-title,
434
+ [data-theme="dark"] .sm-cookie-banner-title,
435
+ .publication[data-theme="dark"] .sm-cookie-banner-title {
436
+ color: #ffffff;
437
+ }
438
+
439
+ :root[data-theme="dark"] .sm-cookie-banner-text,
440
+ [data-theme="dark"] .sm-cookie-banner-text,
441
+ .publication[data-theme="dark"] .sm-cookie-banner-text {
442
+ color: #c5cbc6;
443
+ }
444
+
445
+ :root[data-theme="dark"] .sm-cookie-banner-link,
446
+ [data-theme="dark"] .sm-cookie-banner-link,
447
+ .publication[data-theme="dark"] .sm-cookie-banner-link {
448
+ color: #ffffff;
449
+ }
450
+
451
+ :root[data-theme="dark"] .sm-cookie-btn-secondary,
452
+ [data-theme="dark"] .sm-cookie-btn-secondary,
453
+ .publication[data-theme="dark"] .sm-cookie-btn-secondary {
454
+ background: rgba(255, 255, 255, 0.1);
455
+ color: #ffffff;
456
+ border-color: rgba(255, 255, 255, 0.18);
457
+ }
458
+
459
+ :root[data-theme="dark"] .sm-cookie-btn-secondary:hover,
460
+ [data-theme="dark"] .sm-cookie-btn-secondary:hover,
461
+ .publication[data-theme="dark"] .sm-cookie-btn-secondary:hover {
462
+ background: rgba(255, 255, 255, 0.18);
463
+ border-color: rgba(255, 255, 255, 0.3);
464
+ }
465
+
466
+ :root[data-theme="dark"] .sm-cookie-details-modal,
467
+ [data-theme="dark"] .sm-cookie-details-modal,
468
+ .publication[data-theme="dark"] .sm-cookie-details-modal {
469
+ background: #161a17;
470
+ color: #eaece8;
471
+ border: 1px solid rgba(255, 255, 255, 0.12);
472
+ }
473
+
474
+ :root[data-theme="dark"] .sm-cookie-details-header,
475
+ [data-theme="dark"] .sm-cookie-details-header,
476
+ .publication[data-theme="dark"] .sm-cookie-details-header {
477
+ border-bottom-color: #29302a;
478
+ }
479
+
480
+ :root[data-theme="dark"] .sm-cookie-details-title,
481
+ [data-theme="dark"] .sm-cookie-details-title,
482
+ .publication[data-theme="dark"] .sm-cookie-details-title {
483
+ color: #ffffff;
484
+ }
485
+
486
+ :root[data-theme="dark"] .sm-cookie-details-close,
487
+ [data-theme="dark"] .sm-cookie-details-close,
488
+ .publication[data-theme="dark"] .sm-cookie-details-close {
489
+ color: #959e96;
490
+ }
491
+
492
+ :root[data-theme="dark"] .sm-cookie-details-close:hover,
493
+ [data-theme="dark"] .sm-cookie-details-close:hover,
494
+ .publication[data-theme="dark"] .sm-cookie-details-close:hover {
495
+ background: rgba(255, 255, 255, 0.08);
496
+ color: #ffffff;
497
+ }
498
+
499
+ :root[data-theme="dark"] .sm-cookie-category,
500
+ [data-theme="dark"] .sm-cookie-category,
501
+ .publication[data-theme="dark"] .sm-cookie-category {
502
+ background: #1a1e1b;
503
+ border-color: #29302a;
504
+ }
505
+
506
+ :root[data-theme="dark"] .sm-cookie-cat-title,
507
+ [data-theme="dark"] .sm-cookie-cat-title,
508
+ .publication[data-theme="dark"] .sm-cookie-cat-title {
509
+ color: #ffffff;
510
+ }
511
+
512
+ :root[data-theme="dark"] .sm-cookie-cat-desc,
513
+ [data-theme="dark"] .sm-cookie-cat-desc,
514
+ .publication[data-theme="dark"] .sm-cookie-cat-desc {
515
+ color: #959e96;
516
+ }
517
+
518
+ :root[data-theme="dark"] .sm-cookie-table-wrapper,
519
+ [data-theme="dark"] .sm-cookie-table-wrapper,
520
+ .publication[data-theme="dark"] .sm-cookie-table-wrapper {
521
+ border-color: #29302a;
522
+ }
523
+
524
+ :root[data-theme="dark"] .sm-cookie-table th,
525
+ [data-theme="dark"] .sm-cookie-table th,
526
+ .publication[data-theme="dark"] .sm-cookie-table th {
527
+ background: #131514;
528
+ color: #959e96;
529
+ border-bottom-color: #29302a;
530
+ }
531
+
532
+ :root[data-theme="dark"] .sm-cookie-table td,
533
+ [data-theme="dark"] .sm-cookie-table td,
534
+ .publication[data-theme="dark"] .sm-cookie-table td {
535
+ color: #eaece8;
536
+ border-bottom-color: #29302a;
537
+ }
538
+
539
+ :root[data-theme="dark"] .sm-cookie-code,
540
+ [data-theme="dark"] .sm-cookie-code,
541
+ .publication[data-theme="dark"] .sm-cookie-code {
542
+ background: #252b27;
543
+ color: #ffffff;
544
+ }
545
+
546
+ :root[data-theme="dark"] .sm-cookie-save-bar,
547
+ [data-theme="dark"] .sm-cookie-save-bar,
548
+ .publication[data-theme="dark"] .sm-cookie-save-bar {
549
+ border-top-color: #29302a;
550
+ }
package/marketplace.css CHANGED
@@ -1,24 +1,49 @@
1
- .np-market { max-width: 820px; }
1
+ /* ScaleMule News Publication - Marketplace (Jobs & Classifieds) */
2
+ .np-market { max-width: 820px; color: var(--pub-ink, #171917); }
2
3
  .np-market h1 {
3
4
  font: 600 clamp(36px, 4vw, 52px)/1.08 var(--pub-serif);
4
5
  letter-spacing: -0.03em;
5
6
  margin: 0 0 12px;
7
+ color: var(--pub-ink, #171917);
6
8
  }
7
9
  .np-market .lead { max-width: 62ch; font: 18px/1.65 var(--pub-serif); color: var(--pub-muted, #545c55); margin: 0 0 28px; }
8
10
  .np-market .actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 28px; }
9
11
  .np-market .primary, .np-market .secondary {
10
12
  display: inline-flex;
11
13
  align-items: center;
14
+ justify-content: center;
12
15
  min-height: 44px;
13
- padding: 10px 16px;
16
+ padding: 10px 18px;
14
17
  font: 700 13px/1.2 var(--pub-sans);
15
18
  text-decoration: none;
16
19
  cursor: pointer;
20
+ border-radius: 3px;
21
+ transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
22
+ }
23
+ .np-market .primary {
24
+ background: var(--pub-accent, #bb171d);
25
+ color: #ffffff;
26
+ border: 1px solid var(--pub-accent, #bb171d);
27
+ }
28
+ .np-market .secondary {
29
+ background: var(--pub-soft, #f5f6f3);
30
+ color: var(--pub-ink, #171917);
31
+ border: 1px solid var(--pub-rule, #d7dcd7);
32
+ }
33
+ .np-market .primary:hover {
34
+ background: var(--pub-paper, #ffffff);
35
+ color: var(--pub-accent, #bb171d);
36
+ border-color: var(--pub-accent, #bb171d);
37
+ }
38
+ .np-market .secondary:hover {
39
+ background: var(--pub-paper, #ffffff);
40
+ color: var(--pub-accent, #bb171d);
41
+ border-color: var(--pub-accent, #bb171d);
42
+ }
43
+ .np-market .primary:disabled, .np-market .secondary:disabled {
44
+ opacity: 0.65;
45
+ cursor: wait;
17
46
  }
18
- .np-market .primary { background: var(--pub-accent, #bb171d); color: #fff; border: 0; }
19
- .np-market .secondary { background: #fff; color: var(--pub-ink, #171917); border: 1px solid var(--pub-ink, #171917); }
20
- .np-market .primary:hover, .np-market .secondary:hover { color: var(--pub-accent, #bb171d); }
21
- .np-market .primary:hover { background: #fff; border: 1px solid var(--pub-accent, #bb171d); }
22
47
  .np-market .list { display: grid; }
23
48
  .np-market .item {
24
49
  display: block;
@@ -27,37 +52,72 @@
27
52
  text-decoration: none;
28
53
  color: inherit;
29
54
  }
30
- .np-market .item h2 { font: 600 26px/1.2 var(--pub-serif); margin: 0 0 6px; }
55
+ .np-market .item h2 { font: 600 26px/1.2 var(--pub-serif); margin: 0 0 6px; color: var(--pub-ink, #171917); }
31
56
  .np-market .item:hover h2 { color: var(--pub-accent, #bb171d); text-decoration: underline; text-underline-offset: 4px; }
32
57
  .np-market .meta { font: 13px/1.5 var(--pub-sans); color: var(--pub-muted, #545c55); }
33
58
  .np-market .meta a:hover { color: var(--pub-accent, #bb171d); }
34
- .np-market .body { white-space: pre-wrap; font: 18px/1.65 var(--pub-serif); }
59
+ .np-market .body { white-space: pre-wrap; font: 18px/1.65 var(--pub-serif); color: var(--pub-ink, #171917); }
35
60
  .np-market .search { display: flex; gap: 8px; margin: 0 0 20px; }
36
- .np-market .search input { flex: 1; min-height: 44px; border: 1px solid #8a918b; padding: 10px 12px; font: 16px/1.4 var(--pub-sans); }
61
+ .np-market .search input {
62
+ flex: 1;
63
+ min-height: 44px;
64
+ border: 1px solid var(--pub-rule, #8a918b);
65
+ padding: 10px 14px;
66
+ font: 16px/1.4 var(--pub-sans);
67
+ background: var(--pub-paper, #ffffff);
68
+ color: var(--pub-ink, #171917);
69
+ border-radius: 3px;
70
+ }
71
+ .np-market .search input:focus-visible {
72
+ outline: 3px solid #a95c00;
73
+ outline-offset: 2px;
74
+ border-color: var(--pub-ink, #171917);
75
+ }
37
76
  .np-market .form { display: grid; gap: 14px; max-width: 560px; }
38
- .np-market .form label { display: grid; gap: 6px; font: 700 13px/1.3 var(--pub-sans); }
77
+ .np-market .form label { display: grid; gap: 6px; font: 700 13px/1.3 var(--pub-sans); color: var(--pub-ink, #171917); }
39
78
  .np-market .form input, .np-market .form select, .np-market .form textarea {
40
79
  min-height: 44px;
41
- border: 1px solid #8a918b;
80
+ border: 1px solid var(--pub-rule, #8a918b);
42
81
  padding: 10px 12px;
43
82
  font: 16px/1.4 var(--pub-sans);
44
- background: #fff;
45
- color: inherit;
83
+ background: var(--pub-paper, #ffffff);
84
+ color: var(--pub-ink, #171917);
85
+ border-radius: 3px;
86
+ }
87
+ .np-market .form input:focus-visible, .np-market .form select:focus-visible, .np-market .form textarea:focus-visible {
88
+ outline: 3px solid #a95c00;
89
+ outline-offset: 2px;
90
+ border-color: var(--pub-ink, #171917);
46
91
  }
47
92
  .np-market .form textarea { min-height: 140px; resize: vertical; }
48
93
  .np-market .error { color: var(--pub-accent, #bb171d); font: 14px/1.4 var(--pub-sans); }
49
94
  .np-market .empty { border-block: 1px solid var(--pub-rule, #d7dcd7); padding: 32px 0; max-width: 640px; }
50
- .np-market .empty h2 { font: 600 28px/1.15 var(--pub-serif); }
95
+ .np-market .empty h2 { font: 600 28px/1.15 var(--pub-serif); color: var(--pub-ink, #171917); }
51
96
  .np-market .filter { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 20px; }
52
97
  .np-market .filter a {
98
+ display: inline-flex;
99
+ align-items: center;
53
100
  min-height: 36px;
54
- padding: 6px 10px;
101
+ padding: 6px 14px;
55
102
  border: 1px solid var(--pub-rule, #d7dcd7);
56
- background: #fff;
103
+ background: var(--pub-soft, #f5f6f3);
57
104
  font: 13px/1.4 var(--pub-sans);
58
105
  text-decoration: none;
59
- color: inherit;
106
+ color: var(--pub-ink, #171917);
107
+ border-radius: 3px;
108
+ transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
109
+ }
110
+ .np-market .filter a:hover {
111
+ background: var(--pub-paper, #ffffff);
112
+ border-color: var(--pub-accent, #bb171d);
113
+ color: var(--pub-accent, #bb171d);
114
+ }
115
+ .np-market .filter a.on {
116
+ background: var(--pub-paper, #ffffff);
117
+ border-color: var(--pub-accent, #bb171d);
118
+ color: var(--pub-accent, #bb171d);
119
+ font-weight: 700;
120
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
60
121
  }
61
- .np-market .filter a.on, .np-market .filter a:hover { border-color: var(--pub-ink, #171917); color: var(--pub-accent, #bb171d); }
62
122
  .np-market .deals { margin: 0 0 28px; }
63
- .np-market .deals h2 { font: 600 22px/1.2 var(--pub-serif); margin: 0 0 8px; }
123
+ .np-market .deals h2 { font: 600 22px/1.2 var(--pub-serif); margin: 0 0 8px; color: var(--pub-ink, #171917); }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@scalemule/news-publication",
3
- "version": "0.0.10",
3
+ "version": "0.0.11",
4
4
  "description": "Shared server framework for ScaleMule local news publications. Walnut Creek Times is the broadsheet default; each paper supplies its own identity and feature flags.",
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",
@@ -58,6 +58,12 @@
58
58
  --pub-soft: #f5f6f3;
59
59
  --pub-sponsor: #173d32;
60
60
  --pub-selection-bg: #f6dcdd;
61
+ --pub-tag-topic-bg: #ffffff;
62
+ --pub-tag-topic-text: #4b5563;
63
+ --pub-tag-topic-border: #e2ded4;
64
+ --pub-tag-hood-bg: #f4f7f5;
65
+ --pub-tag-hood-text: #1a4237;
66
+ --pub-tag-hood-border: #cadcd3;
61
67
  }
62
68
 
63
69
  /* Broadsheet Evening Edition: Dark Mode */
@@ -72,6 +78,12 @@
72
78
  --pub-soft: #1a1e1b;
73
79
  --pub-sponsor: #244b3e;
74
80
  --pub-selection-bg: #52191d;
81
+ --pub-tag-topic-bg: #1c211e;
82
+ --pub-tag-topic-text: #c5cbc6;
83
+ --pub-tag-topic-border: #323b34;
84
+ --pub-tag-hood-bg: rgba(36, 75, 62, 0.35);
85
+ --pub-tag-hood-text: #8ed6b2;
86
+ --pub-tag-hood-border: #2a5242;
75
87
  }
76
88
 
77
89
  /* System Preference Mode (Default when not explicitly forced) */
@@ -86,6 +98,12 @@
86
98
  --pub-soft: #1a1e1b;
87
99
  --pub-sponsor: #244b3e;
88
100
  --pub-selection-bg: #52191d;
101
+ --pub-tag-topic-bg: #1c211e;
102
+ --pub-tag-topic-text: #c5cbc6;
103
+ --pub-tag-topic-border: #323b34;
104
+ --pub-tag-hood-bg: rgba(36, 75, 62, 0.35);
105
+ --pub-tag-hood-text: #8ed6b2;
106
+ --pub-tag-hood-border: #2a5242;
89
107
  }
90
108
  }
91
109
 
@@ -101,6 +119,16 @@
101
119
  }
102
120
  .publication [id] { scroll-margin-top: 24px; }
103
121
  .publication ::selection { background: var(--pub-selection-bg, #f6dcdd); color: var(--pub-ink); }
122
+
123
+ /* Base broadsheet form & input styles */
124
+ .publication input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
125
+ .publication select,
126
+ .publication textarea {
127
+ background-color: var(--pub-paper);
128
+ color: var(--pub-ink);
129
+ border: 1px solid var(--pub-rule);
130
+ }
131
+
104
132
  @media (min-width: 960px) {
105
133
  .publication { --pub-width: 1280px; }
106
134
  }