Upload folder using huggingface_hub
Browse files
client/src/components/Refinity.tsx
CHANGED
|
@@ -367,7 +367,7 @@ const Refinity: React.FC = () => {
|
|
| 367 |
</button>
|
| 368 |
</div>
|
| 369 |
</div>
|
| 370 |
-
<div className="relative min-h-0" style={{ maxHeight: 'calc(100vh -
|
| 371 |
<SwiperRoot
|
| 372 |
modules={[EffectCoverflow, Navigation, Pagination, A11y]}
|
| 373 |
effect="coverflow"
|
|
@@ -389,14 +389,14 @@ const Refinity: React.FC = () => {
|
|
| 389 |
grabCursor
|
| 390 |
coverflowEffect={{ rotate: 0, stretch: 0, depth: 80, modifier: 1, slideShadows: false }}
|
| 391 |
className="mySwiper !px-4 overflow-visible pb-2"
|
| 392 |
-
style={{ height: 'min(
|
| 393 |
>
|
| 394 |
{taskVersions.map((v, idx) => {
|
| 395 |
const limit = 160;
|
| 396 |
const snippet = (v.content || '').slice(0, limit) + ((v.content || '').length > limit ? '…' : '');
|
| 397 |
const isCenter = idx === flowIndex;
|
| 398 |
return (
|
| 399 |
-
<SwiperSlide key={v.id} style={{ width: 'clamp(320px, 48vw, 720px)', height: '
|
| 400 |
<div className={`relative h-full rounded-2xl p-6 bg-white ring-1 ring-gray-200 shadow-xl text-base overflow-hidden flex flex-col ${isCenter ? '' : 'opacity-95'}`}>
|
| 401 |
<div className="pointer-events-none absolute inset-0 rounded-2xl opacity-40 [background:linear-gradient(to_bottom,rgba(255,255,255,0.45),rgba(255,255,255,0)_28%),linear-gradient(to_right,rgba(255,255,255,0.35),rgba(255,255,255,0)_28%)]" />
|
| 402 |
<div className="pointer-events-none absolute inset-0 rounded-2xl bg-gradient-to-tr from-white/30 via-white/10 to-transparent opacity-30" />
|
|
@@ -416,6 +416,7 @@ const Refinity: React.FC = () => {
|
|
| 416 |
})}
|
| 417 |
</SwiperRoot>
|
| 418 |
<style dangerouslySetInnerHTML={{ __html: `
|
|
|
|
| 419 |
.mySwiper .swiper-button-prev, .mySwiper .swiper-button-next { top: 50% !important; transform: translateY(-50%); }
|
| 420 |
.mySwiper .swiper-button-prev:after, .mySwiper .swiper-button-next:after { font-size: 18px; color: #94a3b8; }
|
| 421 |
` }} />
|
|
|
|
| 367 |
</button>
|
| 368 |
</div>
|
| 369 |
</div>
|
| 370 |
+
<div className="relative min-h-0 pt-2 pb-6" style={{ maxHeight: 'calc(100vh - 160px)' }}>
|
| 371 |
<SwiperRoot
|
| 372 |
modules={[EffectCoverflow, Navigation, Pagination, A11y]}
|
| 373 |
effect="coverflow"
|
|
|
|
| 389 |
grabCursor
|
| 390 |
coverflowEffect={{ rotate: 0, stretch: 0, depth: 80, modifier: 1, slideShadows: false }}
|
| 391 |
className="mySwiper !px-4 overflow-visible pb-2"
|
| 392 |
+
style={{ height: 'min(76vh, calc(100vh - 220px))', minHeight: '340px' }}
|
| 393 |
>
|
| 394 |
{taskVersions.map((v, idx) => {
|
| 395 |
const limit = 160;
|
| 396 |
const snippet = (v.content || '').slice(0, limit) + ((v.content || '').length > limit ? '…' : '');
|
| 397 |
const isCenter = idx === flowIndex;
|
| 398 |
return (
|
| 399 |
+
<SwiperSlide key={v.id} style={{ width: 'clamp(320px, 48vw, 720px)', height: '62.4vh' }}>
|
| 400 |
<div className={`relative h-full rounded-2xl p-6 bg-white ring-1 ring-gray-200 shadow-xl text-base overflow-hidden flex flex-col ${isCenter ? '' : 'opacity-95'}`}>
|
| 401 |
<div className="pointer-events-none absolute inset-0 rounded-2xl opacity-40 [background:linear-gradient(to_bottom,rgba(255,255,255,0.45),rgba(255,255,255,0)_28%),linear-gradient(to_right,rgba(255,255,255,0.35),rgba(255,255,255,0)_28%)]" />
|
| 402 |
<div className="pointer-events-none absolute inset-0 rounded-2xl bg-gradient-to-tr from-white/30 via-white/10 to-transparent opacity-30" />
|
|
|
|
| 416 |
})}
|
| 417 |
</SwiperRoot>
|
| 418 |
<style dangerouslySetInnerHTML={{ __html: `
|
| 419 |
+
.mySwiper .swiper-wrapper { align-items: center; }
|
| 420 |
.mySwiper .swiper-button-prev, .mySwiper .swiper-button-next { top: 50% !important; transform: translateY(-50%); }
|
| 421 |
.mySwiper .swiper-button-prev:after, .mySwiper .swiper-button-next:after { font-size: 18px; color: #94a3b8; }
|
| 422 |
` }} />
|