DNA image update
This commit is contained in:
@ -60,7 +60,7 @@ const Header = () => {
|
||||
<ul className="absolute top-full left-0 bg-white shadow-lg rounded-md py-2 w-48 opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-300 z-50 border border-gray-100">
|
||||
<li className="relative group/dna">
|
||||
<Link
|
||||
href="#"
|
||||
href="/dna-sequencing"
|
||||
className="flex items-center justify-between px-4 py-3 text-sm text-gray-700 hover:bg-gray-50 hover:text-teal-600 border-b border-gray-50"
|
||||
>
|
||||
<span className="font-medium">DNA Sequencing</span>
|
||||
@ -285,7 +285,7 @@ const Header = () => {
|
||||
</li>
|
||||
<li className="relative group/rna">
|
||||
<Link
|
||||
href="#"
|
||||
href="rna-sequencing"
|
||||
className="flex items-center justify-between px-4 py-3 text-sm text-gray-700 hover:bg-gray-50 hover:text-teal-600"
|
||||
>
|
||||
<span className="font-medium">RNA Sequencing</span>
|
||||
|
||||
@ -1,5 +1,4 @@
|
||||
// components/shared/IntroductionLayout.jsx
|
||||
|
||||
const IntroductionLayout = ({
|
||||
title = "Introduction and Workflow",
|
||||
contentItems = [],
|
||||
@ -11,35 +10,37 @@ const IntroductionLayout = ({
|
||||
badgeColor = "bg-teal-600"
|
||||
}) => {
|
||||
return (
|
||||
<section className="py-0 md:py-12 lg:py-10">
|
||||
<div className="container-fluid px-0">
|
||||
<section className="py-0 md:py-12 lg:py-10 w-full">
|
||||
<div className="w-full max-w-full px-0">
|
||||
<h2 className="text-2xl lg:text-3xl text-gray-700 text-left pb-2 px-4 lg:px-8 mb-4">
|
||||
{title}
|
||||
</h2>
|
||||
|
||||
{/* Two column layout */}
|
||||
<div className="grid grid-cols-1 lg:grid-cols-[1.14fr_1fr] min-h-[140px] lg:min-h-[280px]">
|
||||
<div className="grid grid-cols-1 lg:grid-cols-[1.2fr_1.0fr] w-full gap-4">
|
||||
{/* Left side content */}
|
||||
<div className="px-6 lg:px-9 py-6 lg:py-0">
|
||||
<ul className="list-disc list-inside space-y-3 text-gray-600 leading-relaxed lg:px-10 text-justify-center">
|
||||
<div className="px-6 lg:px-9 py-6 lg:py-8 flex items-start">
|
||||
<ul className="list-disc list-inside space-y-4 text-gray-600 leading-relaxed text-sm lg:text-base text-justify">
|
||||
{contentItems.map((item, index) => (
|
||||
<li key={index}>{item}</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{/* Right side image */}
|
||||
<div
|
||||
style={{
|
||||
backgroundImage: imageUrl ? `url('${imageUrl}')` : 'none',
|
||||
backgroundColor: backgroundColor
|
||||
}}
|
||||
>
|
||||
{/* Right side image - increased image size */}
|
||||
<div className="flex items-center justify-center p-2 lg:p-4 w-full">
|
||||
{imageUrl && (
|
||||
<img
|
||||
src={imageUrl}
|
||||
alt={imageAlt}
|
||||
className="object-contain"
|
||||
style={{ height: '350px', width: '500px' }}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export default IntroductionLayout;
|
||||
Reference in New Issue
Block a user