@scalemule/news-publication 0.0.25 → 0.0.26

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@scalemule/news-publication",
3
- "version": "0.0.25",
3
+ "version": "0.0.26",
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",
@@ -80,7 +80,13 @@
80
80
  "import": "./dist/verified-card.js",
81
81
  "require": "./dist/verified-card.cjs"
82
82
  },
83
- "./verified-card.css": "./verified-card.css"
83
+ "./verified-card.css": "./verified-card.css",
84
+ "./story-review": {
85
+ "types": "./dist/story-review.d.ts",
86
+ "import": "./dist/story-review.js",
87
+ "require": "./dist/story-review.cjs"
88
+ },
89
+ "./story-review.css": "./story-review.css"
84
90
  },
85
91
  "files": [
86
92
  "dist",
@@ -89,7 +95,8 @@
89
95
  "cookie-consent.css",
90
96
  "verified-card.css",
91
97
  "README.md",
92
- "LICENSE"
98
+ "LICENSE",
99
+ "story-review.css"
93
100
  ],
94
101
  "peerDependencies": {
95
102
  "react": ">=18.0.0"
@@ -0,0 +1,238 @@
1
+ .sm-story-review {
2
+ max-width: 960px;
3
+ margin: 0 auto;
4
+ padding: 0 24px 64px;
5
+ color: var(--news-ink, #172b43);
6
+ background: var(--news-paper, #fff);
7
+ font:
8
+ 16px/1.65 Georgia,
9
+ serif;
10
+ }
11
+ .sm-review-private {
12
+ position: sticky;
13
+ top: 0;
14
+ z-index: 20;
15
+ margin: 0 -24px;
16
+ padding: 12px 24px;
17
+ background: #173c5c;
18
+ color: #fff;
19
+ font:
20
+ 14px/1.5 system-ui,
21
+ sans-serif;
22
+ display: flex;
23
+ justify-content: space-between;
24
+ gap: 12px;
25
+ flex-wrap: wrap;
26
+ }
27
+ .sm-review-masthead {
28
+ font-size: clamp(26px, 5vw, 44px);
29
+ font-weight: bold;
30
+ text-align: center;
31
+ border-bottom: 3px double currentColor;
32
+ padding: 24px 0;
33
+ }
34
+ .sm-review-intro {
35
+ font:
36
+ 14px/1.6 system-ui,
37
+ sans-serif;
38
+ border-bottom: 1px solid #c7d3de;
39
+ padding: 16px 0;
40
+ }
41
+ .sm-review-article {
42
+ max-width: 720px;
43
+ margin: 36px auto;
44
+ }
45
+ .sm-review-article h1 {
46
+ font-size: clamp(30px, 5vw, 50px);
47
+ line-height: 1.13;
48
+ letter-spacing: -0.02em;
49
+ }
50
+ .sm-review-dek {
51
+ font-size: 21px;
52
+ color: #4b6072;
53
+ }
54
+ .sm-review-prose {
55
+ font-size: 19px;
56
+ line-height: 1.8;
57
+ }
58
+ .sm-review-prose img,
59
+ .sm-review-prose iframe {
60
+ display: none;
61
+ }
62
+ .sm-story-review figure {
63
+ margin: 24px 0;
64
+ }
65
+ .sm-story-review figure img {
66
+ display: block;
67
+ width: 100%;
68
+ max-height: 640px;
69
+ object-fit: contain;
70
+ }
71
+ .sm-story-review figcaption {
72
+ font:
73
+ 13px/1.5 system-ui,
74
+ sans-serif;
75
+ color: #496076;
76
+ margin-top: 8px;
77
+ }
78
+ .sm-review-actions {
79
+ position: sticky;
80
+ bottom: 0;
81
+ display: flex;
82
+ gap: 8px;
83
+ flex-wrap: wrap;
84
+ border-top: 2px solid #173c5c;
85
+ background: #f0f5f9;
86
+ padding: 14px;
87
+ z-index: 10;
88
+ }
89
+ .sm-story-review button {
90
+ font:
91
+ 600 14px/1.4 system-ui,
92
+ sans-serif;
93
+ padding: 10px 14px;
94
+ border: 1px solid #6a8093;
95
+ border-radius: 4px;
96
+ background: #fff;
97
+ color: #173c5c;
98
+ cursor: pointer;
99
+ }
100
+ .sm-story-review button:disabled {
101
+ opacity: 0.5;
102
+ cursor: default;
103
+ }
104
+ .sm-story-review button:hover:not(:disabled) {
105
+ background: #e7f0f7;
106
+ }
107
+ .sm-story-review :focus-visible {
108
+ outline: 3px solid #2276b1;
109
+ outline-offset: 3px;
110
+ }
111
+ .sm-review-form {
112
+ scroll-margin-top: 90px;
113
+ margin-top: 24px;
114
+ padding: 24px;
115
+ border: 1px solid #9aafbf;
116
+ font-family: system-ui, sans-serif;
117
+ }
118
+ .sm-review-form-heading {
119
+ display: flex;
120
+ align-items: center;
121
+ justify-content: space-between;
122
+ gap: 16px;
123
+ }
124
+ .sm-review-form h2 {
125
+ font:
126
+ 600 24px/1.3 Georgia,
127
+ serif;
128
+ }
129
+ .sm-review-form label {
130
+ display: block;
131
+ margin: 16px 0;
132
+ font-size: 15px;
133
+ }
134
+ .sm-review-form input:not([type="checkbox"]),
135
+ .sm-review-form textarea,
136
+ .sm-review-form select {
137
+ display: block;
138
+ box-sizing: border-box;
139
+ width: 100%;
140
+ margin-top: 6px;
141
+ padding: 10px;
142
+ border: 1px solid #7d919f;
143
+ border-radius: 3px;
144
+ font: inherit;
145
+ background: #fff;
146
+ color: #172b43;
147
+ }
148
+ .sm-review-check {
149
+ display: flex !important;
150
+ align-items: flex-start;
151
+ gap: 10px;
152
+ }
153
+ .sm-review-check input {
154
+ margin-top: 6px;
155
+ }
156
+ .sm-review-alert,
157
+ .sm-review-notice {
158
+ padding: 16px;
159
+ background: #fff0ec;
160
+ color: #792a1d;
161
+ font-family: system-ui, sans-serif;
162
+ }
163
+ .sm-review-notice {
164
+ background: #eaf6f0;
165
+ color: #215d3d;
166
+ }
167
+ .sm-review-contributions {
168
+ margin-top: 32px;
169
+ }
170
+ .sm-review-contributions > div {
171
+ border-top: 1px solid #c7d3de;
172
+ padding: 16px 0;
173
+ }
174
+ .sm-review-decline {
175
+ margin-top: 32px;
176
+ }
177
+ .sm-review-diff del,
178
+ .sm-review-diff ins {
179
+ display: block;
180
+ white-space: pre-wrap;
181
+ padding: 12px;
182
+ text-decoration-thickness: 1px;
183
+ }
184
+ .sm-review-diff del {
185
+ background: #fbe5e5;
186
+ color: #732828;
187
+ }
188
+ .sm-review-diff ins {
189
+ background: #e2f3e8;
190
+ color: #184f31;
191
+ }
192
+ .sm-review-diff-columns {
193
+ display: grid;
194
+ grid-template-columns: 1fr 1fr;
195
+ gap: 16px;
196
+ }
197
+ @media (max-width: 600px) {
198
+ .sm-story-review {
199
+ padding: 0 16px 32px;
200
+ }
201
+ .sm-review-private {
202
+ margin: 0 -16px;
203
+ padding: 10px 16px;
204
+ }
205
+ .sm-review-actions {
206
+ position: static;
207
+ padding: 10px;
208
+ }
209
+ .sm-review-diff-columns {
210
+ grid-template-columns: 1fr;
211
+ }
212
+ .sm-review-form {
213
+ padding: 16px;
214
+ }
215
+ }
216
+ @media print {
217
+ .sm-review-actions,
218
+ .sm-review-form,
219
+ .sm-review-contributions,
220
+ .sm-review-decline {
221
+ display: none;
222
+ }
223
+ .sm-review-private {
224
+ position: static;
225
+ color: #000;
226
+ background: #fff;
227
+ border: 2px solid #000;
228
+ }
229
+ .sm-story-review {
230
+ max-width: none;
231
+ padding: 0;
232
+ }
233
+ }
234
+
235
+ .sm-story-review video {
236
+ max-width: 100%;
237
+ max-height: 70vh;
238
+ }