linguabot commited on
Commit
92d01b4
·
verified ·
1 Parent(s): 24cddf6

Upload folder using huggingface_hub

Browse files
Files changed (1) hide show
  1. client/src/components/Refinity.tsx +9 -17
client/src/components/Refinity.tsx CHANGED
@@ -390,7 +390,7 @@ const Refinity: React.FC = () => {
390
  effect="coverflow"
391
  onSlideChange={(s: SwiperInstance)=> setFlowIndex(s.activeIndex)}
392
  onAfterInit={(s: SwiperInstance)=> setFlowIndex(s.activeIndex)}
393
- onClickCapture={undefined}
394
  navigation
395
  pagination={{ clickable: true }}
396
  centeredSlides
@@ -399,8 +399,8 @@ const Refinity: React.FC = () => {
399
  spaceBetween={24}
400
  preventClicks={false}
401
  preventClicksPropagation={false}
402
- noSwiping={true}
403
- noSwipingClass={'swiper-no-swiping'}
404
  breakpoints={{
405
  640: { spaceBetween: 28 },
406
  1024: { spaceBetween: 32 },
@@ -420,23 +420,14 @@ const Refinity: React.FC = () => {
420
  return (
421
  <SwiperSlide key={v.id} style={{ width: 'clamp(320px, 48vw, 720px)', height: isFullscreen ? '72vh' : '62.4vh' }}>
422
  <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 ? 'z-10' : 'opacity-95 z-0'}`}>
423
- <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%)]" />
424
- <div className="pointer-events-none absolute inset-0 rounded-2xl bg-gradient-to-tr from-white/30 via-white/10 to-transparent opacity-30" />
425
  <div className="text-gray-800 text-sm mb-2">Original: {v.originalAuthor}</div>
426
  <div className="text-gray-600 text-xs mb-3">Revised by: {v.revisedBy ? `${v.revisedBy} (v${v.versionNumber})` : `— (v${v.versionNumber})`}</div>
427
  <div className={`text-gray-900 whitespace-pre-wrap break-words leading-relaxed flex-1 overflow-hidden pr-1`}>{snippet}</div>
428
  {isCenter && (
429
- <div className="ref-action-bar mt-4 flex gap-3 relative z-20 swiper-no-swiping">
430
- <button
431
- type="button"
432
- onClick={(e)=>{ e.preventDefault(); e.stopPropagation(); setPreviewVersionId(v.id); setStage('preview'); }}
433
- onTouchStart={(e)=>{ e.stopPropagation(); }}
434
- 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"
435
- style={{ touchAction: 'manipulation', transform: 'translateZ(0)', WebkitTransform: 'translateZ(0)', WebkitTapHighlightColor: 'transparent' }}
436
- data-version-id={v.id}
437
- >
438
- Full Text
439
- </button>
440
  <button type="button" onClick={()=>selectManual(v.id)} className="relative overflow-hidden inline-flex items-center justify-center gap-2 px-3 py-2 text-sm font-medium rounded-2xl text-white ring-1 ring-inset ring-white/50 backdrop-blur-md backdrop-brightness-110 backdrop-saturate-150 bg-indigo-600/70 active:translate-y-0.5 transition-all duration-200">Revise</button>
441
  <button type="button" onClick={()=>{ setCompareUIOpen(true); if (!compareA) setCompareA(v.id); }} 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">Compare</button>
442
  </div>
@@ -528,7 +519,8 @@ const Refinity: React.FC = () => {
528
  .mySwiper .swiper-button-prev, .mySwiper .swiper-button-next { top: 50% !important; transform: translateY(-50%); }
529
  .mySwiper .swiper-button-prev:after, .mySwiper .swiper-button-next:after { font-size: 18px; color: #94a3b8; }
530
  .mySwiper .swiper-slide-active { z-index: 50 !important; }
531
- /* Keep default stacking for arrows/pagination to avoid blocking cards */
 
532
  ` }} />
533
  </div>
534
  {compareModalOpen && (
 
390
  effect="coverflow"
391
  onSlideChange={(s: SwiperInstance)=> setFlowIndex(s.activeIndex)}
392
  onAfterInit={(s: SwiperInstance)=> setFlowIndex(s.activeIndex)}
393
+ onClickCapture={(e: any)=>{ /* keep default; no slide-level click */ }}
394
  navigation
395
  pagination={{ clickable: true }}
396
  centeredSlides
 
399
  spaceBetween={24}
400
  preventClicks={false}
401
  preventClicksPropagation={false}
402
+ noSwiping={false}
403
+ noSwipingClass={undefined}
404
  breakpoints={{
405
  640: { spaceBetween: 28 },
406
  1024: { spaceBetween: 32 },
 
420
  return (
421
  <SwiperSlide key={v.id} style={{ width: 'clamp(320px, 48vw, 720px)', height: isFullscreen ? '72vh' : '62.4vh' }}>
422
  <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 ? 'z-10' : 'opacity-95 z-0'}`}>
423
+ <div className={`ref-card-overlay ${isCenter ? '' : ''} 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%)]`} />
424
+ <div className={`ref-card-overlay ${isCenter ? '' : ''} absolute inset-0 rounded-2xl bg-gradient-to-tr from-white/30 via-white/10 to-transparent opacity-30`} />
425
  <div className="text-gray-800 text-sm mb-2">Original: {v.originalAuthor}</div>
426
  <div className="text-gray-600 text-xs mb-3">Revised by: {v.revisedBy ? `${v.revisedBy} (v${v.versionNumber})` : `— (v${v.versionNumber})`}</div>
427
  <div className={`text-gray-900 whitespace-pre-wrap break-words leading-relaxed flex-1 overflow-hidden pr-1`}>{snippet}</div>
428
  {isCenter && (
429
+ <div className="ref-action-bar mt-4 flex gap-3 relative z-20">
430
+ <button type="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>
 
 
 
 
 
 
 
 
 
431
  <button type="button" onClick={()=>selectManual(v.id)} className="relative overflow-hidden inline-flex items-center justify-center gap-2 px-3 py-2 text-sm font-medium rounded-2xl text-white ring-1 ring-inset ring-white/50 backdrop-blur-md backdrop-brightness-110 backdrop-saturate-150 bg-indigo-600/70 active:translate-y-0.5 transition-all duration-200">Revise</button>
432
  <button type="button" onClick={()=>{ setCompareUIOpen(true); if (!compareA) setCompareA(v.id); }} 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">Compare</button>
433
  </div>
 
519
  .mySwiper .swiper-button-prev, .mySwiper .swiper-button-next { top: 50% !important; transform: translateY(-50%); }
520
  .mySwiper .swiper-button-prev:after, .mySwiper .swiper-button-next:after { font-size: 18px; color: #94a3b8; }
521
  .mySwiper .swiper-slide-active { z-index: 50 !important; }
522
+ /* Active slide receives pointer events; non-active decorative overlays ignore events */
523
+ .mySwiper .swiper-slide:not(.swiper-slide-active) .ref-card-overlay { pointer-events: none; }
524
  ` }} />
525
  </div>
526
  {compareModalOpen && (