Skip to content

Commit f2d9a3f

Browse files
brunobergherbrunobergher
committed
Mobile nav adjustments
1 parent 420efc8 commit f2d9a3f

File tree

2 files changed

+23
-42
lines changed

2 files changed

+23
-42
lines changed

‎apps/web-roo-code/src/app/page.tsx‎

Lines changed: 13 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -3,15 +3,7 @@
33
import { getVSCodeDownloads } from "@/lib/stats"
44

55
import { Button } from "@/components/ui"
6-
import { AnimatedText } from "@/components/animated-text"
7-
import {
8-
AnimatedBackground,
9-
InstallSection,
10-
Features,
11-
Testimonials,
12-
FAQSection,
13-
CodeExample,
14-
} from "@/components/homepage"
6+
import { AnimatedBackground, InstallSection, Features, Testimonials, FAQSection } from "@/components/homepage"
157

168
// Invalidate cache when a request comes in, at most once every hour.
179
export const revalidate = 3600
@@ -21,28 +13,18 @@ export default async function Home() {
2113

2214
return (
2315
<>
24-
<section className="relative flex h-[calc(125vh-theme(spacing.12))] items-center overflow-hidden md:h-[calc(100svh-theme(spacing.12))] lg:h-[calc(100vh-theme(spacing.12))]">
16+
<section className="relative flex h-[calc(125vh-theme(spacing.12))] items-center overflow-hidden md:h-[calc(80svh-theme(spacing.12))]">
2517
<AnimatedBackground />
26-
<div className="container relative z-10 mx-auto px-4 sm:px-6 lg:px-8">
27-
<div className="grid gap-8 md:gap-12 lg:grid-cols-2 lg:gap-16">
28-
<div className="flex flex-col justify-center space-y-6 sm:space-y-8">
18+
<div className="container relative flex items-center h-full z-10 mx-auto px-4 sm:px-6 lg:px-8">
19+
<div className="grid h-full relative gap-8 md:gap-12 lg:grid-cols-2 lg:gap-16">
20+
<div className="flex flex-col px-4 justify-center space-y-6 sm:space-y-8">
2921
<div>
30-
<h1 className="text-3xl font-bold tracking-tight sm:text-4xl md:text-5xl lg:text-6xl">
31-
<span className="block">Your</span>
32-
<AnimatedText className="bg-gradient-to-r from-blue-400 to-cyan-400 bg-clip-text text-transparent">
33-
AI-Powered
34-
</AnimatedText>
35-
<span className="block">Dev Team, in Your Editor</span>
36-
<AnimatedText className="bg-gradient-to-r from-blue-400 to-cyan-400 bg-clip-text text-transparent">
37-
and Beyond
38-
</AnimatedText>
22+
<h1 className="text-3xl font-bold tracking-tight mt-8 sm:text-4xl md:text-5xl lg:text-6xl lg:mt-0">
23+
An entire AI-powered dev team. In your editor and beyond.
3924
</h1>
4025
<p className="mt-4 max-w-md text-base text-muted-foreground sm:mt-6 sm:text-lg">
41-
Supercharge your software development with AI that{" "}
42-
<AnimatedText className="bg-gradient-to-r from-blue-400 to-cyan-400 bg-clip-text text-transparent">
43-
understands your codebase
44-
</AnimatedText>{" "}
45-
and helps you write, refactor, and debug with ease in your editor and in the cloud.
26+
Roo&apos;s model-agnostic, specialized modes and fine-grained auto-approval controls
27+
give you the tools (and the confidence) to get AI working for you.
4628
</p>
4729
</div>
4830
<div className="flex flex-col space-y-3 sm:flex-row sm:space-x-4 sm:space-y-0">
@@ -53,7 +35,7 @@ export default async function Home() {
5335
href="https://marketplace.visualstudio.com/items?itemName=RooVeterinaryInc.roo-cline"
5436
target="_blank"
5537
className="flex w-full items-center justify-center">
56-
Install Roo Code
38+
Install Extension
5739
<svg
5840
xmlns="http://www.w3.org/2000/svg"
5941
className="ml-2 h-4 w-4"
@@ -80,11 +62,10 @@ export default async function Home() {
8062
</Button>
8163
</div>
8264
</div>
83-
<div className="relative mt-8 flex items-center justify-center lg:mt-0">
84-
<div className="absolute inset-0 flex items-center justify-center">
85-
<div className="h-[250px] w-[250px] rounded-full bg-blue-500/20 blur-[100px] sm:h-[300px] sm:w-[300px] md:h-[350px] md:w-[350px]" />
65+
<div className="relative flex items-center mx-auto h-full mt-8 lg:mt-0">
66+
<div className="flex items-center justify-center">
67+
<div className="bg-red-500 h-[600px] w-[320px]">Video will go here</div>
8668
</div>
87-
<CodeExample />
8869
</div>
8970
</div>
9071
</div>

‎apps/web-roo-code/src/components/chromes/nav-bar.tsx‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ export function NavBar({ stars, downloads }: NavBarProps) {
2929
<div className="container flex h-16 items-center justify-between px-4 sm:px-6 lg:px-8">
3030
<div className="flex items-center">
3131
<Link href="/" className="flex items-center">
32-
<Image src={logoSrc} alt="Roo Code Logo" width={120} height={40} className="h-8 w-auto" />
32+
<Image src={logoSrc} alt="Roo Code Logo" width={130} height={24} className="h-[24px] w-auto" />
3333
</Link>
3434
</div>
3535

@@ -128,53 +128,53 @@ export function NavBar({ stars, downloads }: NavBarProps) {
128128
{/* Mobile Menu Panel - Full Screen */}
129129
<div
130130
className={`fixed top-16 left-0 bg-background right-0 z-[100] transition-all duration-200 pointer-events-none md:hidden ${isMenuOpen ? "block h-dvh" : "hidden"}`}>
131-
<nav className="overflow-y-auto bg-background pointer-events-auto">
131+
<nav className="flex flex-col justify-between h-full pb-16 overflow-y-auto bg-background pointer-events-auto">
132132
{/* Main navigation items */}
133-
<div className="flex-1 py-4">
133+
<div className="grow-1 py-4 font-semibold text-lg">
134134
<ScrollButton
135135
targetId="product"
136-
className="w-full px-8 py-5 text-left text-lg font-semibold text-foreground active:opacity-50"
136+
className="block w-full p-5 py-3 text-left text-foreground active:opacity-50"
137137
onClick={() => setIsMenuOpen(false)}>
138138
Product
139139
</ScrollButton>
140140
<Link
141141
href="/enterprise"
142-
className="block w-full px-8 py-5 text-left text-lg font-semibold text-foreground active:opacity-50"
142+
className="block w-full p-5 py-3 text-left text-foreground active:opacity-50"
143143
onClick={() => setIsMenuOpen(false)}>
144144
Enterprise
145145
</Link>
146146
<a
147147
href={EXTERNAL_LINKS.DOCUMENTATION}
148148
target="_blank"
149-
className="block w-full px-8 py-5 text-left text-lg font-semibold text-foreground active:opacity-50"
149+
className="block w-full p-5 text-left text-foreground active:opacity-50"
150150
onClick={() => setIsMenuOpen(false)}>
151151
Docs
152152
</a>
153153

154154
{/* Resources Section */}
155155
<div className="mt-4 w-full">
156-
<div className="px-8 pb-2 pt-4 text-sm font-semibold uppercase tracking-wider text-muted-foreground">
156+
<div className="px-5 pb-2 pt-4 text-sm font-semibold uppercase tracking-wider text-muted-foreground">
157157
Resources
158158
</div>
159159
<Link
160160
href="/evals"
161-
className="block w-full px-8 py-4 text-left text-lg font-medium text-foreground active:opacity-50"
161+
className="block w-full p-5 py-3 text-left text-foreground active:opacity-50"
162162
onClick={() => setIsMenuOpen(false)}>
163163
Evals
164164
</Link>
165165
<a
166166
href={EXTERNAL_LINKS.DISCORD}
167167
target="_blank"
168168
rel="noopener noreferrer"
169-
className="block w-full px-8 py-4 text-left text-lg font-medium text-foreground transition-colors hover:bg-accent"
169+
className="block w-full p-5 py-3 text-left text-foreground active:opacity-50"
170170
onClick={() => setIsMenuOpen(false)}>
171171
Discord
172172
</a>
173173
<a
174174
href={EXTERNAL_LINKS.SECURITY}
175175
target="_blank"
176176
rel="noopener noreferrer"
177-
className="block w-full px-8 py-5 text-left text-lg font-semibold text-foreground active:opacity-50"
177+
className="block w-full p-5 py-3 text-left text-foreground active:opacity-50"
178178
onClick={() => setIsMenuOpen(false)}>
179179
Security Center
180180
</a>

0 commit comments

Comments
 (0)