update styling
This commit is contained in:
@ -1,12 +1,58 @@
|
||||
import React from 'react';
|
||||
import Image from 'next/image';
|
||||
|
||||
const FeatureCard = ({ icon, title, description }) => (
|
||||
<div className="p-6 rounded-2xl shadow-sm border-0 h-full transition-transform duration-300 ease-in-out hover:scale-105 hover:shadow-lg group" style={{ backgroundColor: '#f2fcfc' }}>
|
||||
<div className="flex items-center space-x-4 mb-4">
|
||||
<div className="w-12 h-12 bg-orange-100 rounded-xl flex items-center justify-center flex-shrink-0">
|
||||
<Image src={icon} alt={title} width={24} height={24} />
|
||||
</div>
|
||||
<h3 className="text-lg font-semibold text-teal-700 leading-tight">{title}</h3>
|
||||
</div>
|
||||
<div className="relative w-full h-px bg-gray-300 mb-4 overflow-hidden">
|
||||
<div className="absolute top-0 left-0 h-full bg-gray-600 w-0 group-hover:w-full transition-all duration-500 ease-in-out"></div>
|
||||
</div>
|
||||
<p className="text-gray-600 leading-relaxed text-sm text-justify">{description}</p>
|
||||
</div>
|
||||
);
|
||||
|
||||
export default function HereditaryCancerPanel() {
|
||||
const features = [
|
||||
{ title: "Comprehensive Gene Coverage", desc: "Includes high- and moderate-risk genes such as BRCA1, BRCA2, TP53, MLH1, MSH2, APC, and others." },
|
||||
{ title: "Germline Variant Detection", desc: "Accurately detects SNVs, Indels, and selected CNVs in genes associated with inherited cancer risk." },
|
||||
{ title: "Family-Centered Testing", desc: "Supports cascade testing for at-risk relatives, enabling early detection and prevention." },
|
||||
{ title: "Clinical Actionability", desc: "Provides insights that guide surveillance, preventive measures, and personalized treatment planning." },
|
||||
{ title: "High Sensitivity & Specificity", desc: "Uses ≥100X sequencing depth with ≥90% Q30 base quality for reliable variant calling." },
|
||||
{ title: "Expert Interpretation & Reporting", desc: "Variants classified using ACMG guidelines, backed by curated literature and clinical databases." },
|
||||
{ title: "Genetic Counseling Support", desc: "Optional access to pre- and post-test counseling for patient education and informed decision-making." }
|
||||
{
|
||||
title: "Comprehensive Gene Coverage",
|
||||
desc: "Includes high- and moderate-risk genes such as BRCA1, BRCA2, TP53, MLH1, MSH2, APC, and others.",
|
||||
icon: "/images/icons/gene-coverage.png"
|
||||
},
|
||||
{
|
||||
title: "Germline Variant Detection",
|
||||
desc: "Accurately detects SNVs, Indels, and selected CNVs in genes associated with inherited cancer risk.",
|
||||
icon: "/images/icons/variant-detection.png"
|
||||
},
|
||||
{
|
||||
title: "Family-Centered Testing",
|
||||
desc: "Supports cascade testing for at-risk relatives, enabling early detection and prevention.",
|
||||
icon: "/images/icons/family-centered-testing.png"
|
||||
},
|
||||
{
|
||||
title: "Clinical Actionability",
|
||||
desc: "Provides insights that guide surveillance, preventive measures, and personalized treatment planning.",
|
||||
icon: "/images/icons/clinical-actionability.png"
|
||||
},
|
||||
{
|
||||
title: "High Sensitivity & Specificity",
|
||||
desc: "Uses ≥100X sequencing depth with ≥90% Q30 base quality for reliable variant calling.",
|
||||
icon: "/images/icons/high-sensitivity-specificity.png"
|
||||
},
|
||||
{
|
||||
title: "Expert Interpretation & Reporting",
|
||||
desc: "Variants classified using ACMG guidelines, backed by curated literature and clinical databases.",
|
||||
icon: "/images/icons/expert-interpretation-reporting.png"
|
||||
},
|
||||
{
|
||||
title: "Genetic Counseling Support",
|
||||
desc: "Optional access to pre- and post-test counseling for patient education and informed decision-making.",
|
||||
icon: "/images/icons/social-support.png"
|
||||
}
|
||||
];
|
||||
|
||||
const points = [
|
||||
@ -29,32 +75,24 @@ export default function HereditaryCancerPanel() {
|
||||
style={{backgroundColor: '#faae31'}}
|
||||
></span>
|
||||
<p className="text-gray-600 leading-relaxed text-base text-justify">
|
||||
<strong>{idx === 0 ? "About 5-10% of all cancers are linked to inherited genetic mutations" : ""}</strong>
|
||||
{idx === 0 ? ", often going undetected until late stages or after multiple family members are affected." : point}
|
||||
{point}
|
||||
</p>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<h3 className="text-3xl font-semibold text-teal-700 pb-2 mb-4">Key Features</h3>
|
||||
<div className="overflow-x-auto">
|
||||
<table className="w-full border-collapse border border-gray-300 rounded-lg">
|
||||
<thead>
|
||||
<tr className="bg-teal-50">
|
||||
<th className="border border-gray-300 px-3 py-2 text-left font-semibold text-teal-700">Feature</th>
|
||||
<th className="border border-gray-300 px-3 py-2 text-left font-semibold text-teal-700">Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{features.map((feature, idx) => (
|
||||
<tr key={idx} className="hover:bg-teal-50">
|
||||
<td className="border border-gray-300 px-6 py-3 text-gray-700 font-medium">{feature.title}</td>
|
||||
<td className="border border-gray-300 px-6 py-3 text-gray-600">{feature.desc}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
<h3 className="text-3xl font-bold text-teal-700 mb-6 leading-tight">Key Features</h3>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
|
||||
{features.map((feature, index) => (
|
||||
<FeatureCard
|
||||
key={index}
|
||||
icon={feature.icon}
|
||||
title={feature.title}
|
||||
description={feature.desc}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
|
||||
@ -43,14 +43,31 @@ export default function OncologyIntro() {
|
||||
};
|
||||
|
||||
return (
|
||||
<section>
|
||||
<section className="bg-teal-700">
|
||||
<div className="flex min-h-[350px]">
|
||||
{/* Left Side - Content */}
|
||||
<div className="w-full lg:w-3/4 bg-white">
|
||||
{/* Left Side - Image */}
|
||||
<div className="hidden lg:block w-1/2 relative">
|
||||
<div className="absolute inset-0">
|
||||
<Image
|
||||
src="https://images.unsplash.com/photo-1579684385127-1ef15d508118?ixlib=rb-4.0.3&auto=format&fit=crop&w=1200&q=80"
|
||||
alt="Cancer research and oncology molecular analysis"
|
||||
fill
|
||||
className="object-cover grayscale-[20%]"
|
||||
priority
|
||||
/>
|
||||
<div className="absolute inset-0 bg-slate-900/10"></div>
|
||||
</div>
|
||||
|
||||
{/* Subtle border */}
|
||||
<div className="absolute right-0 top-0 w-px h-full bg-teal-600"></div>
|
||||
</div>
|
||||
|
||||
{/* Right Side - Content */}
|
||||
<div className="w-full lg:w-3/4">
|
||||
<div className="h-full flex flex-col justify-center px-4 lg:px-8 py-4">
|
||||
{/* Brand/Title */}
|
||||
<div className="mb-4">
|
||||
<h2 className="text-3xl font-bold text-teal-700 mb-4">
|
||||
<h2 className="text-3xl font-bold text-white mb-4">
|
||||
<span>Turning</span>
|
||||
<span className="ml-2">Complexity into Clarity</span>
|
||||
</h2>
|
||||
@ -59,7 +76,7 @@ export default function OncologyIntro() {
|
||||
|
||||
{/* Content Slider */}
|
||||
<div className="mb-4 max-w-3xl">
|
||||
<div className="text-gray-600 leading-relaxed text-base mb-4 text-justify font-light transition-opacity duration-500">
|
||||
<div className="text-gray-200 leading-relaxed text-base mb-4 text-justify font-light transition-opacity duration-500">
|
||||
{slides[currentSlide].content}
|
||||
</div>
|
||||
</div>
|
||||
@ -71,18 +88,18 @@ export default function OncologyIntro() {
|
||||
onClick={prevSlide}
|
||||
className="w-8 h-8 flex items-center justify-center border rounded-full transition-all duration-200"
|
||||
style={{
|
||||
borderColor: '#555555',
|
||||
color: '#555555'
|
||||
borderColor: '#ffffff',
|
||||
color: '#ffffff'
|
||||
}}
|
||||
onMouseEnter={(e) => {
|
||||
e.target.style.borderColor = '#faae31';
|
||||
e.target.style.backgroundColor = '#faae31';
|
||||
e.target.style.color = '#2a6564';
|
||||
e.target.style.color = '#0f766e';
|
||||
}}
|
||||
onMouseLeave={(e) => {
|
||||
e.target.style.borderColor = '#555555';
|
||||
e.target.style.borderColor = '#ffffff';
|
||||
e.target.style.backgroundColor = 'transparent';
|
||||
e.target.style.color = '#555555';
|
||||
e.target.style.color = '#ffffff';
|
||||
}}
|
||||
aria-label="Previous slide"
|
||||
>
|
||||
@ -95,18 +112,18 @@ export default function OncologyIntro() {
|
||||
onClick={nextSlide}
|
||||
className="w-8 h-8 flex items-center justify-center border rounded-full transition-all duration-200"
|
||||
style={{
|
||||
borderColor: '#555555',
|
||||
color: '#555555'
|
||||
borderColor: '#ffffff',
|
||||
color: '#ffffff'
|
||||
}}
|
||||
onMouseEnter={(e) => {
|
||||
e.target.style.borderColor = '#faae31';
|
||||
e.target.style.backgroundColor = '#faae31';
|
||||
e.target.style.color = '#2a6564';
|
||||
e.target.style.color = '#0f766e';
|
||||
}}
|
||||
onMouseLeave={(e) => {
|
||||
e.target.style.borderColor = '#555555';
|
||||
e.target.style.borderColor = '#ffffff';
|
||||
e.target.style.backgroundColor = 'transparent';
|
||||
e.target.style.color = '#555555';
|
||||
e.target.style.color = '#ffffff';
|
||||
}}
|
||||
aria-label="Next slide"
|
||||
>
|
||||
@ -125,16 +142,16 @@ export default function OncologyIntro() {
|
||||
style={{
|
||||
width: index === currentSlide ? '24px' : '6px',
|
||||
height: '6px',
|
||||
backgroundColor: index === currentSlide ? '#faae31' : '#555555'
|
||||
backgroundColor: index === currentSlide ? '#faae31' : '#ffffff'
|
||||
}}
|
||||
onMouseEnter={(e) => {
|
||||
if (index !== currentSlide) {
|
||||
e.target.style.backgroundColor = '#2a6564';
|
||||
e.target.style.backgroundColor = '#f1f5f9';
|
||||
}
|
||||
}}
|
||||
onMouseLeave={(e) => {
|
||||
if (index !== currentSlide) {
|
||||
e.target.style.backgroundColor = '#555555';
|
||||
e.target.style.backgroundColor = '#ffffff';
|
||||
}
|
||||
}}
|
||||
aria-label={`Go to slide ${index + 1}`}
|
||||
@ -145,23 +162,6 @@ export default function OncologyIntro() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Right Side - Image */}
|
||||
<div className="hidden lg:block w-1/2 relative">
|
||||
<div className="absolute inset-0">
|
||||
<Image
|
||||
src="https://images.unsplash.com/photo-1579684385127-1ef15d508118?ixlib=rb-4.0.3&auto=format&fit=crop&w=1200&q=80"
|
||||
alt="Cancer research and oncology molecular analysis"
|
||||
fill
|
||||
className="object-cover grayscale-[20%]"
|
||||
priority
|
||||
/>
|
||||
<div className="absolute inset-0 bg-slate-900/10"></div>
|
||||
</div>
|
||||
|
||||
{/* Subtle border */}
|
||||
<div className="absolute left-0 top-0 w-px h-full bg-slate-200"></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
|
||||
@ -1,12 +1,58 @@
|
||||
import React from 'react';
|
||||
import Image from 'next/image';
|
||||
|
||||
const FeatureCard = ({ icon, title, description }) => (
|
||||
<div className="p-6 rounded-2xl shadow-sm border-0 h-full transition-transform duration-300 ease-in-out hover:scale-105 hover:shadow-lg group" style={{ backgroundColor: '#f2fcfc' }}>
|
||||
<div className="flex items-center space-x-4 mb-4">
|
||||
<div className="w-12 h-12 bg-orange-100 rounded-xl flex items-center justify-center flex-shrink-0">
|
||||
<Image src={icon} alt={title} width={24} height={24} />
|
||||
</div>
|
||||
<h3 className="text-lg font-semibold text-teal-700 leading-tight">{title}</h3>
|
||||
</div>
|
||||
<div className="relative w-full h-px bg-gray-300 mb-4 overflow-hidden">
|
||||
<div className="absolute top-0 left-0 h-full bg-gray-600 w-0 group-hover:w-full transition-all duration-500 ease-in-out"></div>
|
||||
</div>
|
||||
<p className="text-gray-600 leading-relaxed text-sm text-justify">{description}</p>
|
||||
</div>
|
||||
);
|
||||
|
||||
export default function HereditaryCancerPanel() {
|
||||
const features = [
|
||||
{ title: "Comprehensive Gene Coverage", desc: "Includes high- and moderate-risk genes such as BRCA1, BRCA2, TP53, MLH1, MSH2, APC, and others." },
|
||||
{ title: "Germline Variant Detection", desc: "Accurately detects SNVs, Indels, and selected CNVs in genes associated with inherited cancer risk." },
|
||||
{ title: "Family-Centered Testing", desc: "Supports cascade testing for at-risk relatives, enabling early detection and prevention." },
|
||||
{ title: "Clinical Actionability", desc: "Provides insights that guide surveillance, preventive measures, and personalized treatment planning." },
|
||||
{ title: "High Sensitivity & Specificity", desc: "Uses ≥100X sequencing depth with ≥90% Q30 base quality for reliable variant calling." },
|
||||
{ title: "Expert Interpretation & Reporting", desc: "Variants classified using ACMG guidelines, backed by curated literature and clinical databases." },
|
||||
{ title: "Genetic Counseling Support", desc: "Optional access to pre- and post-test counseling for patient education and informed decision-making." }
|
||||
{
|
||||
title: "Comprehensive Gene Coverage",
|
||||
desc: "Includes high- and moderate-risk genes such as BRCA1, BRCA2, TP53, MLH1, MSH2, APC, and others.",
|
||||
icon: "/images/icons/gene-coverage.png"
|
||||
},
|
||||
{
|
||||
title: "Germline Variant Detection",
|
||||
desc: "Accurately detects SNVs, Indels, and selected CNVs in genes associated with inherited cancer risk.",
|
||||
icon: "/images/icons/variant-detection.png"
|
||||
},
|
||||
{
|
||||
title: "Family-Centered Testing",
|
||||
desc: "Supports cascade testing for at-risk relatives, enabling early detection and prevention.",
|
||||
icon: "/images/icons/family-centered-testing.png"
|
||||
},
|
||||
{
|
||||
title: "Clinical Actionability",
|
||||
desc: "Provides insights that guide surveillance, preventive measures, and personalized treatment planning.",
|
||||
icon: "/images/icons/clinical-actionability.png"
|
||||
},
|
||||
{
|
||||
title: "High Sensitivity & Specificity",
|
||||
desc: "Uses ≥100X sequencing depth with ≥90% Q30 base quality for reliable variant calling.",
|
||||
icon: "/images/icons/high-sensitivity-specificity.png"
|
||||
},
|
||||
{
|
||||
title: "Expert Interpretation & Reporting",
|
||||
desc: "Variants classified using ACMG guidelines, backed by curated literature and clinical databases.",
|
||||
icon: "/images/icons/expert-interpretation-reporting.png"
|
||||
},
|
||||
{
|
||||
title: "Genetic Counseling Support",
|
||||
desc: "Optional access to pre- and post-test counseling for patient education and informed decision-making.",
|
||||
icon: "/images/icons/social-support.png"
|
||||
}
|
||||
];
|
||||
|
||||
const points = [
|
||||
@ -29,32 +75,24 @@ export default function HereditaryCancerPanel() {
|
||||
style={{backgroundColor: '#faae31'}}
|
||||
></span>
|
||||
<p className="text-gray-600 leading-relaxed text-base text-justify">
|
||||
<strong>{idx === 0 ? "About 5-10% of all cancers are linked to inherited genetic mutations" : ""}</strong>
|
||||
{idx === 0 ? ", often going undetected until late stages or after multiple family members are affected." : point}
|
||||
{point}
|
||||
</p>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<h3 className="text-3xl font-semibold text-teal-700 pb-2 mb-4">Key Features</h3>
|
||||
<div className="overflow-x-auto">
|
||||
<table className="w-full border-collapse border border-gray-300 rounded-lg">
|
||||
<thead>
|
||||
<tr className="bg-teal-50">
|
||||
<th className="border border-gray-300 px-3 py-2 text-left font-semibold text-teal-700">Feature</th>
|
||||
<th className="border border-gray-300 px-3 py-2 text-left font-semibold text-teal-700">Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{features.map((feature, idx) => (
|
||||
<tr key={idx} className="hover:bg-teal-50">
|
||||
<td className="border border-gray-300 px-6 py-3 text-gray-700 font-medium">{feature.title}</td>
|
||||
<td className="border border-gray-300 px-6 py-3 text-gray-600">{feature.desc}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
<h3 className="text-3xl font-bold text-teal-700 mb-6 leading-tight">Key Features</h3>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
|
||||
{features.map((feature, index) => (
|
||||
<FeatureCard
|
||||
key={index}
|
||||
icon={feature.icon}
|
||||
title={feature.title}
|
||||
description={feature.desc}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
|
||||
@ -43,14 +43,31 @@ export default function OncologyIntro() {
|
||||
};
|
||||
|
||||
return (
|
||||
<section>
|
||||
<section className="bg-teal-700">
|
||||
<div className="flex min-h-[350px]">
|
||||
{/* Left Side - Content */}
|
||||
<div className="w-full lg:w-3/4 bg-white">
|
||||
{/* Left Side - Image */}
|
||||
<div className="hidden lg:block w-1/2 relative">
|
||||
<div className="absolute inset-0">
|
||||
<Image
|
||||
src="https://images.unsplash.com/photo-1579684385127-1ef15d508118?ixlib=rb-4.0.3&auto=format&fit=crop&w=1200&q=80"
|
||||
alt="Cancer research and oncology molecular analysis"
|
||||
fill
|
||||
className="object-cover grayscale-[20%]"
|
||||
priority
|
||||
/>
|
||||
<div className="absolute inset-0 bg-slate-900/10"></div>
|
||||
</div>
|
||||
|
||||
{/* Subtle border */}
|
||||
<div className="absolute right-0 top-0 w-px h-full bg-teal-600"></div>
|
||||
</div>
|
||||
|
||||
{/* Right Side - Content */}
|
||||
<div className="w-full lg:w-3/4">
|
||||
<div className="h-full flex flex-col justify-center px-4 lg:px-8 py-4">
|
||||
{/* Brand/Title */}
|
||||
<div className="mb-4">
|
||||
<h2 className="text-3xl font-bold text-teal-700 mb-4">
|
||||
<h2 className="text-3xl font-bold text-white mb-4">
|
||||
<span>Turning</span>
|
||||
<span className="ml-2">Complexity into Clarity</span>
|
||||
</h2>
|
||||
@ -59,7 +76,7 @@ export default function OncologyIntro() {
|
||||
|
||||
{/* Content Slider */}
|
||||
<div className="mb-4 max-w-3xl">
|
||||
<div className="text-gray-600 leading-relaxed text-base mb-4 text-justify font-light transition-opacity duration-500">
|
||||
<div className="text-gray-200 leading-relaxed text-base mb-4 text-justify font-light transition-opacity duration-500">
|
||||
{slides[currentSlide].content}
|
||||
</div>
|
||||
</div>
|
||||
@ -71,18 +88,18 @@ export default function OncologyIntro() {
|
||||
onClick={prevSlide}
|
||||
className="w-8 h-8 flex items-center justify-center border rounded-full transition-all duration-200"
|
||||
style={{
|
||||
borderColor: '#555555',
|
||||
color: '#555555'
|
||||
borderColor: '#ffffff',
|
||||
color: '#ffffff'
|
||||
}}
|
||||
onMouseEnter={(e) => {
|
||||
e.target.style.borderColor = '#faae31';
|
||||
e.target.style.backgroundColor = '#faae31';
|
||||
e.target.style.color = '#2a6564';
|
||||
e.target.style.color = '#0f766e';
|
||||
}}
|
||||
onMouseLeave={(e) => {
|
||||
e.target.style.borderColor = '#555555';
|
||||
e.target.style.borderColor = '#ffffff';
|
||||
e.target.style.backgroundColor = 'transparent';
|
||||
e.target.style.color = '#555555';
|
||||
e.target.style.color = '#ffffff';
|
||||
}}
|
||||
aria-label="Previous slide"
|
||||
>
|
||||
@ -95,18 +112,18 @@ export default function OncologyIntro() {
|
||||
onClick={nextSlide}
|
||||
className="w-8 h-8 flex items-center justify-center border rounded-full transition-all duration-200"
|
||||
style={{
|
||||
borderColor: '#555555',
|
||||
color: '#555555'
|
||||
borderColor: '#ffffff',
|
||||
color: '#ffffff'
|
||||
}}
|
||||
onMouseEnter={(e) => {
|
||||
e.target.style.borderColor = '#faae31';
|
||||
e.target.style.backgroundColor = '#faae31';
|
||||
e.target.style.color = '#2a6564';
|
||||
e.target.style.color = '#0f766e';
|
||||
}}
|
||||
onMouseLeave={(e) => {
|
||||
e.target.style.borderColor = '#555555';
|
||||
e.target.style.borderColor = '#ffffff';
|
||||
e.target.style.backgroundColor = 'transparent';
|
||||
e.target.style.color = '#555555';
|
||||
e.target.style.color = '#ffffff';
|
||||
}}
|
||||
aria-label="Next slide"
|
||||
>
|
||||
@ -125,16 +142,16 @@ export default function OncologyIntro() {
|
||||
style={{
|
||||
width: index === currentSlide ? '24px' : '6px',
|
||||
height: '6px',
|
||||
backgroundColor: index === currentSlide ? '#faae31' : '#555555'
|
||||
backgroundColor: index === currentSlide ? '#faae31' : '#ffffff'
|
||||
}}
|
||||
onMouseEnter={(e) => {
|
||||
if (index !== currentSlide) {
|
||||
e.target.style.backgroundColor = '#2a6564';
|
||||
e.target.style.backgroundColor = '#f1f5f9';
|
||||
}
|
||||
}}
|
||||
onMouseLeave={(e) => {
|
||||
if (index !== currentSlide) {
|
||||
e.target.style.backgroundColor = '#555555';
|
||||
e.target.style.backgroundColor = '#ffffff';
|
||||
}
|
||||
}}
|
||||
aria-label={`Go to slide ${index + 1}`}
|
||||
@ -145,23 +162,6 @@ export default function OncologyIntro() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Right Side - Image */}
|
||||
<div className="hidden lg:block w-1/2 relative">
|
||||
<div className="absolute inset-0">
|
||||
<Image
|
||||
src="https://images.unsplash.com/photo-1579684385127-1ef15d508118?ixlib=rb-4.0.3&auto=format&fit=crop&w=1200&q=80"
|
||||
alt="Cancer research and oncology molecular analysis"
|
||||
fill
|
||||
className="object-cover grayscale-[20%]"
|
||||
priority
|
||||
/>
|
||||
<div className="absolute inset-0 bg-slate-900/10"></div>
|
||||
</div>
|
||||
|
||||
{/* Subtle border */}
|
||||
<div className="absolute left-0 top-0 w-px h-full bg-slate-200"></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
|
||||
@ -21,7 +21,9 @@ export default function OncologyPage() {
|
||||
|
||||
|
||||
{/* Sample Requirements */}
|
||||
<SampleRequirements/>
|
||||
<div className="pb-8">
|
||||
<SampleRequirements/>
|
||||
</div>
|
||||
</PageLayout>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user