scriptoriumadmin/Roo-Code
1
0
Fork 0
mirror of https://github.com/RooVetGit/Roo-Code.git synced 2026-08-28 05:27:24 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: improve mobile responsiveness of hero section on /reviewer page (#9138)

Browse source 
Co-authored-by: Roo Code <roomote@roocode.com>
This commit is contained in:
roomote[bot] 2025-11-08 17:47:06 -05:00 • committed by GitHub
parent e98f4b9057
commit 4da9c3adb1
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 15 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
apps/web-roo-code/src/app/shared/AgentLandingContent.tsx
View file

@ -47,13 +47,13 @@ export function AgentLandingContent({ content }: { content: AgentPageContent })
return (
<>
{/* Hero Section */}
<section className="relative flex md:h-[calc(70vh-theme(spacing.12))] items-center overflow-hidden">
<section className="relative flex min-h-screen md:min-h-[calc(70vh-theme(spacing.12))] items-center overflow-hidden py-12 md:py-0">
<AnimatedBackground />
<div className="container relative flex items-center h-full z-10 mx-auto px-4 sm:px-6 lg:px-8">
<div className="grid h-full relative gap-4 md:gap-20 lg:grid-cols-2">
<div className="flex flex-col px-4 justify-center space-y-6 sm:space-y-8">
<div className="grid h-full relative gap-8 md:gap-12 lg:gap-20 lg:grid-cols-2">
<div className="flex flex-col justify-center space-y-6 sm:space-y-8">
<div>
<h1 className="text-3xl font-bold tracking-tight mt-8 md:text-left md:text-4xl lg:text-5xl lg:mt-0">
<h1 className="text-3xl font-bold tracking-tight md:text-left md:text-4xl lg:text-5xl">
{content.hero.icon &&
(() => {
const Icon = getIcon(content.hero.icon)
@ -62,7 +62,7 @@ export function AgentLandingContent({ content }: { content: AgentPageContent })
{content.hero.heading}
</h1>
<div className="mt-4 max-w-lg space-y-4 text-base text-muted-foreground md:text-left sm:mt-6">
<div className="mt-4 max-w-full lg:max-w-lg space-y-4 text-base text-muted-foreground md:text-left sm:mt-6">
{content.hero.paragraphs.map((paragraph, index) => (
<p key={index}>{paragraph}</p>
))}
@ -110,23 +110,16 @@ export function AgentLandingContent({ content }: { content: AgentPageContent })
</div>
{content.hero.image && (
<div className="flex items-center justify-end mx-auto h-full mt-8 lg:mt-0">
<div
className="relative overflow-clip"
style={{
width: `${content.hero.image.width}px`,
height: `${content.hero.image.height}px`,
maxWidth: "100%",
}}>
<div className="block">
<Image
src={content.hero.image.url}
alt={content.hero.image.alt || "Hero image"}
className="max-w-full h-auto"
width={content.hero.image.width}
height={content.hero.image.height}
/>
</div>
<div className="flex items-center justify-center lg:justify-end mx-auto h-full w-full">
<div className="relative w-full max-w-full overflow-hidden rounded-lg">
<Image
src={content.hero.image.url}
alt={content.hero.image.alt || "Hero image"}
className="w-full h-auto"
width={content.hero.image.width}
height={content.hero.image.height}
priority
/>
</div>
</div>
)}