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