linguabot commited on
Commit
bb96b64
·
verified ·
1 Parent(s): c05a0f4

Upload folder using huggingface_hub

Browse files
Files changed (1) hide show
  1. client/src/components/Refinity.tsx +4 -3
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 - 200px)' }}>
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(62.4vh, calc((100vh - 240px) * 0.8))', minHeight: '304px' }}
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: '100%' }}>
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
  ` }} />