this repo has no description
Embrace "Private mention"
+29
-4
+1
-1
src/components/compose.jsx
+1
-1
src/components/compose.jsx
+22
-2
src/components/status.css
+22
-2
src/components/status.css
···
240
240
241
241
.status-reply-badge {
242
242
display: inline-flex;
243
-
margin-left: 4px;
243
+
margin: 2px 0 2px 4px;
244
244
gap: 4px;
245
245
align-items: center;
246
+
vertical-align: middle;
246
247
}
247
248
.status-reply-badge .icon {
248
249
color: var(--reply-to-color);
249
250
}
250
251
.status-thread-badge {
252
+
vertical-align: middle;
251
253
display: inline-flex;
252
-
margin: 4px 0 0 0;
254
+
margin: 2px 0;
253
255
gap: 4px;
254
256
align-items: center;
255
257
color: var(--reply-to-text-color);
···
269
271
var(--reply-to-faded-color) 4px
270
272
);
271
273
font-weight: bold;
274
+
}
275
+
.status-direct-badge {
276
+
vertical-align: middle;
277
+
display: inline-flex;
278
+
margin: 2px 0;
279
+
gap: 4px;
280
+
align-items: center;
281
+
color: var(--reply-to-text-color);
282
+
background-color: var(--bg-color);
283
+
border: 1px solid var(--reply-to-text-color);
284
+
border-radius: 4px;
285
+
padding: 4px;
286
+
font-size: 10px;
287
+
line-height: 1;
288
+
text-transform: uppercase;
289
+
opacity: 0.75;
290
+
font-weight: bold;
291
+
box-shadow: inset 0 0 0 1px var(--reply-to-color);
272
292
}
273
293
.status-filtered-badge {
274
294
flex-shrink: 0;
+6
-1
src/components/status.jsx
+6
-1
src/components/status.jsx
···
62
62
public: 'Public',
63
63
unlisted: 'Unlisted',
64
64
private: 'Followers only',
65
-
direct: 'Direct',
65
+
direct: 'Private mention',
66
66
};
67
67
68
68
function Status({
···
779
779
</span>
780
780
))}
781
781
</div>
782
+
{visibility === 'direct' && (
783
+
<>
784
+
<div class="status-direct-badge">Private mention</div>{' '}
785
+
</>
786
+
)}
782
787
{!withinContext && (
783
788
<>
784
789
{inReplyToAccountId === status.account?.id ||