diff --git a/app/health/Components/HealthIntro.jsx b/app/health/Components/HealthIntro.jsx index ea43c45..1554674 100644 --- a/app/health/Components/HealthIntro.jsx +++ b/app/health/Components/HealthIntro.jsx @@ -42,14 +42,31 @@ export default function AboutHealth() { }; return ( -
+
- {/* Left Side - Content */} -
+ {/* Left Side - Image */} +
+
+ Healthcare professional working in modern laboratory +
+
+ + {/* Subtle border */} +
+
+ + {/* Right Side - Content */} +
{/* Brand/Title */}
-

+

Operify Health

@@ -58,7 +75,7 @@ export default function AboutHealth() { {/* Content Slider */}
-
+
{slides[currentSlide].content}
@@ -70,18 +87,18 @@ export default function AboutHealth() { 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" > @@ -94,18 +111,18 @@ export default function AboutHealth() { 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" > @@ -124,16 +141,16 @@ export default function AboutHealth() { 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}`} @@ -144,23 +161,6 @@ export default function AboutHealth() {
- - {/* Right Side - Image */} -
-
- Healthcare professional working in modern laboratory -
-
- - {/* Subtle border */} -
-
); diff --git a/app/health/components/HealthIntro.jsx b/app/health/components/HealthIntro.jsx index ea43c45..1554674 100644 --- a/app/health/components/HealthIntro.jsx +++ b/app/health/components/HealthIntro.jsx @@ -42,14 +42,31 @@ export default function AboutHealth() { }; return ( -
+
- {/* Left Side - Content */} -
+ {/* Left Side - Image */} +
+
+ Healthcare professional working in modern laboratory +
+
+ + {/* Subtle border */} +
+
+ + {/* Right Side - Content */} +
{/* Brand/Title */}
-

+

Operify Health

@@ -58,7 +75,7 @@ export default function AboutHealth() { {/* Content Slider */}
-
+
{slides[currentSlide].content}
@@ -70,18 +87,18 @@ export default function AboutHealth() { 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" > @@ -94,18 +111,18 @@ export default function AboutHealth() { 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" > @@ -124,16 +141,16 @@ export default function AboutHealth() { 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}`} @@ -144,23 +161,6 @@ export default function AboutHealth() {
- - {/* Right Side - Image */} -
-
- Healthcare professional working in modern laboratory -
-
- - {/* Subtle border */} -
-
); diff --git a/app/health/oncology/Components/HereditaryCancerPanel.jsx b/app/health/oncology/Components/HereditaryCancerPanel.jsx index a04d309..f173309 100644 --- a/app/health/oncology/Components/HereditaryCancerPanel.jsx +++ b/app/health/oncology/Components/HereditaryCancerPanel.jsx @@ -1,12 +1,58 @@ +import React from 'react'; +import Image from 'next/image'; + +const FeatureCard = ({ icon, title, description }) => ( +
+
+
+ {title} +
+

{title}

+
+
+
+
+

{description}

+
+); + 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'}} >

- {idx === 0 ? "About 5-10% of all cancers are linked to inherited genetic mutations" : ""} - {idx === 0 ? ", often going undetected until late stages or after multiple family members are affected." : point} + {point}

))} -

Key Features

-
- - - - - - - - - {features.map((feature, idx) => ( - - - - - ))} - -
FeatureDescription
{feature.title}{feature.desc}
+

Key Features

+ +
+ {features.map((feature, index) => ( + + ))}
); diff --git a/app/health/oncology/Components/OncologyIntro.jsx b/app/health/oncology/Components/OncologyIntro.jsx index 2506e93..9067537 100644 --- a/app/health/oncology/Components/OncologyIntro.jsx +++ b/app/health/oncology/Components/OncologyIntro.jsx @@ -43,14 +43,31 @@ export default function OncologyIntro() { }; return ( -
+
- {/* Left Side - Content */} -
+ {/* Left Side - Image */} +
+
+ Cancer research and oncology molecular analysis +
+
+ + {/* Subtle border */} +
+
+ + {/* Right Side - Content */} +
{/* Brand/Title */}
-

+

Turning Complexity into Clarity

@@ -59,7 +76,7 @@ export default function OncologyIntro() { {/* Content Slider */}
-
+
{slides[currentSlide].content}
@@ -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() {
- - {/* Right Side - Image */} -
-
- Cancer research and oncology molecular analysis -
-
- - {/* Subtle border */} -
-
); diff --git a/app/health/oncology/components/HereditaryCancerPanel.jsx b/app/health/oncology/components/HereditaryCancerPanel.jsx index a04d309..f173309 100644 --- a/app/health/oncology/components/HereditaryCancerPanel.jsx +++ b/app/health/oncology/components/HereditaryCancerPanel.jsx @@ -1,12 +1,58 @@ +import React from 'react'; +import Image from 'next/image'; + +const FeatureCard = ({ icon, title, description }) => ( +
+
+
+ {title} +
+

{title}

+
+
+
+
+

{description}

+
+); + 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'}} >

- {idx === 0 ? "About 5-10% of all cancers are linked to inherited genetic mutations" : ""} - {idx === 0 ? ", often going undetected until late stages or after multiple family members are affected." : point} + {point}

))} -

Key Features

-
- - - - - - - - - {features.map((feature, idx) => ( - - - - - ))} - -
FeatureDescription
{feature.title}{feature.desc}
+

Key Features

+ +
+ {features.map((feature, index) => ( + + ))}
); diff --git a/app/health/oncology/components/OncologyIntro.jsx b/app/health/oncology/components/OncologyIntro.jsx index 2506e93..9067537 100644 --- a/app/health/oncology/components/OncologyIntro.jsx +++ b/app/health/oncology/components/OncologyIntro.jsx @@ -43,14 +43,31 @@ export default function OncologyIntro() { }; return ( -
+
- {/* Left Side - Content */} -
+ {/* Left Side - Image */} +
+
+ Cancer research and oncology molecular analysis +
+
+ + {/* Subtle border */} +
+
+ + {/* Right Side - Content */} +
{/* Brand/Title */}
-

+

Turning Complexity into Clarity

@@ -59,7 +76,7 @@ export default function OncologyIntro() { {/* Content Slider */}
-
+
{slides[currentSlide].content}
@@ -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() {
- - {/* Right Side - Image */} -
-
- Cancer research and oncology molecular analysis -
-
- - {/* Subtle border */} -
-
); diff --git a/app/health/oncology/page.js b/app/health/oncology/page.js index 17929e6..1d2615b 100644 --- a/app/health/oncology/page.js +++ b/app/health/oncology/page.js @@ -21,7 +21,9 @@ export default function OncologyPage() { {/* Sample Requirements */} - +
+ +
); -} +} \ No newline at end of file diff --git a/app/health/rare-disorders/components/RareIntro.jsx b/app/health/rare-disorders/components/RareIntro.jsx index cf32a41..1db4d21 100644 --- a/app/health/rare-disorders/components/RareIntro.jsx +++ b/app/health/rare-disorders/components/RareIntro.jsx @@ -37,14 +37,31 @@ export default function RareIntro() { }; return ( -
+
- {/* Left Side - Content */} -
+ {/* Left Side - Image */} +
+
+ DNA sequencing and genetic analysis in modern laboratory +
+
+ + {/* Subtle border */} +
+
+ + {/* Right Side - Content */} +
{/* Brand/Title */}
-

+

Transforming Delays into Diagnoses

@@ -53,7 +70,7 @@ export default function RareIntro() { {/* Content Slider */}
-
+
{slides[currentSlide].content}
@@ -65,18 +82,18 @@ export default function RareIntro() { 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" > @@ -89,18 +106,18 @@ export default function RareIntro() { 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" > @@ -119,16 +136,16 @@ export default function RareIntro() { 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}`} @@ -139,23 +156,6 @@ export default function RareIntro() {
- - {/* Right Side - Image */} -
-
- DNA sequencing and genetic analysis in modern laboratory -
-
- - {/* Subtle border */} -
-
); diff --git a/app/health/rare-disorders/exome/components/OperifyExome.jsx b/app/health/rare-disorders/exome/components/OperifyExome.jsx index adec47d..f512d92 100644 --- a/app/health/rare-disorders/exome/components/OperifyExome.jsx +++ b/app/health/rare-disorders/exome/components/OperifyExome.jsx @@ -1,12 +1,58 @@ +import React from 'react'; +import Image from 'next/image'; + +const FeatureCard = ({ icon, title, description }) => ( +
+
+
+ {title} +
+

{title}

+
+
+
+
+

{description}

+
+); + export default function OperifyExome() { const features = [ - { title: "Deep Coverage", desc: "≥100X average depth for high accuracy." }, - { title: "Superior Data Quality", desc: "≥90% bases with Q30 score." }, - { title: "Comprehensive Variant Detection", desc: "Identifies SNVs, Indels, and CNVs." }, - { title: "Uniparental Disomy Analysis", desc: "Detects UPD regions for imprinting disorders." }, - { title: "Coverage of Complex Genes", desc: "Includes SMN1, SMN2, and DMD." }, - { title: "Chromosomal Assessment", desc: "Detects aneuploidies and determines chromosomal sex." }, - { title: "Dynamic Reanalysis", desc: "Reanalysis as scientific knowledge evolves." } + { + title: "Deep Coverage", + desc: "≥100X average depth for high accuracy.", + icon: "/images/icons/deep-coverage.png" + }, + { + title: "Superior Data Quality", + desc: "≥90% bases with Q30 score.", + icon: "/images/icons/data-quality.png" + }, + { + title: "Comprehensive Variant Detection", + desc: "Identifies SNVs, Indels, and CNVs.", + icon: "/images/icons/variant-detection.png" + }, + { + title: "Uniparental Disomy Analysis", + desc: "Detects UPD regions for imprinting disorders.", + icon: "/images/icons/upd-analysis.png" + }, + { + title: "Coverage of Complex Genes", + desc: "Includes SMN1, SMN2, and DMD.", + icon: "/images/icons/complex-genes.png" + }, + { + title: "Chromosomal Assessment", + desc: "Detects aneuploidies and determines chromosomal sex.", + icon: "/images/icons/chromosomal.png" + }, + { + title: "Dynamic Reanalysis", + desc: "Reanalysis as scientific knowledge evolves.", + icon: "/images/icons/reanalysis.png" + } ]; const points = [ @@ -36,24 +82,17 @@ export default function OperifyExome() { -

Key Features

-
- - - - - - - - - {features.map((feature, idx) => ( - - - - - ))} - -
FeatureDescription
{feature.title}{feature.desc}
+

Key Features

+ +
+ {features.map((feature, index) => ( + + ))}
); diff --git a/app/health/rare-disorders/exomemito/components/OperifyExomeMito.jsx b/app/health/rare-disorders/exomemito/components/OperifyExomeMito.jsx index a5c809a..652edce 100644 --- a/app/health/rare-disorders/exomemito/components/OperifyExomeMito.jsx +++ b/app/health/rare-disorders/exomemito/components/OperifyExomeMito.jsx @@ -1,12 +1,58 @@ +import React from 'react'; +import Image from 'next/image'; + +const FeatureCard = ({ icon, title, description }) => ( +
+
+
+ {title} +
+

{title}

+
+
+
+
+

{description}

+
+); + export default function OperifyExomeMito() { const features = [ - { title: "High Mean Target Depth", desc: "≥100X coverage for reliable detection." }, - { title: "High Base Quality", desc: "≥90% of bases with Q30 score." }, - { title: "Scope of Test", desc: "Covers SNVs/Indels, CNVs in nuclear and mitochondrial genome." }, - { title: "Uniparental Disomy", desc: "Detects regions important in rare recessive conditions." }, - { title: "Homologous Gene Analysis", desc: "Includes SMN1, SMN2, DMD." }, - { title: "Aneuploidy & Ploidy Estimation", desc: "Detects abnormal chromosome numbers and sex karyotype." }, - { title: "Reanalysis & Reclassification", desc: "Updates based on latest scientific knowledge." } + { + title: "High Mean Target Depth", + desc: "≥100X coverage for reliable detection.", + icon: "/images/icons/deep-coverage.png" + }, + { + title: "High Base Quality", + desc: "≥90% of bases with Q30 score.", + icon: "/images/icons/data-quality.png" + }, + { + title: "Scope of Test", + desc: "Covers SNVs/Indels, CNVs in nuclear and mitochondrial genome.", + icon: "/images/icons/scope-test.png" + }, + { + title: "Uniparental Disomy", + desc: "Detects regions important in rare recessive conditions.", + icon: "/images/icons/variant-detection.png" + }, + { + title: "Homologous Gene Analysis", + desc: "Includes SMN1, SMN2, DMD.", + icon: "/images/icons/functional-genomics.png" + }, + { + title: "Aneuploidy & Ploidy Estimation", + desc: "Detects abnormal chromosome numbers and sex karyotype.", + icon: "/images/icons/chromosomal.png" + }, + { + title: "Reanalysis & Reclassification", + desc: "Updates based on latest scientific knowledge.", + icon: "/images/icons/reanalysis.png" + } ]; const genomeCoverage = [ @@ -27,7 +73,7 @@ export default function OperifyExomeMito() {

Operify ExomeMito

Boost diagnostic yield with Exome + Mito Sequencing

-
+
    {points.map((point, idx) => (
  • @@ -65,24 +111,17 @@ export default function OperifyExomeMito() {
-

Key Features

-
- - - - - - - - - {features.map((feature, idx) => ( - - - - - ))} - -
FeatureDescription
{feature.title}{feature.desc}
+

Key Features

+ +
+ {features.map((feature, index) => ( + + ))}
); diff --git a/public/images/icons/chromosomal.png b/public/images/icons/chromosomal.png new file mode 100644 index 0000000..fadb499 Binary files /dev/null and b/public/images/icons/chromosomal.png differ diff --git a/public/images/icons/clinical-actionability.png b/public/images/icons/clinical-actionability.png new file mode 100644 index 0000000..90c842a Binary files /dev/null and b/public/images/icons/clinical-actionability.png differ diff --git a/public/images/icons/complex-genes.png b/public/images/icons/complex-genes.png new file mode 100644 index 0000000..45b6a45 Binary files /dev/null and b/public/images/icons/complex-genes.png differ diff --git a/public/images/icons/data-quality.png b/public/images/icons/data-quality.png new file mode 100644 index 0000000..f014040 Binary files /dev/null and b/public/images/icons/data-quality.png differ diff --git a/public/images/icons/deep-coverage.png b/public/images/icons/deep-coverage.png new file mode 100644 index 0000000..1b0b0f3 Binary files /dev/null and b/public/images/icons/deep-coverage.png differ diff --git a/public/images/icons/expert-interpretation-reporting.png b/public/images/icons/expert-interpretation-reporting.png new file mode 100644 index 0000000..e2128e6 Binary files /dev/null and b/public/images/icons/expert-interpretation-reporting.png differ diff --git a/public/images/icons/family-centered-testing.png b/public/images/icons/family-centered-testing.png new file mode 100644 index 0000000..1d8160d Binary files /dev/null and b/public/images/icons/family-centered-testing.png differ diff --git a/public/images/icons/functional-genomics.png b/public/images/icons/functional-genomics.png new file mode 100644 index 0000000..35d5412 Binary files /dev/null and b/public/images/icons/functional-genomics.png differ diff --git a/public/images/icons/gene-coverage.png b/public/images/icons/gene-coverage.png new file mode 100644 index 0000000..1203850 Binary files /dev/null and b/public/images/icons/gene-coverage.png differ diff --git a/public/images/icons/high-sensitivity-specificity.png b/public/images/icons/high-sensitivity-specificity.png new file mode 100644 index 0000000..68c8602 Binary files /dev/null and b/public/images/icons/high-sensitivity-specificity.png differ diff --git a/public/images/icons/reanalysis.png b/public/images/icons/reanalysis.png new file mode 100644 index 0000000..dc1db25 Binary files /dev/null and b/public/images/icons/reanalysis.png differ diff --git a/public/images/icons/scope-test.png b/public/images/icons/scope-test.png new file mode 100644 index 0000000..62445e5 Binary files /dev/null and b/public/images/icons/scope-test.png differ diff --git a/public/images/icons/social-support.png b/public/images/icons/social-support.png new file mode 100644 index 0000000..c83de0d Binary files /dev/null and b/public/images/icons/social-support.png differ diff --git a/public/images/icons/upd-analysis.png b/public/images/icons/upd-analysis.png new file mode 100644 index 0000000..5f2b9e8 Binary files /dev/null and b/public/images/icons/upd-analysis.png differ diff --git a/public/images/icons/variant-detection.png b/public/images/icons/variant-detection.png new file mode 100644 index 0000000..79c8b25 Binary files /dev/null and b/public/images/icons/variant-detection.png differ