linguabot commited on
Commit
0829ac0
·
verified ·
1 Parent(s): 5ef6cf7

Upload folder using huggingface_hub

Browse files
Files changed (1) hide show
  1. client/src/components/Refinity.tsx +11 -7
client/src/components/Refinity.tsx CHANGED
@@ -376,12 +376,16 @@ const Refinity: React.FC = () => {
376
  navigation
377
  pagination={{ clickable: true }}
378
  centeredSlides
379
- slidesPerView={'auto'}
380
- spaceBetween={16}
381
- breakpoints={{ 640: { spaceBetween: 16 }, 1024: { spaceBetween: 24 }, 1536: { spaceBetween: 32 } }}
 
 
 
 
382
  grabCursor
383
- coverflowEffect={{ rotate: 0, stretch: 0, depth: 120, modifier: 1, slideShadows: false }}
384
- className="!px-6"
385
  style={{ height: 'clamp(420px, 70vh, 820px)' }}
386
  >
387
  {taskVersions.map((v, idx) => {
@@ -389,12 +393,12 @@ const Refinity: React.FC = () => {
389
  const isCenter = idx === flowIndex;
390
  return (
391
  <SwiperSlide key={v.id} style={{ width: 'clamp(320px, 56vw, 720px)' }}>
392
- <div className="relative h-full rounded-2xl p-5 bg-white ring-1 ring-gray-200 shadow-xl text-base">
393
  <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%)]" />
394
  <div className="pointer-events-none absolute inset-0 rounded-2xl bg-gradient-to-tr from-white/30 via-white/10 to-transparent opacity-30" />
395
  <div className="text-gray-800 text-sm mb-2">Original: {v.originalAuthor}</div>
396
  <div className="text-gray-600 text-xs mb-3">Revised by: {v.revisedBy ? `${v.revisedBy} (v${v.versionNumber})` : `— (v${v.versionNumber})`}</div>
397
- <div className="text-gray-900 whitespace-pre-wrap break-words leading-relaxed max-h-[calc(100%-56px)] overflow-auto pr-1">{snippet}</div>
398
  {isCenter && (
399
  <div className="mt-4 flex gap-3">
400
  <button onClick={()=>{ setPreviewVersionId(v.id); setStage('preview'); }} className="relative overflow-hidden inline-flex items-center justify-center gap-2 px-3 py-2 text-sm font-medium rounded-2xl text-black ring-1 ring-inset ring-white/50 backdrop-blur-md bg-white/30 active:translate-y-0.5 transition-all duration-200">Full Text</button>
 
376
  navigation
377
  pagination={{ clickable: true }}
378
  centeredSlides
379
+ slidesPerView={1.12}
380
+ spaceBetween={12}
381
+ breakpoints={{
382
+ 640: { slidesPerView: 1.2, spaceBetween: 16 },
383
+ 1024: { slidesPerView: 1.6, spaceBetween: 24 },
384
+ 1440: { slidesPerView: 1.8, spaceBetween: 32 }
385
+ }}
386
  grabCursor
387
+ coverflowEffect={{ rotate: 8, stretch: -20, depth: 160, modifier: 1, slideShadows: false }}
388
+ className="!px-6 overflow-visible"
389
  style={{ height: 'clamp(420px, 70vh, 820px)' }}
390
  >
391
  {taskVersions.map((v, idx) => {
 
393
  const isCenter = idx === flowIndex;
394
  return (
395
  <SwiperSlide key={v.id} style={{ width: 'clamp(320px, 56vw, 720px)' }}>
396
+ <div className="relative h-full rounded-2xl p-6 bg-white ring-1 ring-gray-200 shadow-xl text-base">
397
  <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%)]" />
398
  <div className="pointer-events-none absolute inset-0 rounded-2xl bg-gradient-to-tr from-white/30 via-white/10 to-transparent opacity-30" />
399
  <div className="text-gray-800 text-sm mb-2">Original: {v.originalAuthor}</div>
400
  <div className="text-gray-600 text-xs mb-3">Revised by: {v.revisedBy ? `${v.revisedBy} (v${v.versionNumber})` : `— (v${v.versionNumber})`}</div>
401
+ <div className="text-gray-900 whitespace-pre-wrap break-words leading-relaxed max-h-[calc(100%-64px)] overflow-auto pr-1">{snippet}</div>
402
  {isCenter && (
403
  <div className="mt-4 flex gap-3">
404
  <button onClick={()=>{ setPreviewVersionId(v.id); setStage('preview'); }} className="relative overflow-hidden inline-flex items-center justify-center gap-2 px-3 py-2 text-sm font-medium rounded-2xl text-black ring-1 ring-inset ring-white/50 backdrop-blur-md bg-white/30 active:translate-y-0.5 transition-all duration-200">Full Text</button>