version-pill-react 1.2.4 → 1.2.6
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/dist/index.js +138 -97
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +138 -97
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -257,7 +257,9 @@ function VersionPill({
|
|
|
257
257
|
}
|
|
258
258
|
);
|
|
259
259
|
};
|
|
260
|
+
const versionsArray = Array.isArray(versions) ? versions : [];
|
|
260
261
|
const tasksArray = Array.isArray(roadmapTasks) ? roadmapTasks : [];
|
|
262
|
+
const ideasArray = Array.isArray(ideas) ? ideas : [];
|
|
261
263
|
const groupedTasks = tasksArray.reduce((acc, task) => {
|
|
262
264
|
const col = task.column || "backlog";
|
|
263
265
|
if (!acc[col]) acc[col] = [];
|
|
@@ -268,22 +270,32 @@ function VersionPill({
|
|
|
268
270
|
/* @__PURE__ */ jsx("div", { className: clsx(positionStyles[position], className), style: { display: "inline-flex" }, children: renderBadge() }),
|
|
269
271
|
isOpen && /* @__PURE__ */ jsxs("div", { style: {
|
|
270
272
|
position: "fixed",
|
|
271
|
-
|
|
272
|
-
|
|
273
|
+
top: 0,
|
|
274
|
+
left: 0,
|
|
275
|
+
right: 0,
|
|
276
|
+
bottom: 0,
|
|
277
|
+
width: "100vw",
|
|
278
|
+
height: "100vh",
|
|
279
|
+
zIndex: 2147483647,
|
|
273
280
|
display: "flex",
|
|
274
281
|
alignItems: "center",
|
|
275
282
|
justifyContent: "center",
|
|
276
|
-
padding:
|
|
283
|
+
padding: 20,
|
|
284
|
+
boxSizing: "border-box"
|
|
277
285
|
}, children: [
|
|
278
286
|
/* @__PURE__ */ jsx(
|
|
279
287
|
"div",
|
|
280
288
|
{
|
|
281
289
|
onClick: () => setIsOpen(false),
|
|
282
290
|
style: {
|
|
283
|
-
position: "
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
291
|
+
position: "fixed",
|
|
292
|
+
top: 0,
|
|
293
|
+
left: 0,
|
|
294
|
+
width: "100vw",
|
|
295
|
+
height: "100vh",
|
|
296
|
+
background: isLight ? "rgba(0,0,0,0.5)" : "rgba(0,0,0,0.7)",
|
|
297
|
+
backdropFilter: "blur(4px)",
|
|
298
|
+
WebkitBackdropFilter: "blur(4px)"
|
|
287
299
|
}
|
|
288
300
|
}
|
|
289
301
|
),
|
|
@@ -292,31 +304,35 @@ function VersionPill({
|
|
|
292
304
|
{
|
|
293
305
|
style: {
|
|
294
306
|
position: "relative",
|
|
307
|
+
zIndex: 1,
|
|
308
|
+
display: "flex",
|
|
309
|
+
flexDirection: "column",
|
|
295
310
|
width: "100%",
|
|
296
|
-
maxWidth:
|
|
297
|
-
maxHeight: "
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
311
|
+
maxWidth: 400,
|
|
312
|
+
maxHeight: "min(480px, 70vh)",
|
|
313
|
+
borderRadius: 12,
|
|
314
|
+
boxShadow: isLight ? "0 20px 40px -10px rgba(0,0,0,0.15), 0 0 0 1px rgba(0,0,0,0.05)" : "0 20px 40px -10px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.1)",
|
|
315
|
+
background: isLight ? "#fff" : "#1a1a1a",
|
|
316
|
+
overflow: "hidden"
|
|
302
317
|
},
|
|
303
318
|
children: [
|
|
304
319
|
/* @__PURE__ */ jsxs(
|
|
305
320
|
"div",
|
|
306
321
|
{
|
|
307
322
|
style: {
|
|
308
|
-
|
|
309
|
-
|
|
323
|
+
flexShrink: 0,
|
|
324
|
+
padding: "14px 16px",
|
|
325
|
+
borderBottom: `1px solid ${isLight ? "#e5e5e5" : "#2a2a2a"}`,
|
|
310
326
|
display: "flex",
|
|
311
327
|
alignItems: "center",
|
|
312
328
|
justifyContent: "space-between"
|
|
313
329
|
},
|
|
314
330
|
children: [
|
|
315
331
|
/* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 10 }, children: [
|
|
316
|
-
project?.icon && /* @__PURE__ */ jsx("span", { style: { fontSize:
|
|
332
|
+
project?.icon && /* @__PURE__ */ jsx("span", { style: { fontSize: 18 }, children: project.icon }),
|
|
317
333
|
/* @__PURE__ */ jsxs("div", { children: [
|
|
318
|
-
/* @__PURE__ */ jsx("h2", { style: { fontWeight: 600, color: isLight ? "#18181b" : "#fff", margin: 0 }, children: project?.name || "What's New" }),
|
|
319
|
-
/* @__PURE__ */ jsxs("p", { style: { fontSize:
|
|
334
|
+
/* @__PURE__ */ jsx("h2", { style: { fontWeight: 600, fontSize: 15, color: isLight ? "#18181b" : "#fff", margin: 0 }, children: project?.name || "What's New" }),
|
|
335
|
+
/* @__PURE__ */ jsxs("p", { style: { fontSize: 11, color: isLight ? "#71717a" : "#a1a1aa", margin: 0 }, children: [
|
|
320
336
|
"v",
|
|
321
337
|
currentVersion
|
|
322
338
|
] })
|
|
@@ -327,14 +343,21 @@ function VersionPill({
|
|
|
327
343
|
{
|
|
328
344
|
onClick: () => setIsOpen(false),
|
|
329
345
|
style: {
|
|
330
|
-
|
|
346
|
+
width: 28,
|
|
347
|
+
height: 28,
|
|
348
|
+
display: "flex",
|
|
349
|
+
alignItems: "center",
|
|
350
|
+
justifyContent: "center",
|
|
331
351
|
borderRadius: 6,
|
|
332
|
-
background: "
|
|
352
|
+
background: isLight ? "#f5f5f5" : "#2a2a2a",
|
|
333
353
|
border: "none",
|
|
334
354
|
cursor: "pointer",
|
|
335
|
-
color: isLight ? "#71717a" : "#a1a1aa"
|
|
355
|
+
color: isLight ? "#71717a" : "#a1a1aa",
|
|
356
|
+
transition: "background 150ms"
|
|
336
357
|
},
|
|
337
|
-
|
|
358
|
+
onMouseEnter: (e) => e.currentTarget.style.background = isLight ? "#e5e5e5" : "#3a3a3a",
|
|
359
|
+
onMouseLeave: (e) => e.currentTarget.style.background = isLight ? "#f5f5f5" : "#2a2a2a",
|
|
360
|
+
children: /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", children: /* @__PURE__ */ jsx("path", { d: "M18 6L6 18M6 6l12 12" }) })
|
|
338
361
|
}
|
|
339
362
|
)
|
|
340
363
|
]
|
|
@@ -344,125 +367,142 @@ function VersionPill({
|
|
|
344
367
|
"div",
|
|
345
368
|
{
|
|
346
369
|
style: {
|
|
370
|
+
flexShrink: 0,
|
|
347
371
|
display: "flex",
|
|
348
|
-
gap:
|
|
349
|
-
padding: "8px
|
|
350
|
-
borderBottom: `1px solid ${isLight ? "#
|
|
372
|
+
gap: 2,
|
|
373
|
+
padding: "8px 12px",
|
|
374
|
+
borderBottom: `1px solid ${isLight ? "#e5e5e5" : "#2a2a2a"}`,
|
|
375
|
+
background: isLight ? "#fafafa" : "#151515"
|
|
351
376
|
},
|
|
352
377
|
children: ["changelog", "roadmap", "ideas"].map((tab) => /* @__PURE__ */ jsxs(
|
|
353
378
|
"button",
|
|
354
379
|
{
|
|
355
380
|
onClick: () => setActiveTab(tab),
|
|
356
381
|
style: {
|
|
357
|
-
padding: "6px
|
|
382
|
+
padding: "6px 10px",
|
|
358
383
|
borderRadius: 6,
|
|
359
384
|
border: "none",
|
|
360
385
|
cursor: "pointer",
|
|
361
|
-
fontSize:
|
|
386
|
+
fontSize: 12,
|
|
362
387
|
fontWeight: 500,
|
|
363
|
-
background: activeTab === tab ? isLight ? "#
|
|
364
|
-
color: activeTab === tab ? isLight ? "#18181b" : "#fff" : isLight ? "#71717a" : "#
|
|
388
|
+
background: activeTab === tab ? isLight ? "#fff" : "#2a2a2a" : "transparent",
|
|
389
|
+
color: activeTab === tab ? isLight ? "#18181b" : "#fff" : isLight ? "#71717a" : "#71717a",
|
|
390
|
+
boxShadow: activeTab === tab ? isLight ? "0 1px 2px rgba(0,0,0,0.05)" : "0 1px 2px rgba(0,0,0,0.2)" : "none",
|
|
391
|
+
transition: "all 150ms"
|
|
365
392
|
},
|
|
366
393
|
children: [
|
|
367
|
-
tab === "changelog" && "
|
|
368
|
-
tab === "roadmap" && "
|
|
369
|
-
tab === "ideas" && "
|
|
394
|
+
tab === "changelog" && "Changelog",
|
|
395
|
+
tab === "roadmap" && "Roadmap",
|
|
396
|
+
tab === "ideas" && "Ideas"
|
|
370
397
|
]
|
|
371
398
|
},
|
|
372
399
|
tab
|
|
373
400
|
))
|
|
374
401
|
}
|
|
375
402
|
),
|
|
376
|
-
/* @__PURE__ */ jsxs("div", { style: {
|
|
377
|
-
activeTab === "changelog" && /* @__PURE__ */ jsx("div", { children:
|
|
378
|
-
/* @__PURE__ */ jsx("div", { style: { fontSize:
|
|
379
|
-
/* @__PURE__ */ jsx("div", { children: "No releases yet" })
|
|
380
|
-
] }) :
|
|
381
|
-
/* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap:
|
|
382
|
-
/* @__PURE__ */ jsx("span", { style: { fontSize:
|
|
383
|
-
/* @__PURE__ */ jsx("span", { style: { fontWeight: 600, color: isLight ? "#18181b" : "#fff" }, children: version.title }),
|
|
403
|
+
/* @__PURE__ */ jsxs("div", { style: { flex: 1, overflowY: "auto", padding: 12, minHeight: 0 }, children: [
|
|
404
|
+
activeTab === "changelog" && /* @__PURE__ */ jsx("div", { children: versionsArray.length === 0 ? /* @__PURE__ */ jsxs("div", { style: { textAlign: "center", padding: 30, color: isLight ? "#71717a" : "#a1a1aa" }, children: [
|
|
405
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 24, marginBottom: 6 }, children: "\u{1F680}" }),
|
|
406
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 13 }, children: "No releases yet" })
|
|
407
|
+
] }) : versionsArray.slice(0, 5).map((version, idx) => /* @__PURE__ */ jsxs("div", { style: { marginBottom: 12, paddingBottom: 12, borderBottom: idx < versionsArray.length - 1 && idx < 4 ? `1px solid ${isLight ? "#f0f0f0" : "#252525"}` : "none" }, children: [
|
|
408
|
+
/* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 6, marginBottom: 3 }, children: [
|
|
409
|
+
/* @__PURE__ */ jsx("span", { style: { fontSize: 14 }, children: version.emoji || "\u{1F4E6}" }),
|
|
410
|
+
/* @__PURE__ */ jsx("span", { style: { fontWeight: 600, fontSize: 13, color: isLight ? "#18181b" : "#fff" }, children: version.title }),
|
|
384
411
|
/* @__PURE__ */ jsx(
|
|
385
412
|
"span",
|
|
386
413
|
{
|
|
387
414
|
style: {
|
|
388
|
-
padding: "
|
|
389
|
-
fontSize:
|
|
415
|
+
padding: "1px 5px",
|
|
416
|
+
fontSize: 9,
|
|
390
417
|
fontWeight: 500,
|
|
391
|
-
borderRadius:
|
|
392
|
-
background: version.type === "major" ? "#f3e8ff" : version.type === "minor" ? "#dbeafe" : "#f4f4f5",
|
|
393
|
-
color: version.type === "major" ? "#7c3aed" : version.type === "minor" ? "#2563eb" : "#52525b"
|
|
418
|
+
borderRadius: 3,
|
|
419
|
+
background: version.type === "major" ? "#f3e8ff" : version.type === "minor" ? "#dbeafe" : isLight ? "#f4f4f5" : "#2a2a2a",
|
|
420
|
+
color: version.type === "major" ? "#7c3aed" : version.type === "minor" ? "#2563eb" : isLight ? "#52525b" : "#a1a1aa"
|
|
394
421
|
},
|
|
395
422
|
children: version.type
|
|
396
423
|
}
|
|
397
424
|
)
|
|
398
425
|
] }),
|
|
399
|
-
/* @__PURE__ */ jsxs("div", { style: { fontSize:
|
|
426
|
+
/* @__PURE__ */ jsxs("div", { style: { fontSize: 11, color: isLight ? "#71717a" : "#71717a", marginBottom: 6 }, children: [
|
|
400
427
|
"v",
|
|
401
428
|
version.version,
|
|
402
429
|
" \xB7 ",
|
|
403
430
|
new Date(version.date).toLocaleDateString()
|
|
404
431
|
] }),
|
|
405
|
-
version.description && /* @__PURE__ */ jsx("p", { style: { fontSize:
|
|
406
|
-
version.features && version.features.length > 0 && /* @__PURE__ */
|
|
407
|
-
/* @__PURE__ */
|
|
408
|
-
|
|
409
|
-
|
|
432
|
+
version.description && /* @__PURE__ */ jsx("p", { style: { fontSize: 12, color: isLight ? "#52525b" : "#a1a1aa", margin: "0 0 6px 0", lineHeight: 1.5 }, children: version.description }),
|
|
433
|
+
version.features && version.features.length > 0 && /* @__PURE__ */ jsxs("ul", { style: { margin: 0, paddingLeft: 0, listStyle: "none" }, children: [
|
|
434
|
+
version.features.slice(0, 4).map((feature, i) => /* @__PURE__ */ jsxs("li", { style: { display: "flex", alignItems: "flex-start", gap: 6, fontSize: 12, color: isLight ? "#52525b" : "#a1a1aa", marginBottom: 2, lineHeight: 1.4 }, children: [
|
|
435
|
+
/* @__PURE__ */ jsx("span", { style: { color: "#22c55e", fontSize: 11 }, children: "\u2713" }),
|
|
436
|
+
feature
|
|
437
|
+
] }, i)),
|
|
438
|
+
version.features.length > 4 && /* @__PURE__ */ jsxs("li", { style: { fontSize: 11, color: isLight ? "#a1a1aa" : "#525252", marginTop: 2 }, children: [
|
|
439
|
+
"+",
|
|
440
|
+
version.features.length - 4,
|
|
441
|
+
" more..."
|
|
442
|
+
] })
|
|
443
|
+
] })
|
|
410
444
|
] }, idx)) }),
|
|
411
|
-
activeTab === "roadmap" && /* @__PURE__ */ jsx("div", { children: Object.keys(groupedTasks).length === 0 ? /* @__PURE__ */ jsxs("div", { style: { textAlign: "center", padding:
|
|
412
|
-
/* @__PURE__ */ jsx("div", { style: { fontSize:
|
|
413
|
-
/* @__PURE__ */ jsx("div", { children: "No public roadmap items" })
|
|
414
|
-
] }) : ["in-progress", "todo", "backlog"
|
|
445
|
+
activeTab === "roadmap" && /* @__PURE__ */ jsx("div", { children: Object.keys(groupedTasks).length === 0 ? /* @__PURE__ */ jsxs("div", { style: { textAlign: "center", padding: 30, color: isLight ? "#71717a" : "#a1a1aa" }, children: [
|
|
446
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 24, marginBottom: 6 }, children: "\u{1F5FA}\uFE0F" }),
|
|
447
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 13 }, children: "No public roadmap items" })
|
|
448
|
+
] }) : ["in-progress", "todo", "backlog"].map((col) => {
|
|
415
449
|
const tasks = groupedTasks[col];
|
|
416
450
|
if (!tasks || tasks.length === 0) return null;
|
|
417
|
-
return /* @__PURE__ */ jsxs("div", { style: { marginBottom:
|
|
418
|
-
/* @__PURE__ */ jsxs("h3", { style: { fontSize:
|
|
451
|
+
return /* @__PURE__ */ jsxs("div", { style: { marginBottom: 12 }, children: [
|
|
452
|
+
/* @__PURE__ */ jsxs("h3", { style: { fontSize: 10, fontWeight: 600, color: isLight ? "#a1a1aa" : "#71717a", marginBottom: 6, textTransform: "uppercase", letterSpacing: "0.5px" }, children: [
|
|
419
453
|
COLUMN_LABELS[col] || col,
|
|
420
454
|
" (",
|
|
421
455
|
tasks.length,
|
|
422
456
|
")"
|
|
423
457
|
] }),
|
|
424
|
-
tasks.map((task) => /* @__PURE__ */ jsx(
|
|
458
|
+
tasks.slice(0, 4).map((task) => /* @__PURE__ */ jsx(
|
|
425
459
|
"div",
|
|
426
460
|
{
|
|
427
461
|
style: {
|
|
428
|
-
padding:
|
|
429
|
-
marginBottom:
|
|
430
|
-
borderRadius:
|
|
431
|
-
background: isLight ? "#
|
|
462
|
+
padding: "8px 10px",
|
|
463
|
+
marginBottom: 4,
|
|
464
|
+
borderRadius: 5,
|
|
465
|
+
background: isLight ? "#f5f5f5" : "#252525"
|
|
432
466
|
},
|
|
433
|
-
children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap:
|
|
467
|
+
children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
|
|
434
468
|
/* @__PURE__ */ jsx(
|
|
435
469
|
"span",
|
|
436
470
|
{
|
|
437
471
|
style: {
|
|
438
|
-
width:
|
|
439
|
-
height:
|
|
472
|
+
width: 6,
|
|
473
|
+
height: 6,
|
|
440
474
|
borderRadius: "50%",
|
|
441
|
-
background: TYPE_COLORS[task.type] || "#71717a"
|
|
475
|
+
background: TYPE_COLORS[task.type] || "#71717a",
|
|
476
|
+
flexShrink: 0
|
|
442
477
|
}
|
|
443
478
|
}
|
|
444
479
|
),
|
|
445
|
-
/* @__PURE__ */ jsx("span", { style: { fontSize:
|
|
480
|
+
/* @__PURE__ */ jsx("span", { style: { fontSize: 12, color: isLight ? "#18181b" : "#fff", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: task.title })
|
|
446
481
|
] })
|
|
447
482
|
},
|
|
448
483
|
task.id
|
|
449
|
-
))
|
|
484
|
+
)),
|
|
485
|
+
tasks.length > 4 && /* @__PURE__ */ jsxs("div", { style: { fontSize: 10, color: isLight ? "#a1a1aa" : "#525252", marginTop: 4 }, children: [
|
|
486
|
+
"+",
|
|
487
|
+
tasks.length - 4,
|
|
488
|
+
" more..."
|
|
489
|
+
] })
|
|
450
490
|
] }, col);
|
|
451
491
|
}) }),
|
|
452
|
-
activeTab === "ideas" && /* @__PURE__ */ jsx("div", { children:
|
|
453
|
-
/* @__PURE__ */ jsx("div", { style: { fontSize:
|
|
454
|
-
/* @__PURE__ */ jsx("div", { children: "No feature requests yet" })
|
|
455
|
-
] }) :
|
|
492
|
+
activeTab === "ideas" && /* @__PURE__ */ jsx("div", { children: ideasArray.length === 0 ? /* @__PURE__ */ jsxs("div", { style: { textAlign: "center", padding: 30, color: isLight ? "#71717a" : "#a1a1aa" }, children: [
|
|
493
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 24, marginBottom: 6 }, children: "\u{1F4A1}" }),
|
|
494
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 13 }, children: "No feature requests yet" })
|
|
495
|
+
] }) : ideasArray.slice(0, 5).map((idea) => /* @__PURE__ */ jsxs(
|
|
456
496
|
"div",
|
|
457
497
|
{
|
|
458
498
|
style: {
|
|
459
|
-
padding:
|
|
460
|
-
marginBottom:
|
|
461
|
-
borderRadius:
|
|
462
|
-
background: isLight ? "#
|
|
499
|
+
padding: 10,
|
|
500
|
+
marginBottom: 6,
|
|
501
|
+
borderRadius: 6,
|
|
502
|
+
background: isLight ? "#f5f5f5" : "#252525",
|
|
463
503
|
display: "flex",
|
|
464
504
|
alignItems: "flex-start",
|
|
465
|
-
gap:
|
|
505
|
+
gap: 10
|
|
466
506
|
},
|
|
467
507
|
children: [
|
|
468
508
|
/* @__PURE__ */ jsxs(
|
|
@@ -472,23 +512,20 @@ function VersionPill({
|
|
|
472
512
|
display: "flex",
|
|
473
513
|
flexDirection: "column",
|
|
474
514
|
alignItems: "center",
|
|
475
|
-
padding: "
|
|
476
|
-
borderRadius:
|
|
477
|
-
background: isLight ? "#fff" : "#
|
|
478
|
-
minWidth:
|
|
515
|
+
padding: "3px 6px",
|
|
516
|
+
borderRadius: 4,
|
|
517
|
+
background: isLight ? "#fff" : "#1a1a1a",
|
|
518
|
+
minWidth: 32
|
|
479
519
|
},
|
|
480
520
|
children: [
|
|
481
|
-
/* @__PURE__ */ jsx("span", { style: { fontSize:
|
|
482
|
-
/* @__PURE__ */ jsx("span", { style: { fontSize:
|
|
521
|
+
/* @__PURE__ */ jsx("span", { style: { fontSize: 12, fontWeight: 600, color: isLight ? "#18181b" : "#fff" }, children: idea.votes }),
|
|
522
|
+
/* @__PURE__ */ jsx("span", { style: { fontSize: 9, color: isLight ? "#71717a" : "#71717a" }, children: "votes" })
|
|
483
523
|
]
|
|
484
524
|
}
|
|
485
525
|
),
|
|
486
|
-
/* @__PURE__ */ jsxs("div", { children: [
|
|
487
|
-
/* @__PURE__ */ jsx("div", { style: { fontSize:
|
|
488
|
-
idea.description && /* @__PURE__ */
|
|
489
|
-
idea.description.slice(0, 100),
|
|
490
|
-
"..."
|
|
491
|
-
] })
|
|
526
|
+
/* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
|
|
527
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 12, fontWeight: 500, color: isLight ? "#18181b" : "#fff", marginBottom: 2 }, children: idea.title }),
|
|
528
|
+
idea.description && /* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: isLight ? "#71717a" : "#71717a", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: idea.description.slice(0, 80) })
|
|
492
529
|
] })
|
|
493
530
|
]
|
|
494
531
|
},
|
|
@@ -499,9 +536,10 @@ function VersionPill({
|
|
|
499
536
|
"div",
|
|
500
537
|
{
|
|
501
538
|
style: {
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
539
|
+
flexShrink: 0,
|
|
540
|
+
padding: "10px 12px",
|
|
541
|
+
borderTop: `1px solid ${isLight ? "#e5e5e5" : "#2a2a2a"}`,
|
|
542
|
+
background: isLight ? "#fafafa" : "#151515",
|
|
505
543
|
display: "flex",
|
|
506
544
|
alignItems: "center",
|
|
507
545
|
justifyContent: "space-between"
|
|
@@ -513,7 +551,7 @@ function VersionPill({
|
|
|
513
551
|
href: "https://versionpill.com",
|
|
514
552
|
target: "_blank",
|
|
515
553
|
rel: "noopener noreferrer",
|
|
516
|
-
style: { fontSize: 10, color: isLight ? "#a1a1aa" : "#
|
|
554
|
+
style: { fontSize: 10, color: isLight ? "#a1a1aa" : "#525252", textDecoration: "none" },
|
|
517
555
|
children: "Powered by Version Pill"
|
|
518
556
|
}
|
|
519
557
|
),
|
|
@@ -524,14 +562,17 @@ function VersionPill({
|
|
|
524
562
|
target: "_blank",
|
|
525
563
|
rel: "noopener noreferrer",
|
|
526
564
|
style: {
|
|
527
|
-
padding: "
|
|
528
|
-
fontSize:
|
|
565
|
+
padding: "5px 10px",
|
|
566
|
+
fontSize: 11,
|
|
529
567
|
fontWeight: 500,
|
|
530
|
-
borderRadius:
|
|
568
|
+
borderRadius: 5,
|
|
531
569
|
background: "#22c55e",
|
|
532
570
|
color: "#fff",
|
|
533
|
-
textDecoration: "none"
|
|
571
|
+
textDecoration: "none",
|
|
572
|
+
transition: "background 150ms"
|
|
534
573
|
},
|
|
574
|
+
onMouseEnter: (e) => e.currentTarget.style.background = "#16a34a",
|
|
575
|
+
onMouseLeave: (e) => e.currentTarget.style.background = "#22c55e",
|
|
535
576
|
children: "View All \u2192"
|
|
536
577
|
}
|
|
537
578
|
)
|