From 24ec58a76b0a26fb11d17a1f970f45601754396f Mon Sep 17 00:00:00 2001 From: mukesh13 Date: Thu, 21 Aug 2025 12:40:06 +0530 Subject: [PATCH] UI styling update --- app/components/shared/ApplicationsLayout.jsx | 16 +-- .../shared/BioinformaticsLayout.jsx | 2 +- app/components/shared/DNATitleBar.jsx | 12 +-- app/components/shared/IntroductionLayout.jsx | 101 +++++++++++------- .../shared/SpecificationsLayout.jsx | 5 +- .../components/AmpliconIntroduction.jsx | 12 ++- .../amplicon-sequencing/page.js | 1 - .../components/EnrichmentIntroduction.jsx | 12 ++- .../components/EnrichmentPipeline.jsx | 15 ++- .../enrichment-sequencing/page.js | 1 - .../components/TargetedIntroduction.jsx | 12 ++- .../targeted-sequencing/page.js | 1 - .../components/ExomeIntroduction.jsx | 12 ++- .../enrichment-sequencing/whole-exome/page.js | 1 - .../components/ATACIntroduction.jsx | 12 ++- .../atac-sequencing/page.js | 2 - .../components/ChIPIntroduction.jsx | 12 ++- .../chip-sequencing/page.js | 2 - .../components/EpigenomicsIntroduction.jsx | 13 ++- .../components/EpigenomicsPipeline.jsx | 15 ++- .../epigenomics-sequencing/page.js | 1 - .../wgbs/components/WGBSApplications.jsx | 2 +- .../wgbs/components/WGBSIntroduction.jsx | 13 ++- .../epigenomics-sequencing/wgbs/page.js | 2 - .../components/GenomeMappingIntroduction.jsx | 12 ++- .../components/GenomeMappingPipeline.jsx | 15 ++- .../components/HiCMappingIntroduction.jsx | 12 ++- .../genome-mapping/hi-c-mapping/page.js | 2 - .../components/OpticalMappingIntroduction.jsx | 12 ++- .../genome-mapping/optical-mapping/page.js | 3 - app/dna-sequencing/genome-mapping/page.js | 2 - .../components/HybridIntroduction.jsx | 12 ++- .../hybrid-genome-sequencing/page.js | 3 - .../components/LongReadIntroduction.jsx | 6 +- .../components/MetagenomicsIntroduction.jsx | 12 ++- .../components/MetagenomicsPipeline.jsx | 15 ++- .../metagenomics-sequencing/page.js | 3 +- .../MicrosatellitesIntroduction.jsx | 13 ++- .../microsatellites-ssr-str/page.js | 3 - .../components/SingleCellIntroduction.jsx | 13 ++- .../components/SingleCellPipeline.jsx | 15 ++- .../single-cell-dna-sequencing/page.js | 2 - .../components/SNPIntroduction.jsx | 13 ++- app/dna-sequencing/snp-genotyping/page.js | 1 - .../components/WGSIntroduction.jsx | 12 ++- .../denovo/components/DenovoIntroduction.jsx | 14 ++- .../denovo/components/WGSDeNovoPipeline.tsx | 15 ++- .../whole-genome-sequencing/denovo/page.js | 1 - .../whole-genome-sequencing/page.js | 2 - .../components/ResequencingIntroduction.jsx | 12 ++- .../components/WGSResequencingPipeline.jsx | 15 ++- .../resequencing/page.js | 1 - .../components/CircularIntroduction.jsx | 12 ++- .../components/CircularRNAPipeline.jsx | 15 ++- .../components/DegradomeIntroduction.jsx | 12 ++- .../DegradomeSequencingPipeline.jsx | 15 ++- .../degradome-sequencing/page.js | 1 - .../components/IsoIntroduction.jsx | 12 ++- .../components/IsoformPipeline.jsx | 15 ++- app/rna-sequencing/iso-sequencing/page.js | 1 - .../components/LncRNABioinformatics.jsx | 15 ++- .../components/LncRNAIntroduction.jsx | 12 ++- app/rna-sequencing/lncrna-sequencing/page.js | 1 - .../MetatranscriptomicsIntroduction.jsx | 12 ++- .../MetatranscriptomicsPipeline.jsx | 15 ++- .../metatranscriptomics-sequencing/page.js | 1 - .../components/MRNAIntroduction.jsx | 14 ++- .../components/MRNAPipeline.jsx | 15 ++- app/rna-sequencing/mrna-sequencing/page.js | 1 - .../components/SingleCellIntroduction.jsx | 12 ++- .../components/SingleCellPipeline.jsx | 15 ++- .../components/SRNABioinformatics.jsx | 15 ++- .../components/SRNAIntroduction.jsx | 14 ++- .../small-rna-sequencing/page.js | 1 - .../components/WTSIntroduction.jsx | 16 ++- .../components/WTSPipeline.jsx | 15 ++- .../whole-transcriptome-sequencing/page.js | 1 - public/images/flowchart/denovo.svg | 55 +++++----- 78 files changed, 524 insertions(+), 307 deletions(-) diff --git a/app/components/shared/ApplicationsLayout.jsx b/app/components/shared/ApplicationsLayout.jsx index a6d95e2..527942f 100644 --- a/app/components/shared/ApplicationsLayout.jsx +++ b/app/components/shared/ApplicationsLayout.jsx @@ -3,20 +3,24 @@ const ApplicationsLayout = ({ title = "Applications", applicationItems = [], - backgroundColor = "bg-gray-50", + backgroundColor = "bg-teal-50", titleColor = "text-gray-700" }) => { return ( -
+
-

+

{title}

-
    +
      {applicationItems.map((item, index) => ( -
    • - {item} +
    • + + {item}
    • ))}
    diff --git a/app/components/shared/BioinformaticsLayout.jsx b/app/components/shared/BioinformaticsLayout.jsx index 9326c39..93a99e3 100644 --- a/app/components/shared/BioinformaticsLayout.jsx +++ b/app/components/shared/BioinformaticsLayout.jsx @@ -18,7 +18,7 @@ const BioinformaticsLayout = ({ return (
    -

    +

    {title}

    diff --git a/app/components/shared/DNATitleBar.jsx b/app/components/shared/DNATitleBar.jsx index 85cb622..0fa8f9f 100644 --- a/app/components/shared/DNATitleBar.jsx +++ b/app/components/shared/DNATitleBar.jsx @@ -4,8 +4,8 @@ import Link from 'next/link'; const DNATitleBar = ({ title, desc, breadcrumbs, backgroundImage = "/images/bredcrumb.jpg" }) => { return ( -
    {/* Breadcrumb */} @@ -19,8 +19,8 @@ const DNATitleBar = ({ title, desc, breadcrumbs, backgroundImage = "/images/bred {crumb.label} ) : ( - {crumb.label} @@ -38,13 +38,13 @@ const DNATitleBar = ({ title, desc, breadcrumbs, backgroundImage = "/images/bred
- + {/* Page Title */}

{title}

-

+

{desc}

diff --git a/app/components/shared/IntroductionLayout.jsx b/app/components/shared/IntroductionLayout.jsx index 0aa43dd..f596489 100644 --- a/app/components/shared/IntroductionLayout.jsx +++ b/app/components/shared/IntroductionLayout.jsx @@ -1,46 +1,75 @@ -// components/shared/IntroductionLayout.jsx -const IntroductionLayout = ({ - title = "Introduction and Workflow", - contentItems = [], +import React from 'react'; + +const CombinedWorkflowLayout = ({ + introTitle = "Introduction and Workflow", + advantageTitle = "Advantage", + introItems = [], + advantageItems = [], imageUrl, - imageAlt = "", - badgeText, - badgeSubtext, - backgroundColor = "#f8f9fa", - badgeColor = "bg-teal-600" + imageAlt = "Workflow diagram" }) => { return ( -
-
-

- {title} -

+
+ {/* Main container with two columns */} +
- {/* Two column layout */} -
- {/* Left side content */} -
-
    - {contentItems.map((item, index) => ( -
  • {item}
  • + {/* Left Column - Content */} +
    + {/* Introduction Section */} +
    +

    + {introTitle} +

    +
      + {introItems.map((item, index) => ( +
    • + + {item} +
    • ))}
    -
    - - {/* Right side image - increased image size */} -
    - {imageUrl && ( - {imageAlt} - )} -
    +
+ + {/* Advantage Section */} +
+

+ {advantageTitle} +

+
    + {advantageItems.map((item, index) => ( +
  • + + {item} +
  • + ))} +
+
+
+ + {/* Right Column - Workflow Image */} +
+ {imageUrl ? ( + {imageAlt} + ) : ( +
+

Workflow image will appear here

+

Please provide the imageUrl prop

+
+ )}
-
+ ); }; -export default IntroductionLayout; \ No newline at end of file + +export default CombinedWorkflowLayout; \ No newline at end of file diff --git a/app/components/shared/SpecificationsLayout.jsx b/app/components/shared/SpecificationsLayout.jsx index 93f6a1d..6c6e13d 100644 --- a/app/components/shared/SpecificationsLayout.jsx +++ b/app/components/shared/SpecificationsLayout.jsx @@ -3,17 +3,16 @@ import Link from 'next/link'; const SpecificationsLayout = ({ title = "Service Specifications", - titleColor = "text-gray-800", specificationItems = [], backgroundColor = "#e8f5f3", iconBackgroundColor = "bg-teal-600" }) => { return ( -
+
{/* Section Header */}
-

+

{title}

diff --git a/app/dna-sequencing/enrichment-sequencing/amplicon-sequencing/components/AmpliconIntroduction.jsx b/app/dna-sequencing/enrichment-sequencing/amplicon-sequencing/components/AmpliconIntroduction.jsx index 32eed88..ab95d8d 100644 --- a/app/dna-sequencing/enrichment-sequencing/amplicon-sequencing/components/AmpliconIntroduction.jsx +++ b/app/dna-sequencing/enrichment-sequencing/amplicon-sequencing/components/AmpliconIntroduction.jsx @@ -9,11 +9,19 @@ const AmpliconIntroduction = () => { "This multiplexing enables the simultaneous targeting of hundreds of genes from various libraries in a single run.", "This method is particularly useful for studying genetic variation, microbial communities, and evolutionary relationships. By selectively amplifying regions of interest, such as 16S rRNA for bacteria or ITS regions for fungi." ]; + const advantageItems = [ + "Unlike targeted or exome sequencing, amplicon sequencing narrows down to even smaller, highly specific regions, resulting in a more efficient and focused approach for certain applications, such as microbial diversity studies or detecting rare variants.", + "Capable of detecting low-abundance species or genetic variants, providing specific resolution of target regions.", + "Focuses on specific genomic regions, allowing for detailed and precise analysis.", + "Provides quick insights into genetic composition and diversity, facilitating timely research and diagnostics." + ]; return ( -
diff --git a/app/dna-sequencing/enrichment-sequencing/components/EnrichmentIntroduction.jsx b/app/dna-sequencing/enrichment-sequencing/components/EnrichmentIntroduction.jsx index 350acf7..197f09e 100644 --- a/app/dna-sequencing/enrichment-sequencing/components/EnrichmentIntroduction.jsx +++ b/app/dna-sequencing/enrichment-sequencing/components/EnrichmentIntroduction.jsx @@ -9,6 +9,12 @@ const EnrichmentIntroduction = () => { "In the bioinformatics analysis, these reads are aligned to a known reference genome to detect genomic alterations.", "It is a powerful tool for diverse genomic studies, capable of sequencing humans, livestock, plants, bacteria, and disease-related microbes." ]; + const advantageItems = [ + "Provides a more affordable alternative to Whole Genome Sequencing (WGS), making it accessible to a wider range of researchers and clinicians.", + "Enhances detection of single-nucleotide variants (SNVs), copy number variants (CNVs), and insertions/deletions (InDels) with sensitivity and accuracy comparable to WGS, particularly in exonic regions.", + "Produces smaller data sets compared to WGS, allowing for quicker and more straightforward data analysis, which accelerates research and diagnostics.", + "Focuses on exonic regions, which are more likely to harbor disease-causing variants, leading to a more efficient and targeted approach in identifying genetic variants." + ]; const customBadgeContent = (
@@ -31,8 +37,10 @@ const EnrichmentIntroduction = () => { return ( { return ( -
+
-

+

{title}

@@ -22,19 +21,19 @@ const EnrichmentPipeline = ({
- {/* SVG Container with responsive sizing */} -
+ {/* SVG Container with responsive sizing and reduced height */} +
{svgUrl ? ( // If SVG URL/path is provided Flowchart diagram ) : svgContent ? ( // If SVG content is provided as JSX -
-
+
+
{svgContent}
diff --git a/app/dna-sequencing/enrichment-sequencing/page.js b/app/dna-sequencing/enrichment-sequencing/page.js index 5787758..074ac86 100644 --- a/app/dna-sequencing/enrichment-sequencing/page.js +++ b/app/dna-sequencing/enrichment-sequencing/page.js @@ -22,7 +22,6 @@ export default function EnrichmentSequencingPage() {
-
diff --git a/app/dna-sequencing/enrichment-sequencing/targeted-sequencing/components/TargetedIntroduction.jsx b/app/dna-sequencing/enrichment-sequencing/targeted-sequencing/components/TargetedIntroduction.jsx index 34e4ea2..0fdd3a5 100644 --- a/app/dna-sequencing/enrichment-sequencing/targeted-sequencing/components/TargetedIntroduction.jsx +++ b/app/dna-sequencing/enrichment-sequencing/targeted-sequencing/components/TargetedIntroduction.jsx @@ -9,11 +9,19 @@ const TargetedIntroduction = () => { "Advanced bioinformatics tools are employed to analyze the sequencing data, providing detailed insights into genetic variants, their potential impact, and relevance to disease.", "Targeted sequencing is widely used in clinical settings for the diagnosis of genetic disorders, personalized medicine, and cancer genomics, providing actionable insights that can directly impact patient care." ]; + const advantageItems = [ + "Focuses on specific genes or genomic regions, providing high-resolution analysis of mutations that are most relevant to particular diseases or conditions.", + "Delivers deep coverage of targeted regions, increasing the likelihood of detecting low-frequency variants and rare mutations.", + "The streamlined workflow and reduced data set enable quicker data processing and analysis, allowing for more rapid diagnostic and research outcomes.", + "Widely used in clinical settings, targeted sequencing enables the identification of actionable genetic variants that can guide personalized treatment strategies." + ]; return ( -
diff --git a/app/dna-sequencing/enrichment-sequencing/whole-exome/components/ExomeIntroduction.jsx b/app/dna-sequencing/enrichment-sequencing/whole-exome/components/ExomeIntroduction.jsx index 1610100..36d60dc 100644 --- a/app/dna-sequencing/enrichment-sequencing/whole-exome/components/ExomeIntroduction.jsx +++ b/app/dna-sequencing/enrichment-sequencing/whole-exome/components/ExomeIntroduction.jsx @@ -9,11 +9,19 @@ const ExomeIntroduction = () => { "Pinpoints potential disease-causing mutations, providing valuable insights for population genetics, genetic disease research, and cancer studies.", "Extensively utilized in diagnostic setting to detect clinically relevant genomic alterations associated with phenotype of the patient." ]; + const advantageItems = [ + "Cost-effective as compared to Whole Genome Sequencing (WGS), making it accessible to a broader range of researchers and clinicians.", + "WES offers extensive sequencing of exonic regions, improving the detection of single-nucleotide variants (SNVs), copy number variants (CNVs), and insertions/deletions (InDels) with a sensitivity comparable to WGS, ensuring high accuracy in identifying genetic variants.", + "WES generates a smaller data set compared to WGS, facilitating faster and easier data analysis, which can expedite research and diagnostic processes.", + "WES is widely used in both medical and agricultural fields, supporting advancements in disease diagnosis, personalized medicine, and crop improvement. Provides a comprehensive, high-resolution view of the genome, surpassing the coverage offered by targeted sequencing." + ]; return ( -
diff --git a/app/dna-sequencing/epigenomics-sequencing/atac-sequencing/components/ATACIntroduction.jsx b/app/dna-sequencing/epigenomics-sequencing/atac-sequencing/components/ATACIntroduction.jsx index 2cfe945..a11bfb8 100644 --- a/app/dna-sequencing/epigenomics-sequencing/atac-sequencing/components/ATACIntroduction.jsx +++ b/app/dna-sequencing/epigenomics-sequencing/atac-sequencing/components/ATACIntroduction.jsx @@ -9,11 +9,19 @@ const ATACIntroduction = () => { "The sequenced fragments are analysed using advanced bioinformatics tools to characterize the regulatory landscape, including chromatin accessibility, nucleosome mapping, and transcription factor binding.", "Assist in numerous applications like biomarker discovery, identification of novel enhancer, analysis of cell-type specific regulation, evolutionary studies and comparative epigenomic studies." ]; + const advantageItems = [ + "ATAC-seq has become the method of choice for studying chromatin accessibility due to its efficiency and robust performance.", + "Requires only 50,000 cells per sample, offering high sensitivity and making it ideal for studies with limited cell populations. This technique is versatile, applicable to both bulk tissue and single-cell analysis.", + "Features simplified experimental steps, offering good reproducibility and a high success rate in generating reliable data.", + "Simultaneously reveals the genomic locations of open chromatin, DNA-binding proteins, and transcription factor binding site interactions, providing a holistic view of chromatin accessibility." + ]; return ( - -
diff --git a/app/dna-sequencing/epigenomics-sequencing/chip-sequencing/components/ChIPIntroduction.jsx b/app/dna-sequencing/epigenomics-sequencing/chip-sequencing/components/ChIPIntroduction.jsx index 30fda13..5f6743b 100644 --- a/app/dna-sequencing/epigenomics-sequencing/chip-sequencing/components/ChIPIntroduction.jsx +++ b/app/dna-sequencing/epigenomics-sequencing/chip-sequencing/components/ChIPIntroduction.jsx @@ -9,11 +9,19 @@ const ChIPIntroduction = () => { "Following this, NGS libraries are created by adding adapters and amplifying the DNA, which is subsequently sequenced on an Illumina platform.", "It provides valuable insights into gene regulation, revealing dysregulated pathways in cancers, developmental processes, and other biological phenomena." ]; + const advantageItems = [ + "Offers detailed genome-wide mapping of protein-DNA interactions, identifying binding sites of transcription factors, regulators, and other DNA-associated proteins.", + "Utilizes specific antibodies to precisely capture and sequence protein-DNA complexes, providing accurate reflections of in vivo binding events.", + "Reveals critical insights into gene regulation and chromatin dynamics, aiding in the understanding of gene expression, regulatory mechanisms, and epigenetic modifications.", + "Facilitates studies on gene regulation in various contexts, including developmental processes, cancer research, and other biological phenomena, enhancing our understanding of complex biological systems and diseases." + ]; return ( - -
diff --git a/app/dna-sequencing/epigenomics-sequencing/components/EpigenomicsIntroduction.jsx b/app/dna-sequencing/epigenomics-sequencing/components/EpigenomicsIntroduction.jsx index 2f040fd..f9c9ef3 100644 --- a/app/dna-sequencing/epigenomics-sequencing/components/EpigenomicsIntroduction.jsx +++ b/app/dna-sequencing/epigenomics-sequencing/components/EpigenomicsIntroduction.jsx @@ -9,6 +9,13 @@ const EpigenomicsIntroduction = () => { "In the bioinformatics analysis, these reads are aligned to a known reference genome to detect genomic alterations and epigenetic modifications.", "It is a powerful tool for diverse genomic studies, capable of sequencing humans, livestock, plants, bacteria, and disease-related microbes." ]; + const advantageItems = [ + "Provides comprehensive analysis of epigenetic modifications including DNA methylation, histone modifications, and chromatin accessibility, offering insights into gene regulation mechanisms.", + "Enables single-base resolution mapping of epigenetic marks across the genome, allowing for precise identification of regulatory elements and their modifications.", + "Reveals epigenetic alterations associated with diseases, development, and environmental responses, providing insights into cellular memory and inheritance patterns.", + "Identifies potential therapeutic targets and biomarkers for epigenetic-based treatments, supporting the development of personalized medicine approaches." + ]; + const serviceTypes = [ "Whole Genome Bisulphite Sequencing (WGBS)", @@ -18,8 +25,10 @@ const EpigenomicsIntroduction = () => { return ( { return ( -
+
-

+

{title}

@@ -22,19 +21,19 @@ const EpigenomicsPipeline = ({
- {/* SVG Container with responsive sizing */} -
+ {/* SVG Container with responsive sizing and reduced height */} +
{svgUrl ? ( // If SVG URL/path is provided Flowchart diagram ) : svgContent ? ( // If SVG content is provided as JSX -
-
+
+
{svgContent}
diff --git a/app/dna-sequencing/epigenomics-sequencing/page.js b/app/dna-sequencing/epigenomics-sequencing/page.js index 939ed8d..663e9cb 100644 --- a/app/dna-sequencing/epigenomics-sequencing/page.js +++ b/app/dna-sequencing/epigenomics-sequencing/page.js @@ -23,7 +23,6 @@ export default function EpigenomicsSequencingPage() {
-
diff --git a/app/dna-sequencing/epigenomics-sequencing/wgbs/components/WGBSApplications.jsx b/app/dna-sequencing/epigenomics-sequencing/wgbs/components/WGBSApplications.jsx index 4457965..5eaf063 100644 --- a/app/dna-sequencing/epigenomics-sequencing/wgbs/components/WGBSApplications.jsx +++ b/app/dna-sequencing/epigenomics-sequencing/wgbs/components/WGBSApplications.jsx @@ -1,5 +1,5 @@ // WGBSApplications.jsx -import ApplicationsLayout from '../../../../components/shared/AdvantagesLayout'; +import ApplicationsLayout from '../../../../components/shared/ApplicationsLayout'; const WGBSApplications = () => { const applicationItems = [ diff --git a/app/dna-sequencing/epigenomics-sequencing/wgbs/components/WGBSIntroduction.jsx b/app/dna-sequencing/epigenomics-sequencing/wgbs/components/WGBSIntroduction.jsx index 3bebb20..c3cd231 100644 --- a/app/dna-sequencing/epigenomics-sequencing/wgbs/components/WGBSIntroduction.jsx +++ b/app/dna-sequencing/epigenomics-sequencing/wgbs/components/WGBSIntroduction.jsx @@ -9,11 +9,20 @@ const WGBSIntroduction = () => { "In bioinformatics analysis, sequencing data is aligned to a reference genome using advanced bioinformatics tools to determine the methylation status at CpG, CHG, and CHH sites.", "Valuable in epigenetic research for its ability to provide high-resolution insights into the regulatory mechanisms of the genome, offering a deeper understanding of cellular functions and molecular pathways." ]; + const advantageItems = [ + "Provides high-resolution mapping of DNA methylation patterns across the genome, including CpG, CHG, and CHH sites, offering detailed insights into epigenetic modifications.", + "Enables precise quantification of methylation levels, distinguishing between methylated and unmethylated cytosines based on read counts.", + "This technique can detect effective CpG sites reaching over 75% of all CpG sites in the entire genome.", + "Provides valuable insights into cell fate determination, genetic reprogramming, gene regulation, developmental epigenetics, disease mechanisms, and the identification of new epigenetic markers and therapeutic targets." + ]; + return ( - -
diff --git a/app/dna-sequencing/genome-mapping/components/GenomeMappingIntroduction.jsx b/app/dna-sequencing/genome-mapping/components/GenomeMappingIntroduction.jsx index e71661a..4893e0c 100644 --- a/app/dna-sequencing/genome-mapping/components/GenomeMappingIntroduction.jsx +++ b/app/dna-sequencing/genome-mapping/components/GenomeMappingIntroduction.jsx @@ -8,6 +8,12 @@ const GenomeMappingIntroduction = () => { "In the bioinformatics analysis, these reads are aligned to a known reference genome to detect genomic alterations and structural arrangements.", "It is a powerful tool for diverse genomic studies, capable of sequencing humans, livestock, plants, bacteria, and disease-related microbes." ]; + const advantageItems = [ + "Provides detailed structural variant detection and genomic rearrangements, offering comprehensive insights into complex genomic architecture.", + "Enables high-resolution analysis of large eukaryotic genomes and their structural features, facilitating better understanding of genome organization.", + "Offers comprehensive mapping capabilities that reveal the three-dimensional structure of chromosomes and identify regulatory interactions between distant genomic regions.", + "Supports multiple research applications including cancer research, developmental biology, and evolutionary studies by providing detailed genomic structural information." + ]; const serviceTypes = [ "HiC Mapping", @@ -16,8 +22,10 @@ const GenomeMappingIntroduction = () => { return ( { return ( -
+
-

+

{title}

@@ -22,19 +21,19 @@ const GenomeMappingPipeline = ({
- {/* SVG Container with responsive sizing */} -
+ {/* SVG Container with responsive sizing and reduced height */} +
{svgUrl ? ( // If SVG URL/path is provided Flowchart diagram ) : svgContent ? ( // If SVG content is provided as JSX -
-
+
+
{svgContent}
diff --git a/app/dna-sequencing/genome-mapping/hi-c-mapping/components/HiCMappingIntroduction.jsx b/app/dna-sequencing/genome-mapping/hi-c-mapping/components/HiCMappingIntroduction.jsx index ffb5b86..cf04b03 100644 --- a/app/dna-sequencing/genome-mapping/hi-c-mapping/components/HiCMappingIntroduction.jsx +++ b/app/dna-sequencing/genome-mapping/hi-c-mapping/components/HiCMappingIntroduction.jsx @@ -10,11 +10,19 @@ const HiCMappingIntroduction = () => { "The sequenced reads are processed using advanced bioinformatics tools, starting with alignment to a reference genome, followed by the identification of chromatin loops and the construction of 3D models of genome organization.", "Plays pivotal role in multiple applications, including identifying promoter-enhancer interactions for gene regulation studies, detecting structural rearrangements, scaffolding contigs to define chromosomes de novo, and revealing structural errors while accurately reintegrating mis-joined contigs during genome assembly processes." ]; + const advantageItems = [ + "Quantifies interactions between closely located genomic loci in 3-D space, despite being separated by many nucleotides in the linear genome.", + "Provides a detailed view of the 3D architecture of the genome, helping researchers understand how chromatin folding impacts gene regulation, genome organization, and cellular function.", + "Captures interactions between distant regions of DNA, enabling the mapping of chromatin loops, topologically associated domains (TADs), and other structural features at high resolution.", + "By revealing interactions between regulatory elements, such as enhancers and promoters, Hi-C mapping sheds light on how gene expression is controlled at the epigenetic and transcriptional levels." + ]; return ( - {/* Advantages Section */} - {/* Applications Section */} diff --git a/app/dna-sequencing/genome-mapping/optical-mapping/components/OpticalMappingIntroduction.jsx b/app/dna-sequencing/genome-mapping/optical-mapping/components/OpticalMappingIntroduction.jsx index f129498..b7a12b1 100644 --- a/app/dna-sequencing/genome-mapping/optical-mapping/components/OpticalMappingIntroduction.jsx +++ b/app/dna-sequencing/genome-mapping/optical-mapping/components/OpticalMappingIntroduction.jsx @@ -10,11 +10,19 @@ const OpticalMappingIntroduction = () => { "This allows for the comparison of genomic maps, identification of rearrangements, and integration with other sequencing data for comprehensive genome analysis.", "With the application in clinical and discovery research, the technique is improving genomics assembly, understanding of genetic disease and cancer by detecting CNVs, chromosomal aberrations and structural variants. Enables high-resolution analysis of large eukaryotic genomes and their structural features." ]; + const advantageItems = [ + "Offers detailed genome-wide mapping of protein-DNA interactions, identifying binding sites of transcription factors, regulators, and other DNA-associated proteins.", + "Utilizes specific antibodies to precisely capture and sequence protein-DNA complexes, providing accurate reflections of in vivo binding events.", + "Reveals critical insights into gene regulation and chromatin dynamics, aiding in the understanding of gene expression, regulatory mechanisms, and epigenetic modifications.", + "Facilitates studies on gene regulation in various contexts, including developmental processes, cancer research, and other biological phenomena, enhancing our understanding of complex biological systems and diseases." + ]; return ( - {/* Advantages Section */} - - {/* Applications Section */} diff --git a/app/dna-sequencing/genome-mapping/page.js b/app/dna-sequencing/genome-mapping/page.js index 1d158be..682bf2c 100644 --- a/app/dna-sequencing/genome-mapping/page.js +++ b/app/dna-sequencing/genome-mapping/page.js @@ -46,8 +46,6 @@ export default function GenomeMappingPage() { {/* Introduction Section */} - {/* Advantages Section */} - {/* Specifications Section */} diff --git a/app/dna-sequencing/hybrid-genome-sequencing/components/HybridIntroduction.jsx b/app/dna-sequencing/hybrid-genome-sequencing/components/HybridIntroduction.jsx index 1a9655f..7c254b2 100644 --- a/app/dna-sequencing/hybrid-genome-sequencing/components/HybridIntroduction.jsx +++ b/app/dna-sequencing/hybrid-genome-sequencing/components/HybridIntroduction.jsx @@ -8,11 +8,19 @@ const HybridIntroduction = () => { "Following sequencing, advanced bioinformatics tools are used to align and integrate the long and short reads, enhancing variant detection and improving the resolution of complex genomic regions.", "Hybrid sequencing is applicable to a wide range of research areas, from complex genome assemblies to resolving repetitive regions and improving the quality of reference genomes." ]; + const advantageItems = [ + "Combines long-read and short-read sequencing for more complete and accurate genome assemblies, effectively resolving complex regions and reducing gaps.", + "Balances the cost efficiency of short-read sequencing with the detailed resolution of long-read sequencing, making it a budget-friendly choice for comprehensive genome analysis.", + "Enhances detection of structural variants, such as large insertions and deletions, improving the understanding of genetic diversity and disease mechanisms.", + "Provides better coverage of challenging genomic features, like high GC content and repetitive sequences, by leveraging the strengths of both sequencing technologies." + ]; return ( - {/* Advantages Section */} - - {/* Bioinformatics Pipeline Section */} {/* */} diff --git a/app/dna-sequencing/long-read-sequencing/components/LongReadIntroduction.jsx b/app/dna-sequencing/long-read-sequencing/components/LongReadIntroduction.jsx index b238288..fccc56a 100644 --- a/app/dna-sequencing/long-read-sequencing/components/LongReadIntroduction.jsx +++ b/app/dna-sequencing/long-read-sequencing/components/LongReadIntroduction.jsx @@ -10,8 +10,10 @@ const LongReadIntroduction = () => { return ( { "Bioinformatics analysis encompasses sequence alignment, taxonomy identification, and phylogenetic analysis. Additional analyses may involve functional annotation, comparative genomics, and statistical evaluations.", "Can be used to study diverse environmental samples like water, soil, and fecal matter, providing valuable insights into microbial diversity and host-microbiome interactions." ]; + const advantageItems = [ + "Offers a comprehensive view of microbial diversity in complex samples, capturing both known and novel species. NGS enables the parallel sequencing of thousands of organisms in a single run, providing high sequence coverage and detecting low-abundance microbes that may be missed or are cost-prohibitive with other techniques.", + "Analyzes genomes directly from environmental samples without prior isolation or cultivation, overcoming the limitations of traditional culture-based methods. This approach is effective for studying microbial communities in their natural habitats.", + "Reveals the metabolic capabilities and functional diversity of microbial communities, enhancing our understanding of ecosystem processes and microbial roles within various environments.", + "Facilitates detailed genetic and ecological analysis, supporting studies on microbial interactions, evolution, and adaptation, with broad applications in environmental monitoring, biotechnology, agriculture, and human health." + ]; return ( { return ( -
+
-

+

{title}

@@ -22,19 +21,19 @@ const MetagenomicsPipeline = ({
- {/* SVG Container with responsive sizing */} -
+ {/* SVG Container with responsive sizing and reduced height */} +
{svgUrl ? ( // If SVG URL/path is provided Flowchart diagram ) : svgContent ? ( // If SVG content is provided as JSX -
-
+
+
{svgContent}
diff --git a/app/dna-sequencing/metagenomics-sequencing/page.js b/app/dna-sequencing/metagenomics-sequencing/page.js index fdcc83e..c1c6ba5 100644 --- a/app/dna-sequencing/metagenomics-sequencing/page.js +++ b/app/dna-sequencing/metagenomics-sequencing/page.js @@ -47,8 +47,7 @@ export default function MetagenomicsSequencingPage() { {/* Introduction Section */} - {/* Advantages Section */} - + {/* Applications Section */} diff --git a/app/dna-sequencing/microsatellites-ssr-str/components/MicrosatellitesIntroduction.jsx b/app/dna-sequencing/microsatellites-ssr-str/components/MicrosatellitesIntroduction.jsx index ffe8903..0f02c1e 100644 --- a/app/dna-sequencing/microsatellites-ssr-str/components/MicrosatellitesIntroduction.jsx +++ b/app/dna-sequencing/microsatellites-ssr-str/components/MicrosatellitesIntroduction.jsx @@ -9,11 +9,20 @@ const MicrosatellitesIntroduction = () => { "Electropherogram data is converted into allele calls, allowing allele size analysis, frequency distribution, and individual or population-level genotype matching.", "Microsatellite-based genotyping is widely applied in fields like conservation genetics, forensic science, and agriculture." ]; + const advantageItems = [ + "Highly variable in repeat number among individuals, making them effective for distinguishing genetic differences within and between populations.", + "Unlike multi-locus markers like minisatellites, microsatellites are locus-specific, providing precise, targeted genetic information for detailed genotyping and genetic mapping.", + "Highly reproducible across labs, making it a reliable method for studies requiring consistent and repeatable results, such as population genetics and forensic analysis.", + "Show co-dominant inheritance, allowing the detection of both alleles at a locus for accurate identification of heterozygous and homozygous genotypes." + ]; + return ( - {/* Advantages Section */} - - {/* Applications Section */} diff --git a/app/dna-sequencing/single-cell-dna-sequencing/components/SingleCellIntroduction.jsx b/app/dna-sequencing/single-cell-dna-sequencing/components/SingleCellIntroduction.jsx index 6a3f24d..115b06a 100644 --- a/app/dna-sequencing/single-cell-dna-sequencing/components/SingleCellIntroduction.jsx +++ b/app/dna-sequencing/single-cell-dna-sequencing/components/SingleCellIntroduction.jsx @@ -9,11 +9,20 @@ const SingleCellIntroduction = () => { "During sequencing, the barcode identifiers enable precise tracking of data to its specific cell or nucleus of origin, thereby providing comprehensive genetic insights for individual cells.", "This technique enables researchers to unravel unique genetic characteristics and variations present within individual cells, providing unprecedented insights into cellular diversity and function." ]; + const advantageItems = [ + "DNA exhibits greater stability compared to RNA, ensuring ample time for sample processing without degradation.", + "Capable of detecting rare mutation-bearing cell clones with sensitivity levels as low as 0.1%, enabling direct analysis of rare cell types or primary cells even with limited samples.", + "Reveals the diversity of genetic profiles within cell populations, aiding in the study of complex biological processes and enabling precise profiling of subpopulations like cancer cell evolution or DNA copy number variations in neurons.", + "Allows for the tracking of genetic changes over time within individual cells, crucial for understanding disease progression and evolution." + ]; + return ( { return ( -
+
-

+

{title}

@@ -22,19 +21,19 @@ const SingleCellPipeline = ({
- {/* SVG Container with responsive sizing */} -
+ {/* SVG Container with responsive sizing and reduced height */} +
{svgUrl ? ( // If SVG URL/path is provided Flowchart diagram ) : svgContent ? ( // If SVG content is provided as JSX -
-
+
+
{svgContent}
diff --git a/app/dna-sequencing/single-cell-dna-sequencing/page.js b/app/dna-sequencing/single-cell-dna-sequencing/page.js index 46bc113..c05fc06 100644 --- a/app/dna-sequencing/single-cell-dna-sequencing/page.js +++ b/app/dna-sequencing/single-cell-dna-sequencing/page.js @@ -47,8 +47,6 @@ export default function SingleCellDNASequencingPage() { {/* Introduction Section */} - {/* Advantages Section */} - {/* Applications Section */} diff --git a/app/dna-sequencing/snp-genotyping/components/SNPIntroduction.jsx b/app/dna-sequencing/snp-genotyping/components/SNPIntroduction.jsx index 4e66eba..b5111e9 100644 --- a/app/dna-sequencing/snp-genotyping/components/SNPIntroduction.jsx +++ b/app/dna-sequencing/snp-genotyping/components/SNPIntroduction.jsx @@ -5,6 +5,13 @@ const SNPIntroduction = () => { const contentItems = [ "SNP-based genotyping identifies single nucleotide polymorphisms (SNPs) across the genome, offering insights into genetic diversity, disease associations, and trait inheritance. It is widely applied in population genetics, evolutionary biology, and plant and animal breeding." ]; + const advantageItems = [ + "Allows for precise identification of genetic variations at a single nucleotide level, enabling detailed mapping of genetic diversity.", + "Provides an efficient, cost-effective solution for analyzing thousands of SNPs across large populations, ideal for high-throughput studies.", + "SNP markers are stable and abundant across genomes, providing high data quality, reproducibility, and scalability, which are essential for reliable genetic studies, comparative analyses across multiple populations or species, and make SNP-based genotyping a powerful tool for both research and applied genomics.", + "Can reveal associations between genetic variations and complex traits, allowing researchers to identify genetic contributors to health, disease, or productivity in agriculture." + ]; + const serviceTypes = [ "DNA Sequencing", @@ -14,8 +21,10 @@ const SNPIntroduction = () => { return ( -
diff --git a/app/dna-sequencing/whole-genome-sequencing/components/WGSIntroduction.jsx b/app/dna-sequencing/whole-genome-sequencing/components/WGSIntroduction.jsx index ceb71cb..2190018 100644 --- a/app/dna-sequencing/whole-genome-sequencing/components/WGSIntroduction.jsx +++ b/app/dna-sequencing/whole-genome-sequencing/components/WGSIntroduction.jsx @@ -9,11 +9,19 @@ const WGSIntroduction = () => { "In the bioinformatics analysis, these reads are then assembled to construct the genome or aligned to a known reference genome.", "It is a powerful tool for diverse genomic studies, capable of sequencing humans, livestock, plants, bacteria, and disease-related microbes." ]; + const advantageItems = [ + "Provides a comprehensive, high-resolution view of the genome, surpassing the coverage offered by targeted sequencing.", + "Identifies both small (SNVs, CNVs, InDels) and large structural variants that may be missed with targeted approaches, offering valuable insights into inherited genetic conditions and characterizing mutations driving cancer progression.", + "Generates large volumes of data quickly, facilitating the assembly of novel genomes.", + "Uncovers genomic diversity, taxonomic classifications, and evolutionary relationships, enhancing our understanding of biological complexity." + ]; return ( { - const contentItems = [ + const introItems = [ "Whole Genome Denovo Sequencing involves sequencing an organism's entire genome from scratch, without a reference genome. This approach is essential for species with unsequenced or incomplete genomes.", "The workflow includes isolating DNA, fragmenting it, and sequencing to produce millions of short reads.", "These reads are then assembled into longer sequences, called contigs, using bioinformatics tools in the genome assembly process.", "It can be used for sequencing diverse species, such as agriculturally important livestock, plants, bacteria, or disease-related microbes." ]; + const advantageItems = [ + "Eliminates the need for pre-existing reference genomes, which allows for the discovery of novel genetic elements and variations that may not be present in other genomes, providing a truly unbiased view of the genome.", + "Identifies new genes and genetic variations that may be missed by relying on reference genomes alone.", + "Offers high-resolution insights into the genome, including complex regions such as repetitive sequences and heterochromatic regions, which are often challenging to assemble with other sequencing approaches.", + "Enhances our understanding of genetic diversity, facilitates comparative genomics, and contributes significantly to advancements in genomic research across various fields." + ]; return ( { return ( -
+
-

+

{title}

@@ -22,19 +21,19 @@ const WGSDeNovoPipeline = ({
- {/* SVG Container with responsive sizing */} -
+ {/* SVG Container with responsive sizing and reduced height */} +
{svgUrl ? ( // If SVG URL/path is provided Flowchart diagram ) : svgContent ? ( // If SVG content is provided as JSX -
-
+
+
{svgContent}
diff --git a/app/dna-sequencing/whole-genome-sequencing/denovo/page.js b/app/dna-sequencing/whole-genome-sequencing/denovo/page.js index 7502bf1..ef52ef1 100644 --- a/app/dna-sequencing/whole-genome-sequencing/denovo/page.js +++ b/app/dna-sequencing/whole-genome-sequencing/denovo/page.js @@ -24,7 +24,6 @@ export default function WholeGenomeDenovoPage() {
- diff --git a/app/dna-sequencing/whole-genome-sequencing/page.js b/app/dna-sequencing/whole-genome-sequencing/page.js index 786a2be..f8190e1 100644 --- a/app/dna-sequencing/whole-genome-sequencing/page.js +++ b/app/dna-sequencing/whole-genome-sequencing/page.js @@ -1,7 +1,6 @@ // app/dna-sequencing/whole-genome-sequencing/page.js (Updated) import DNATitleBar from '../../components/shared/DNATitleBar'; import WGSIntroduction from './components/WGSIntroduction'; -import WGSAdvantages from './components/WGSAdvantages'; import WGSSpecifications from './components/WGSSpecifications'; import PageLayout from '@/app/components/Layout/PageLayout'; @@ -22,7 +21,6 @@ export default function WholeGenomeSequencingPage() {
-
diff --git a/app/dna-sequencing/whole-genome-sequencing/resequencing/components/ResequencingIntroduction.jsx b/app/dna-sequencing/whole-genome-sequencing/resequencing/components/ResequencingIntroduction.jsx index ad1fd13..f0aa8b0 100644 --- a/app/dna-sequencing/whole-genome-sequencing/resequencing/components/ResequencingIntroduction.jsx +++ b/app/dna-sequencing/whole-genome-sequencing/resequencing/components/ResequencingIntroduction.jsx @@ -9,11 +9,19 @@ const ResequencingIntroduction = () => { "These reads undergo alignment to a reference genome, followed by the analysis of genetic variations using advanced bioinformatics tools.", "It enables detailed analysis of genetic variations across diverse species like humans, plants, and bacteria." ]; + const advantageItems = [ + "Provides a detailed examination of an organism's entire genome, revealing all genetic variations compared to a reference genome.", + "Enables accurate identification of single nucleotide polymorphisms (SNPs), insertions, deletions, and structural variants, crucial for understanding genetic diversity and disease mechanisms.", + "Facilitates the discovery of genetic markers associated with diseases, guiding personalized treatment approaches.", + "Supports diverse studies including evolutionary biology, agricultural genetics, and microbial genomics, enhancing insights into genetic adaptations and relationships across species." + ]; return ( { return ( -
+
-

+

{title}

@@ -22,19 +21,19 @@ const WGSResequencingPipeline = ({
- {/* SVG Container with responsive sizing */} -
+ {/* SVG Container with responsive sizing and reduced height */} +
{svgUrl ? ( // If SVG URL/path is provided Flowchart diagram ) : svgContent ? ( // If SVG content is provided as JSX -
-
+
+
{svgContent}
diff --git a/app/dna-sequencing/whole-genome-sequencing/resequencing/page.js b/app/dna-sequencing/whole-genome-sequencing/resequencing/page.js index be9ab37..348dad9 100644 --- a/app/dna-sequencing/whole-genome-sequencing/resequencing/page.js +++ b/app/dna-sequencing/whole-genome-sequencing/resequencing/page.js @@ -24,7 +24,6 @@ export default function WholeGenomeResequencingPage() {
- diff --git a/app/rna-sequencing/circular-rna-sequencing/components/CircularIntroduction.jsx b/app/rna-sequencing/circular-rna-sequencing/components/CircularIntroduction.jsx index f8ce92f..2f94d66 100644 --- a/app/rna-sequencing/circular-rna-sequencing/components/CircularIntroduction.jsx +++ b/app/rna-sequencing/circular-rna-sequencing/components/CircularIntroduction.jsx @@ -8,11 +8,19 @@ const CircularIntroduction = () => { "The workflow starts with isolating total RNA from the sample, which includes both linear and circular RNAs. Linear RNAs are then removed through ribosomal RNA (rRNA) depletion or exonuclease treatment to enrich the circular RNA fraction. Next, the RNA is circularized, and sequencing adapters are added during library preparation. The final step involves sequencing the prepared libraries.", "Bioinformatics analysis for circRNA sequencing involves preprocessing data and mapping reads to a reference genome to identify back-splicing junctions. Computational tools are then used to quantify circRNA expression, discover novel circRNAs, and perform downstream analysis." ]; + const advantageItems = [ + "Circular RNAs are inherently more stable due to their covalently closed structure, making them less susceptible to degradation and providing reliable expression data.", + "Enables the identification of novel isoforms and splice variants that may not be detected with traditional RNA sequencing methods.", + "Offers a detailed view of circular RNA expression and their interactions within the cell, aiding in a deeper understanding of gene regulation and cellular processes.", + "Closed-loop structure of circRNAs minimizes potential sequencing artifacts, leading to more accurate and consistent data." + ]; return ( { return ( -
+
-

+

{title}

@@ -22,19 +21,19 @@ const CircularRNAPipeline = ({
- {/* SVG Container with responsive sizing */} -
+ {/* SVG Container with responsive sizing and reduced height */} +
{svgUrl ? ( // If SVG URL/path is provided Flowchart diagram ) : svgContent ? ( // If SVG content is provided as JSX -
-
+
+
{svgContent}
diff --git a/app/rna-sequencing/degradome-sequencing/components/DegradomeIntroduction.jsx b/app/rna-sequencing/degradome-sequencing/components/DegradomeIntroduction.jsx index 168bc47..5a7eb4f 100644 --- a/app/rna-sequencing/degradome-sequencing/components/DegradomeIntroduction.jsx +++ b/app/rna-sequencing/degradome-sequencing/components/DegradomeIntroduction.jsx @@ -8,11 +8,19 @@ const DegradomeIntroduction = () => { "Bioinformatics analysis for Degradome Sequencing include data preprocessing, aligning reads to reference genomes, identifying miRNA/ta-siRNA cleavage sites, and quantifying cleaved targets, revealing RNA decay dynamics and regulatory mechanisms.", "The method facilitates the discovery of novel miRNAs and ta-siRNAs, studies on miRNA-mediated gene regulation, and comparative RNA decay analysis across species, contributing to a comprehensive understanding of RNA life cycles." ]; + const advantageItems = [ + "Degradome sequencing provides a focused analysis of RNA degradation, specifically targeting cleavage sites mediated by miRNAs and ta-siRNAs, making it ideal for studying gene regulation and RNA stability.", + "By targeting degradation products, degradome sequencing minimizes the impact of intact RNAs, enhancing sensitivity for detecting miRNA targets and cleavage events.", + "Degradome sequencing focuses on RNA cleavage sites, eliminating the need for additional steps like ribosomal RNA removal, making it a more cost-effective alternative to broader transcriptome studies.", + "Degradome sequencing enables the identification of novel regulatory elements, such as circRNAs and biomarkers, expanding its utility in understanding RNA regulatory networks." + ]; return ( { return ( -
+
-

+

{title}

@@ -22,19 +21,19 @@ const DegradomeSequencingPipeline = ({
- {/* SVG Container with responsive sizing */} -
+ {/* SVG Container with responsive sizing and reduced height */} +
{svgUrl ? ( // If SVG URL/path is provided Flowchart diagram ) : svgContent ? ( // If SVG content is provided as JSX -
-
+
+
{svgContent}
diff --git a/app/rna-sequencing/degradome-sequencing/page.js b/app/rna-sequencing/degradome-sequencing/page.js index e0a448d..43fd82d 100644 --- a/app/rna-sequencing/degradome-sequencing/page.js +++ b/app/rna-sequencing/degradome-sequencing/page.js @@ -20,7 +20,6 @@ export default function DegradomeSequencingPage() { breadcrumbs={breadcrumbs} /> - diff --git a/app/rna-sequencing/iso-sequencing/components/IsoIntroduction.jsx b/app/rna-sequencing/iso-sequencing/components/IsoIntroduction.jsx index ec11cfc..9a44009 100644 --- a/app/rna-sequencing/iso-sequencing/components/IsoIntroduction.jsx +++ b/app/rna-sequencing/iso-sequencing/components/IsoIntroduction.jsx @@ -9,11 +9,19 @@ const IsoIntroduction = () => { "The bioinformatics analysis of Iso-Seq data involves assembling full-length transcripts, annotating them, and comparing them to reference genomes or existing databases. This detailed analysis reveals the complexity of gene expression, including novel isoforms and splice variants, and aids in understanding their functional roles in various biological processes.", "Iso-Seq using PacBio is particularly valuable for exploring gene expression at a granular level, discovering novel transcripts, and enhancing annotations of complex genomes." ]; + const advantageItems = [ + "Unlike traditional methods, which may miss complex isoforms or splice variants, Iso-Seq captures full-length RNA sequences, enabling the identification of all transcript isoforms, including those with complex splicing and alternative start or end sites.", + "Provides high-fidelity data with long read lengths, reducing errors and missing information common in shorter-read sequencing methods.", + "Reduces challenges with transcript assembly and alignment by providing full-length reads that eliminate ambiguities and enhance transcriptome reconstruction accuracy. Improves genome annotations by precisely identifying gene structures, exons, introns, and regulatory elements, leading to more accurate functional insights.", + "Uncovers novel isoforms, splice variants, and post-transcriptional modifications, providing a comprehensive view of gene expression. This detailed approach is essential for functional genomics, transcriptomics, and alternative splicing studies, offering valuable insights into gene regulation and function." + ]; return ( { return ( -
+
-

+

{title}

@@ -22,19 +21,19 @@ const IsoformPipeline = ({
- {/* SVG Container with responsive sizing */} -
+ {/* SVG Container with responsive sizing and reduced height */} +
{svgUrl ? ( // If SVG URL/path is provided Flowchart diagram ) : svgContent ? ( // If SVG content is provided as JSX -
-
+
+
{svgContent}
diff --git a/app/rna-sequencing/iso-sequencing/page.js b/app/rna-sequencing/iso-sequencing/page.js index ddb4539..700857b 100644 --- a/app/rna-sequencing/iso-sequencing/page.js +++ b/app/rna-sequencing/iso-sequencing/page.js @@ -20,7 +20,6 @@ export default function IsoSequencingPage() { breadcrumbs={breadcrumbs} /> - diff --git a/app/rna-sequencing/lncrna-sequencing/components/LncRNABioinformatics.jsx b/app/rna-sequencing/lncrna-sequencing/components/LncRNABioinformatics.jsx index 793c72e..cae58d4 100644 --- a/app/rna-sequencing/lncrna-sequencing/components/LncRNABioinformatics.jsx +++ b/app/rna-sequencing/lncrna-sequencing/components/LncRNABioinformatics.jsx @@ -5,16 +5,15 @@ const LncRNABioinformatics = ({ svgContent = null, // Pass your SVG content here as JSX svgUrl = "/images/flowchart/totalrna.svg", backgroundColor = "bg-gray-50", - textColor = "text-gray-700", className = "", titleClassName = "", svgClassName = "", containerClassName = "" }) => { return ( -
+
-

+

{title}

@@ -22,19 +21,19 @@ const LncRNABioinformatics = ({
- {/* SVG Container with responsive sizing */} -
+ {/* SVG Container with responsive sizing and reduced height */} +
{svgUrl ? ( // If SVG URL/path is provided Flowchart diagram ) : svgContent ? ( // If SVG content is provided as JSX -
-
+
+
{svgContent}
diff --git a/app/rna-sequencing/lncrna-sequencing/components/LncRNAIntroduction.jsx b/app/rna-sequencing/lncrna-sequencing/components/LncRNAIntroduction.jsx index 6b642ac..43e32b0 100644 --- a/app/rna-sequencing/lncrna-sequencing/components/LncRNAIntroduction.jsx +++ b/app/rna-sequencing/lncrna-sequencing/components/LncRNAIntroduction.jsx @@ -8,11 +8,19 @@ const LncRNAIntroduction = () => { "The bioinformatics pipeline for lncRNA sequencing involves the alignment of sequencing data to reference genomes, identification of lncRNAs, quantification of their expression level, and other downstream analyses.", "lncRNA sequencing uncovers their roles in gene regulation and highlights their various functions, including chromatin remodeling, transcriptional control, nucleosome repositioning, and post-transcriptional processing." ]; + const advantageItems = [ + "Identifies both well-known and novel lncRNAs, providing fresh insights into their roles and potential as biomarkers.", + "Reveals lncRNAs' involvement in a broad range of molecular functions, such as chromatin remodeling, which is essential for regulating gene expression. This process includes modifying chromatin structure to control gene accessibility and influencing various cellular mechanisms, demonstrating lncRNAs' crucial roles in gene regulation and cellular function across mammals and plants.", + "Provides a thorough understanding of lncRNAs' roles in gene regulation, encompassing both transcriptional and post-transcriptional levels. It highlights how lncRNAs affect transcription factors, alter nucleosome positioning, and contribute to RNA splicing and stability, thus impacting overall gene expression and cellular processes.", + "Enables high-resolution analysis, allowing for precise detection and detailed characterization of lncRNA expression and their regulatory networks, offering a deep dive into their functional roles within cells." + ]; return ( - diff --git a/app/rna-sequencing/metatranscriptomics-sequencing/components/MetatranscriptomicsIntroduction.jsx b/app/rna-sequencing/metatranscriptomics-sequencing/components/MetatranscriptomicsIntroduction.jsx index de594e3..34ac1b9 100644 --- a/app/rna-sequencing/metatranscriptomics-sequencing/components/MetatranscriptomicsIntroduction.jsx +++ b/app/rna-sequencing/metatranscriptomics-sequencing/components/MetatranscriptomicsIntroduction.jsx @@ -8,11 +8,19 @@ const MetatranscriptomicsIntroduction = () => { "The bioinformatics workflow includes preprocessing the raw sequencing reads, performing quality control, and normalizing the data. The reads are mapped to reference genomes or databases to quantify gene expression levels. Functional annotation and pathway analysis are then carried out to understand the roles of various transcripts and their impact on microbial community functions.", "Metatranscriptomics is applicable to a wide range of environmental samples, such as soil, oceans, and the human gut, facilitating studies on microbial diversity, disease mechanisms, nutrient cycling, and environmental adaptation." ]; + const advantageItems = [ + "Provides insights into the functional dynamics of microorganisms by revealing active gene expression and their roles within complex communities. This approach uncovers how microorganisms contribute to ecosystem processes and their interactions.", + "Analyzes microbial communities directly from environmental samples, removing the need for isolating or cultivating individual microbes. This method captures a more comprehensive view of microbial diversity.", + "Uses next-generation sequencing (NGS) to identify novel genes and track transcriptional changes, offering high-resolution data on gene expression. This allows for precise identification of active genes, pathways, and regulatory networks within microbial communities.", + "Offers an advantage over metagenomics by including both microbial species information and gene expression data. This dual focus provides a deeper understanding of microbial community changes from a transcriptional perspective and aids in the discovery of potential new genes." + ]; return ( { return ( -
+
-

+

{title}

@@ -22,19 +21,19 @@ const MetatranscriptomicsPipeline = ({
- {/* SVG Container with responsive sizing */} -
+ {/* SVG Container with responsive sizing and reduced height */} +
{svgUrl ? ( // If SVG URL/path is provided Flowchart diagram ) : svgContent ? ( // If SVG content is provided as JSX -
-
+
+
{svgContent}
diff --git a/app/rna-sequencing/metatranscriptomics-sequencing/page.js b/app/rna-sequencing/metatranscriptomics-sequencing/page.js index bea1d59..215cdf7 100644 --- a/app/rna-sequencing/metatranscriptomics-sequencing/page.js +++ b/app/rna-sequencing/metatranscriptomics-sequencing/page.js @@ -20,7 +20,6 @@ export default function MetatranscriptomicsSequencingPage() { breadcrumbs={breadcrumbs} /> - diff --git a/app/rna-sequencing/mrna-sequencing/components/MRNAIntroduction.jsx b/app/rna-sequencing/mrna-sequencing/components/MRNAIntroduction.jsx index f615bb7..a3f5d83 100644 --- a/app/rna-sequencing/mrna-sequencing/components/MRNAIntroduction.jsx +++ b/app/rna-sequencing/mrna-sequencing/components/MRNAIntroduction.jsx @@ -2,17 +2,25 @@ import IntroductionLayout from '../../../components/shared/IntroductionLayout'; const MRNAIntroduction = () => { - const contentItems = [ + const introItems = [ "Messenger RNA-Seq (mRNA-Seq) is a focused RNA-Seq method that targets polyadenylated (poly-A) transcripts, which comprise only about 1-2% of the transcriptome, mainly representing coding genes. By enriching these poly-A-tailed RNAs, mRNA-Seq offers a precise snapshot of gene expression, capturing the complete range of mRNA transcripts within a sample and enabling detailed analysis of gene activity across various conditions.", "mRNA-seq workflow typically includes RNA extraction, enrichment or depletion of mRNA, library preparation, and high-throughput sequencing. This workflow ensures precise and efficient capture of mRNA transcripts for thorough downstream analysis.", "Bioinformatics analysis for mRNA-seq involves several key steps: data preprocessing, alignment to a reference genome, quantifying gene expression levels, and advanced downstream analyses such as differential expression, pathway enrichment, and gene ontology analysis.", "Widely applicable across diverse research fields, including human, animal, and plant studies, providing profound insights into genetic landscapes and contributing to our understanding of gene function and regulation." ]; + const advantageItems = [ + "mRNA-Seq provides a targeted analysis of gene expression specific to protein-coding regions, making it ideal for studies focused on gene regulation, protein synthesis, and disease-related expression changes.", + "mRNA-Seq focuses on mRNA enrichment, which minimizes the impact of non-coding RNAs and enhances sensitivity for detecting gene expression changes.", + "Focusing solely on coding regions, mRNA-Seq does not require rRNA-specific probes (Costly) for ribosomal RNA removal and requires comparatively lesser data, making it a more cost-effective alternative to Whole Transcriptome Sequencing.", + "With a more targeted dataset, the bioinformatics analysis of mRNA-Seq is often simpler and faster, focusing on coding genes without the complexity introduced by non-coding RNAs." + ]; return ( { return ( -
+
-

+

{title}

@@ -22,19 +21,19 @@ const MRNAPipeline = ({
- {/* SVG Container with responsive sizing */} -
+ {/* SVG Container with responsive sizing and reduced height */} +
{svgUrl ? ( // If SVG URL/path is provided Flowchart diagram ) : svgContent ? ( // If SVG content is provided as JSX -
-
+
+
{svgContent}
diff --git a/app/rna-sequencing/mrna-sequencing/page.js b/app/rna-sequencing/mrna-sequencing/page.js index a10edad..dc21896 100644 --- a/app/rna-sequencing/mrna-sequencing/page.js +++ b/app/rna-sequencing/mrna-sequencing/page.js @@ -21,7 +21,6 @@ export default function MRNASequencingPage() { breadcrumbs={breadcrumbs} /> - diff --git a/app/rna-sequencing/single-cell-rna-sequencing/components/SingleCellIntroduction.jsx b/app/rna-sequencing/single-cell-rna-sequencing/components/SingleCellIntroduction.jsx index e5ae273..3fc66b0 100644 --- a/app/rna-sequencing/single-cell-rna-sequencing/components/SingleCellIntroduction.jsx +++ b/app/rna-sequencing/single-cell-rna-sequencing/components/SingleCellIntroduction.jsx @@ -8,11 +8,19 @@ const SingleCellIntroduction = () => { "The bioinformatics pipeline includes data preprocessing, which involves quality control and normalization of the sequencing reads. The reads are then aligned to a reference genome or transcriptome to identify gene expression levels in each cell. Subsequent analysis involves clustering of cells based on expression profiles, differential gene expression analysis, and the identification of cell types and states.", "Single-cell high-resolution transcriptome profiling offers valuable insights into gene regulatory networks and unveils diverse gene expression patterns within individual cells across cell cultures, tissues, and organs." ]; + const advantageItems = [ + "Unlike traditional bulk RNA sequencing, which averages gene expression across many cells and can hide unique cellular differences, single-cell RNA sequencing examines each cell individually. This reveals variations in gene expression and provides detailed insights into cellular functions, development, and disease mechanisms that are often lost in population-level data.", + "Enables the discovery and characterization of rare or previously unrecognized cell populations, essential for understanding complex biological systems and disease mechanisms.", + "Delivers high-resolution data on gene expression patterns, allowing for precise mapping of gene regulatory networks and cellular states, and uncovering intricate details of cellular interactions.", + "Supports the identification of biomarkers and therapeutic targets by offering a detailed snapshot of gene activity specific to individual cell types or states, facilitating more targeted and effective research and treatments." + ]; return ( { return ( -
+
-

+

{title}

@@ -22,19 +21,19 @@ const SingleCellPipeline = ({
- {/* SVG Container with responsive sizing */} -
+ {/* SVG Container with responsive sizing and reduced height */} +
{svgUrl ? ( // If SVG URL/path is provided Flowchart diagram ) : svgContent ? ( // If SVG content is provided as JSX -
-
+
+
{svgContent}
diff --git a/app/rna-sequencing/small-rna-sequencing/components/SRNABioinformatics.jsx b/app/rna-sequencing/small-rna-sequencing/components/SRNABioinformatics.jsx index a95a762..6500351 100644 --- a/app/rna-sequencing/small-rna-sequencing/components/SRNABioinformatics.jsx +++ b/app/rna-sequencing/small-rna-sequencing/components/SRNABioinformatics.jsx @@ -5,16 +5,15 @@ const SRNABioinformatics = ({ svgContent = null, // Pass your SVG content here as JSX svgUrl = "/images/flowchart/smallrna.svg", backgroundColor = "bg-gray-50", - textColor = "text-gray-700", className = "", titleClassName = "", svgClassName = "", containerClassName = "" }) => { return ( -
+
-

+

{title}

@@ -22,19 +21,19 @@ const SRNABioinformatics = ({
- {/* SVG Container with responsive sizing */} -
+ {/* SVG Container with responsive sizing and reduced height */} +
{svgUrl ? ( // If SVG URL/path is provided Flowchart diagram ) : svgContent ? ( // If SVG content is provided as JSX -
-
+
+
{svgContent}
diff --git a/app/rna-sequencing/small-rna-sequencing/components/SRNAIntroduction.jsx b/app/rna-sequencing/small-rna-sequencing/components/SRNAIntroduction.jsx index c9e7553..4e21814 100644 --- a/app/rna-sequencing/small-rna-sequencing/components/SRNAIntroduction.jsx +++ b/app/rna-sequencing/small-rna-sequencing/components/SRNAIntroduction.jsx @@ -2,17 +2,25 @@ import IntroductionLayout from '../../../components/shared/IntroductionLayout'; const SRNAIntroduction = () => { - const contentItems = [ + const introItems = [ "Small RNA sequencing (sRNA-seq) is designed to identify and analyze small non-coding RNAs (ncRNAs) that are under 200 nucleotides in length. These small RNAs, including microRNAs (miRNAs), small interfering RNAs (siRNAs), small nucleolar RNAs (snoRNAs), PIWI-interacting RNAs (piRNAs), and trans-acting siRNAs (tasiRNAs), play crucial roles in gene silencing and post-transcriptional regulation.", "The sRNA-seq workflow involves isolating miRNAs from samples, followed by preparing libraries with specific adapters and sequencing them using high-throughput platforms.", "The bioinformatics pipeline for sRNA-seq encompasses data preprocessing, alignment with reference genomes, and identification of small RNA species. This analysis includes differential expression studies, characterization of novel small RNAs, and pathway analysis to gain functional insights into sRNA-target interactions.", "Facilitates the discovery of novel small RNAs and offers detailed insights into their expression and functions. It links post-transcriptional regulation to phenotypic outcomes, aiding in the understanding of disease mechanisms and the identification of new biomarkers." ]; + const advantageItems = [ + "Provides a comprehensive view of the small RNA landscape by capturing a broad range of small RNA species, including miRNAs, siRNAs, snoRNAs, piRNAs, and tasiRNAs.", + "Facilitates comparative studies by allowing the comparison of small RNA expression profiles across different conditions or species, supporting investigations into developmental, environmental, and disease-related changes.", + "Identifies previously unmapped small RNAs and isoforms, as well as novel biomarkers, expanding the scope of genetic research and potential clinical applications.", + "Enhances understanding of how post-transcriptional regulation affects phenotypes and offers detailed functional insights into small RNA-target interactions and their roles in various cellular pathways, improving the understanding of gene regulation and function." + ]; return ( - diff --git a/app/rna-sequencing/whole-transcriptome-sequencing/components/WTSIntroduction.jsx b/app/rna-sequencing/whole-transcriptome-sequencing/components/WTSIntroduction.jsx index 8d3f7fa..f31a119 100644 --- a/app/rna-sequencing/whole-transcriptome-sequencing/components/WTSIntroduction.jsx +++ b/app/rna-sequencing/whole-transcriptome-sequencing/components/WTSIntroduction.jsx @@ -2,17 +2,27 @@ import IntroductionLayout from '../../../components/shared/IntroductionLayout'; const WTSIntroduction = () => { - const contentItems = [ + const introItems = [ "Whole Transcriptome Sequencing (WTS) comprehensively captures and quantifies all RNA transcripts, both coding (mRNA) and long non-coding (rRNA, tRNA), providing an in-depth view of gene expression.", "This method combines a ribosomal RNA depletion strategy with Illumina NGS technology for efficient and precise results. The approach (1) reduces ribosomal contamination and increases the proportion of uniquely mapped reads, and (2) is particularly beneficial for species, such as bacteria, whose mRNA may lack a poly-A tail.", "The bioinformatics pipeline includes data preprocessing, genome mapping, transcript identification, and downstream analyses like differential expression analysis, lncRNA target gene analysis, GO enrichment analysis, and KEGG enrichment analysis.", "This technique is applicable to a wide range of species, including humans, mouse, rat, other animals, plants, and prokaryotes. It is compatible with various samples like; high and low-quality RNA samples, cell-free RNA, formalin-fixed paraffin-embedded (FFPE) tissues and RNA." ]; + const advantageItems = [ + "Enables the identification of novel transcripts, alternative splicing events, post-transcriptional modifications, and gene fusions without prior knowledge, making it ideal for exploratory research.", + "Analyzing the entire transcriptome helps gain a deeper understanding of gene regulation, cellular responses, and pathways, leading to a more comprehensive view of biological processes.", + "Enables allele-specific gene expression analysis, offering valuable insights into gene regulation and genetic variability.", + "Facilitates higher detection rates of gene fusions, indels, SNPs, and other genetic variations, offering greater reliability in research outcomes.", + "Widely used in fields such as cancer research and developmental biology, WTS uncovers complex molecular mechanisms and aids in the discovery of potential biomarkers.", + "Provides valuable insights into bacterial gene expression, helping to unravel the mysteries of gene regulation, host-pathogen interactions, antibiotic resistance, and the underlying causes of various diseases." + ]; return ( { return ( -
+
-

+

{title}

@@ -22,19 +21,19 @@ const WTSPipeline = ({
- {/* SVG Container with responsive sizing */} -
+ {/* SVG Container with responsive sizing and reduced height */} +
{svgUrl ? ( // If SVG URL/path is provided Flowchart diagram ) : svgContent ? ( // If SVG content is provided as JSX -
-
+
+
{svgContent}
diff --git a/app/rna-sequencing/whole-transcriptome-sequencing/page.js b/app/rna-sequencing/whole-transcriptome-sequencing/page.js index 1305d4c..5c4b34b 100644 --- a/app/rna-sequencing/whole-transcriptome-sequencing/page.js +++ b/app/rna-sequencing/whole-transcriptome-sequencing/page.js @@ -21,7 +21,6 @@ export default function WholeTranscriptomeSequencingPage() { breadcrumbs={breadcrumbs} /> - diff --git a/public/images/flowchart/denovo.svg b/public/images/flowchart/denovo.svg index 1b1218a..ae1c896 100644 --- a/public/images/flowchart/denovo.svg +++ b/public/images/flowchart/denovo.svg @@ -1,25 +1,32 @@ - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +