@scalemule/news-publication 0.0.26 → 0.0.27
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.
- package/README.md +7 -0
- package/dist/story-review.cjs +627 -447
- package/dist/story-review.d.cts +2 -1
- package/dist/story-review.d.ts +2 -1
- package/dist/story-review.js +628 -448
- package/package.json +5 -1
- package/story-review.css +330 -33
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@scalemule/news-publication",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.27",
|
|
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",
|
|
@@ -115,9 +115,13 @@
|
|
|
115
115
|
"prepublishOnly": "node -e \"const v=require('./package.json').version; if(!/^0\\.(0|1)\\.\\d+$/.test(v)){console.error('ERR: SDK '+v+' violates patch-only policy (0.0.x or 0.1.x only). See CONTRIBUTING.md SDK versioning section.');process.exit(1)}\" && npm run lint && npm test && npm run build"
|
|
116
116
|
},
|
|
117
117
|
"devDependencies": {
|
|
118
|
+
"@testing-library/react": "^16.3.3",
|
|
118
119
|
"@types/node": "^22.15.0",
|
|
119
120
|
"@types/react": "^19.1.0",
|
|
121
|
+
"@types/react-dom": "^19.3.0",
|
|
122
|
+
"jsdom": "^29.1.1",
|
|
120
123
|
"react": "^19.1.0",
|
|
124
|
+
"react-dom": "^19.3.0",
|
|
121
125
|
"tsup": "^8.5.0",
|
|
122
126
|
"typescript": "^5.8.3",
|
|
123
127
|
"vitest": "^3.2.4"
|
package/story-review.css
CHANGED
|
@@ -1,60 +1,99 @@
|
|
|
1
1
|
.sm-story-review {
|
|
2
|
-
|
|
2
|
+
--pub-paper: #fff;
|
|
3
|
+
--pub-ink: #171917;
|
|
4
|
+
color-scheme: light;
|
|
5
|
+
max-width: 1040px;
|
|
3
6
|
margin: 0 auto;
|
|
4
|
-
padding: 0
|
|
5
|
-
color: var(--
|
|
6
|
-
background: var(--
|
|
7
|
+
padding: 0 32px 64px;
|
|
8
|
+
color: var(--pub-ink, #171917);
|
|
9
|
+
background: var(--pub-paper, #fff);
|
|
7
10
|
font:
|
|
8
|
-
16px/1.65
|
|
11
|
+
16px/1.65 var(--font-editorial),
|
|
12
|
+
Georgia,
|
|
9
13
|
serif;
|
|
10
14
|
}
|
|
11
15
|
.sm-review-private {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
margin: 0 -24px;
|
|
16
|
-
padding: 12px 24px;
|
|
17
|
-
background: #173c5c;
|
|
18
|
-
color: #fff;
|
|
16
|
+
padding: 14px 0;
|
|
17
|
+
border-bottom: 1px solid #d7dcd7;
|
|
18
|
+
color: #545c55;
|
|
19
19
|
font:
|
|
20
|
-
|
|
20
|
+
13px/1.5 var(--font-inter),
|
|
21
|
+
Arial,
|
|
21
22
|
sans-serif;
|
|
22
23
|
display: flex;
|
|
23
24
|
justify-content: space-between;
|
|
24
|
-
gap:
|
|
25
|
+
gap: 8px 24px;
|
|
25
26
|
flex-wrap: wrap;
|
|
26
27
|
}
|
|
28
|
+
.sm-review-private strong {
|
|
29
|
+
color: #171917;
|
|
30
|
+
text-transform: uppercase;
|
|
31
|
+
font-size: 11px;
|
|
32
|
+
letter-spacing: 0.08em;
|
|
33
|
+
}
|
|
27
34
|
.sm-review-masthead {
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
35
|
+
display: flex;
|
|
36
|
+
align-items: center;
|
|
37
|
+
justify-content: center;
|
|
38
|
+
gap: 24px;
|
|
39
|
+
font:
|
|
40
|
+
700 clamp(26px, 4vw, 44px) / 1.1 var(--font-editorial),
|
|
41
|
+
Georgia,
|
|
42
|
+
serif;
|
|
43
|
+
letter-spacing: -0.035em;
|
|
44
|
+
border-bottom: 3px double #171917;
|
|
45
|
+
padding: 28px 0;
|
|
46
|
+
}
|
|
47
|
+
.sm-review-masthead img {
|
|
48
|
+
flex-shrink: 0;
|
|
49
|
+
width: 80px;
|
|
50
|
+
height: 80px;
|
|
33
51
|
}
|
|
34
52
|
.sm-review-intro {
|
|
35
53
|
font:
|
|
36
|
-
|
|
54
|
+
13px/1.6 var(--font-inter),
|
|
55
|
+
Arial,
|
|
37
56
|
sans-serif;
|
|
38
|
-
|
|
39
|
-
|
|
57
|
+
padding: 14px 0;
|
|
58
|
+
display: flex;
|
|
59
|
+
align-items: baseline;
|
|
60
|
+
justify-content: space-between;
|
|
61
|
+
gap: 16px;
|
|
62
|
+
color: #545c55;
|
|
63
|
+
}
|
|
64
|
+
.sm-review-intro p {
|
|
65
|
+
margin: 0;
|
|
66
|
+
}
|
|
67
|
+
.sm-review-intro a {
|
|
68
|
+
color: #171917;
|
|
69
|
+
white-space: nowrap;
|
|
70
|
+
text-underline-offset: 3px;
|
|
40
71
|
}
|
|
41
72
|
.sm-review-article {
|
|
42
|
-
max-width:
|
|
43
|
-
margin:
|
|
73
|
+
max-width: 760px;
|
|
74
|
+
margin: 28px auto 48px;
|
|
44
75
|
}
|
|
45
76
|
.sm-review-article h1 {
|
|
46
|
-
font-
|
|
77
|
+
font-family: var(--font-editorial), Georgia, serif;
|
|
78
|
+
font-weight: 700;
|
|
79
|
+
font-size: clamp(32px, 4.4vw, 48px);
|
|
80
|
+
margin: 12px 0 20px;
|
|
47
81
|
line-height: 1.13;
|
|
48
82
|
letter-spacing: -0.02em;
|
|
49
83
|
}
|
|
50
84
|
.sm-review-dek {
|
|
51
85
|
font-size: 21px;
|
|
52
|
-
color: #
|
|
86
|
+
color: #545c55;
|
|
87
|
+
line-height: 1.5;
|
|
88
|
+
margin: 0 0 28px;
|
|
53
89
|
}
|
|
54
90
|
.sm-review-prose {
|
|
55
91
|
font-size: 19px;
|
|
56
92
|
line-height: 1.8;
|
|
57
93
|
}
|
|
94
|
+
.sm-review-prose p {
|
|
95
|
+
margin: 0 0 1.35em;
|
|
96
|
+
}
|
|
58
97
|
.sm-review-prose img,
|
|
59
98
|
.sm-review-prose iframe {
|
|
60
99
|
display: none;
|
|
@@ -81,8 +120,8 @@
|
|
|
81
120
|
display: flex;
|
|
82
121
|
gap: 8px;
|
|
83
122
|
flex-wrap: wrap;
|
|
84
|
-
border-top:
|
|
85
|
-
background: #
|
|
123
|
+
border-top: 1px solid #d7dcd7;
|
|
124
|
+
background: #fff;
|
|
86
125
|
padding: 14px;
|
|
87
126
|
z-index: 10;
|
|
88
127
|
}
|
|
@@ -91,10 +130,10 @@
|
|
|
91
130
|
600 14px/1.4 system-ui,
|
|
92
131
|
sans-serif;
|
|
93
132
|
padding: 10px 14px;
|
|
94
|
-
border: 1px solid #
|
|
133
|
+
border: 1px solid #a2aaa2;
|
|
95
134
|
border-radius: 4px;
|
|
96
135
|
background: #fff;
|
|
97
|
-
color: #
|
|
136
|
+
color: #171917;
|
|
98
137
|
cursor: pointer;
|
|
99
138
|
}
|
|
100
139
|
.sm-story-review button:disabled {
|
|
@@ -102,17 +141,17 @@
|
|
|
102
141
|
cursor: default;
|
|
103
142
|
}
|
|
104
143
|
.sm-story-review button:hover:not(:disabled) {
|
|
105
|
-
background: #
|
|
144
|
+
background: #f5f6f3;
|
|
106
145
|
}
|
|
107
146
|
.sm-story-review :focus-visible {
|
|
108
147
|
outline: 3px solid #2276b1;
|
|
109
148
|
outline-offset: 3px;
|
|
110
149
|
}
|
|
111
150
|
.sm-review-form {
|
|
112
|
-
scroll-margin-top:
|
|
151
|
+
scroll-margin-top: 20px;
|
|
113
152
|
margin-top: 24px;
|
|
114
153
|
padding: 24px;
|
|
115
|
-
border: 1px solid #
|
|
154
|
+
border: 1px solid #d7dcd7;
|
|
116
155
|
font-family: system-ui, sans-serif;
|
|
117
156
|
}
|
|
118
157
|
.sm-review-form-heading {
|
|
@@ -236,3 +275,261 @@
|
|
|
236
275
|
max-width: 100%;
|
|
237
276
|
max-height: 70vh;
|
|
238
277
|
}
|
|
278
|
+
|
|
279
|
+
/* Match the publication's reading face and restrained red newspaper identity. */
|
|
280
|
+
.sm-story-review {
|
|
281
|
+
box-sizing: border-box;
|
|
282
|
+
min-height: 100dvh;
|
|
283
|
+
overflow-wrap: anywhere;
|
|
284
|
+
}
|
|
285
|
+
.sm-story-review *,
|
|
286
|
+
.sm-story-review *::before,
|
|
287
|
+
.sm-story-review *::after {
|
|
288
|
+
box-sizing: border-box;
|
|
289
|
+
}
|
|
290
|
+
.sm-review-category {
|
|
291
|
+
display: flex;
|
|
292
|
+
gap: 12px;
|
|
293
|
+
font:
|
|
294
|
+
700 12px/1.4 var(--font-inter),
|
|
295
|
+
Arial,
|
|
296
|
+
sans-serif;
|
|
297
|
+
text-transform: uppercase;
|
|
298
|
+
letter-spacing: 0.09em;
|
|
299
|
+
}
|
|
300
|
+
.sm-review-category span:first-child {
|
|
301
|
+
color: #bb171d;
|
|
302
|
+
}
|
|
303
|
+
.sm-review-category span + span {
|
|
304
|
+
border-left: 1px solid #d7dcd7;
|
|
305
|
+
padding-left: 12px;
|
|
306
|
+
color: #545c55;
|
|
307
|
+
}
|
|
308
|
+
.sm-review-photo-invitation {
|
|
309
|
+
display: flex;
|
|
310
|
+
align-items: center;
|
|
311
|
+
justify-content: space-between;
|
|
312
|
+
gap: 20px;
|
|
313
|
+
margin: 28px 0 32px;
|
|
314
|
+
padding: 20px 22px;
|
|
315
|
+
background: #f5f6f3;
|
|
316
|
+
border-left: 2px solid #d7dcd7;
|
|
317
|
+
font:
|
|
318
|
+
13px/1.6 var(--font-inter),
|
|
319
|
+
Arial,
|
|
320
|
+
sans-serif;
|
|
321
|
+
color: #545c55;
|
|
322
|
+
}
|
|
323
|
+
.sm-review-photo-invitation p {
|
|
324
|
+
margin: 3px 0 0;
|
|
325
|
+
}
|
|
326
|
+
.sm-review-photo-invitation strong {
|
|
327
|
+
color: #171917;
|
|
328
|
+
font-weight: 600;
|
|
329
|
+
}
|
|
330
|
+
.sm-review-photo-invitation button {
|
|
331
|
+
flex-shrink: 0;
|
|
332
|
+
font-size: 13px;
|
|
333
|
+
}
|
|
334
|
+
.sm-review-welcome,
|
|
335
|
+
.sm-review-thanks {
|
|
336
|
+
max-width: 760px;
|
|
337
|
+
margin: 36px auto;
|
|
338
|
+
padding: 28px 0;
|
|
339
|
+
border-top: 2px solid #171917;
|
|
340
|
+
font:
|
|
341
|
+
16px/1.7 var(--font-inter),
|
|
342
|
+
Arial,
|
|
343
|
+
sans-serif;
|
|
344
|
+
scroll-margin-top: 24px;
|
|
345
|
+
}
|
|
346
|
+
.sm-review-welcome h2,
|
|
347
|
+
.sm-review-thanks h2 {
|
|
348
|
+
margin: 0 0 16px;
|
|
349
|
+
font:
|
|
350
|
+
600 28px/1.2 var(--font-editorial),
|
|
351
|
+
Georgia,
|
|
352
|
+
serif;
|
|
353
|
+
}
|
|
354
|
+
.sm-review-welcome p,
|
|
355
|
+
.sm-review-thanks p {
|
|
356
|
+
margin: 0 0 16px;
|
|
357
|
+
}
|
|
358
|
+
.sm-review-welcome button + button,
|
|
359
|
+
.sm-review-form button + button {
|
|
360
|
+
margin-left: 10px;
|
|
361
|
+
}
|
|
362
|
+
.sm-story-review .sm-review-primary {
|
|
363
|
+
background: #bb171d;
|
|
364
|
+
border-color: #bb171d;
|
|
365
|
+
color: #fff;
|
|
366
|
+
}
|
|
367
|
+
.sm-story-review .sm-review-primary:hover:not(:disabled) {
|
|
368
|
+
background: #991419;
|
|
369
|
+
}
|
|
370
|
+
.sm-story-review .sm-review-quiet {
|
|
371
|
+
background: transparent;
|
|
372
|
+
border-color: transparent;
|
|
373
|
+
font-weight: 400;
|
|
374
|
+
text-decoration: underline;
|
|
375
|
+
text-underline-offset: 3px;
|
|
376
|
+
}
|
|
377
|
+
.sm-review-celebration {
|
|
378
|
+
padding-bottom: 120px;
|
|
379
|
+
}
|
|
380
|
+
.sm-review-concierge-actions {
|
|
381
|
+
position: fixed;
|
|
382
|
+
bottom: 0;
|
|
383
|
+
left: 0;
|
|
384
|
+
right: 0;
|
|
385
|
+
max-width: 1040px;
|
|
386
|
+
margin: auto;
|
|
387
|
+
justify-content: center;
|
|
388
|
+
padding: 16px 24px max(16px, env(safe-area-inset-bottom));
|
|
389
|
+
box-shadow: 0 -4px 20px #17191708;
|
|
390
|
+
}
|
|
391
|
+
.sm-review-concierge-actions button {
|
|
392
|
+
min-height: 44px;
|
|
393
|
+
}
|
|
394
|
+
.sm-review-actions-editing.sm-review-concierge-actions {
|
|
395
|
+
display: none;
|
|
396
|
+
}
|
|
397
|
+
.sm-review-form {
|
|
398
|
+
max-width: 760px;
|
|
399
|
+
margin: 24px auto;
|
|
400
|
+
}
|
|
401
|
+
.sm-review-form-heading h2 {
|
|
402
|
+
margin: 0;
|
|
403
|
+
}
|
|
404
|
+
.sm-review-form-heading {
|
|
405
|
+
margin-bottom: 24px;
|
|
406
|
+
}
|
|
407
|
+
.sm-review-form-heading > button {
|
|
408
|
+
flex-shrink: 0;
|
|
409
|
+
white-space: nowrap;
|
|
410
|
+
}
|
|
411
|
+
.sm-review-form textarea {
|
|
412
|
+
resize: vertical;
|
|
413
|
+
min-height: 88px;
|
|
414
|
+
}
|
|
415
|
+
.sm-review-form input[type="checkbox"] {
|
|
416
|
+
width: 20px;
|
|
417
|
+
height: 20px;
|
|
418
|
+
flex-shrink: 0;
|
|
419
|
+
accent-color: #bb171d;
|
|
420
|
+
}
|
|
421
|
+
.sm-review-form button {
|
|
422
|
+
margin-top: 8px;
|
|
423
|
+
}
|
|
424
|
+
.sm-review-form button[type="submit"],
|
|
425
|
+
.sm-review-form input[type="file"] {
|
|
426
|
+
min-height: 44px;
|
|
427
|
+
}
|
|
428
|
+
.sm-review-form summary {
|
|
429
|
+
cursor: pointer;
|
|
430
|
+
padding: 14px 0;
|
|
431
|
+
font-size: 14px;
|
|
432
|
+
text-decoration: underline;
|
|
433
|
+
text-underline-offset: 3px;
|
|
434
|
+
}
|
|
435
|
+
.sm-review-help {
|
|
436
|
+
font-size: 14px;
|
|
437
|
+
color: #545c55;
|
|
438
|
+
}
|
|
439
|
+
.sm-review-thanks {
|
|
440
|
+
border-top-color: #2c644b;
|
|
441
|
+
padding: 24px;
|
|
442
|
+
background: #eef6f1;
|
|
443
|
+
}
|
|
444
|
+
.sm-review-utilities {
|
|
445
|
+
max-width: 760px;
|
|
446
|
+
margin: 16px auto;
|
|
447
|
+
display: flex;
|
|
448
|
+
gap: 12px;
|
|
449
|
+
}
|
|
450
|
+
.sm-review-contributions {
|
|
451
|
+
max-width: 760px;
|
|
452
|
+
margin: 32px auto;
|
|
453
|
+
}
|
|
454
|
+
@media (max-width: 600px) {
|
|
455
|
+
.sm-review-private {
|
|
456
|
+
margin: 0;
|
|
457
|
+
padding: 12px 0;
|
|
458
|
+
display: block;
|
|
459
|
+
font-size: 12px;
|
|
460
|
+
}
|
|
461
|
+
.sm-review-private span {
|
|
462
|
+
display: block;
|
|
463
|
+
margin-top: 4px;
|
|
464
|
+
}
|
|
465
|
+
.sm-review-masthead {
|
|
466
|
+
gap: 16px;
|
|
467
|
+
padding: 24px 0;
|
|
468
|
+
font-size: 28px;
|
|
469
|
+
}
|
|
470
|
+
.sm-review-masthead img {
|
|
471
|
+
width: 60px;
|
|
472
|
+
height: 60px;
|
|
473
|
+
}
|
|
474
|
+
.sm-review-intro {
|
|
475
|
+
font-size: 12px;
|
|
476
|
+
align-items: flex-start;
|
|
477
|
+
}
|
|
478
|
+
.sm-review-article {
|
|
479
|
+
margin: 24px auto 32px;
|
|
480
|
+
}
|
|
481
|
+
.sm-review-article h1 {
|
|
482
|
+
font-size: 34px;
|
|
483
|
+
line-height: 1.15;
|
|
484
|
+
}
|
|
485
|
+
.sm-review-dek {
|
|
486
|
+
font-size: 19px;
|
|
487
|
+
}
|
|
488
|
+
.sm-review-prose {
|
|
489
|
+
font-size: 18px;
|
|
490
|
+
line-height: 1.8;
|
|
491
|
+
}
|
|
492
|
+
.sm-review-photo-invitation {
|
|
493
|
+
display: block;
|
|
494
|
+
padding: 18px;
|
|
495
|
+
}
|
|
496
|
+
.sm-review-photo-invitation button {
|
|
497
|
+
margin-top: 12px;
|
|
498
|
+
}
|
|
499
|
+
.sm-review-celebration {
|
|
500
|
+
padding-bottom: 148px;
|
|
501
|
+
}
|
|
502
|
+
.sm-review-concierge-actions {
|
|
503
|
+
display: grid;
|
|
504
|
+
grid-template-columns: 1fr 1fr;
|
|
505
|
+
padding: 12px 16px max(12px, env(safe-area-inset-bottom));
|
|
506
|
+
}
|
|
507
|
+
.sm-review-concierge-actions .sm-review-primary {
|
|
508
|
+
grid-column: 1 / -1;
|
|
509
|
+
}
|
|
510
|
+
.sm-review-welcome h2 {
|
|
511
|
+
font-size: 27px;
|
|
512
|
+
}
|
|
513
|
+
.sm-review-welcome button {
|
|
514
|
+
margin-bottom: 8px;
|
|
515
|
+
}
|
|
516
|
+
.sm-review-form input:not([type="checkbox"]),
|
|
517
|
+
.sm-review-form textarea,
|
|
518
|
+
.sm-review-form select {
|
|
519
|
+
font-size: 16px;
|
|
520
|
+
}
|
|
521
|
+
}
|
|
522
|
+
@media print {
|
|
523
|
+
.sm-review-concierge-actions,
|
|
524
|
+
.sm-review-welcome,
|
|
525
|
+
.sm-review-utilities,
|
|
526
|
+
.sm-review-intro,
|
|
527
|
+
.sm-review-photo-invitation {
|
|
528
|
+
display: none;
|
|
529
|
+
}
|
|
530
|
+
}
|
|
531
|
+
@media (prefers-reduced-motion: reduce) {
|
|
532
|
+
html {
|
|
533
|
+
scroll-behavior: auto;
|
|
534
|
+
}
|
|
535
|
+
}
|