UI styling update

This commit is contained in:
mukesh13
2025-08-21 12:40:06 +05:30
parent 543e21d2e2
commit 24ec58a76b
78 changed files with 524 additions and 307 deletions

View File

@ -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 (
<section className={`py-6 sm:py-8 lg:py-12 ${backgroundColor} ${className}`}>
<section className={`py-6 sm:py-8 lg:py-4 ${backgroundColor} ${className}`}>
<div className={`container mx-auto max-w-none px-3 sm:px-4 lg:px-6 ${containerClassName}`}>
<h2 className={`${textColor} text-left pb-4 sm:pb-6 text-xl sm:text-2xl lg:text-3xl font-normal ${titleClassName}`}>
<h2 className={"text-3xl font-bold text-teal-700 mb-4"}>
{title}
</h2>
@ -22,19 +21,19 @@ const LncRNABioinformatics = ({
<div className="bg-white rounded-xl shadow-lg p-4 sm:p-6 lg:p-8">
<div className="flex justify-center">
<div className="w-full max-w-6xl">
{/* SVG Container with responsive sizing */}
<div className={`w-full ${svgClassName}`}>
{/* SVG Container with responsive sizing and reduced height */}
<div className={`w-full max-h-180 overflow-hidden ${svgClassName}`}>
{svgUrl ? (
// If SVG URL/path is provided
<img
src={svgUrl}
alt="Flowchart diagram"
className="w-full h-auto object-contain"
className="w-full h-auto object-contain max-h-180"
/>
) : svgContent ? (
// If SVG content is provided as JSX
<div className="w-full">
<div className="w-full">
<div className="w-full max-h-180">
<div className="w-full max-h-180 overflow-hidden">
{svgContent}
</div>
</div>

View File

@ -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 (
<IntroductionLayout
title="Introduction and Workflow"
contentItems={contentItems}
introTitle="Introduction and Workflow"
advantageTitle="Advantage"
introItems={contentItems}
advantageItems={advantageItems}
imageUrl="/images/rna/lncRNA_sequencing.png"
imageAlt="lncRNA Sequencing Workflow"
useParagraphs={true}

View File

@ -21,7 +21,6 @@ export default function LncRNASequencingPage() {
breadcrumbs={breadcrumbs}
/>
<LncRNAIntroduction />
<LncRNAAdvantages />
<LncRNABioinformatics />
<LncRNAApplications />
<LncRNASpecifications />