Skip to content

Commit 6d86fb8

Browse files
committed
Added top banner for cody
1 parent c4647b6 commit 6d86fb8

File tree

2 files changed

+70
-0
lines changed

2 files changed

+70
-0
lines changed

src/components/Layout.tsx

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import { LogoMark } from './LogoMark';
1313
import VersionSelector from './VersionSelector';
1414
import { Search } from './search/Search';
1515
import { DemoLayout } from '@/components/DemoLayout';
16+
import { TopBanner } from './TopBanner';
1617

1718
function GitHubIcon(props: React.ComponentPropsWithoutRef<'svg'>) {
1819
return (
@@ -103,11 +104,20 @@ function Header() {
103104
export function Layout({ children }: { children: React.ReactNode }) {
104105
let pathname = usePathname();
105106
let isHomePage = pathname === '/';
107+
let isCody = pathname.includes('/cody');
106108

107109
return (
108110
<div className="flex w-full flex-col">
109111
<Header />
110112

113+
{isCody && <TopBanner
114+
text="NEW: Introducing chat and search in a single input with Sourcegraph 6.0."
115+
link="https://sourcegraph.com/blog/combining-chat-and-search"
116+
linkText="Read here"
117+
textColor="white"
118+
backgroundColor="#F34E3F"
119+
/>}
120+
111121
{isHomePage && <Hero />}
112122
{/* {isHomePage && <DemoLayout />} */}
113123

src/components/TopBanner.tsx

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
'use client';
2+
3+
import Link from 'next/link';
4+
import { useState } from 'react';
5+
6+
interface TopBannerProps {
7+
text?: string;
8+
link?: string;
9+
backgroundColor?: string;
10+
textColor?: string;
11+
linkText?: string;
12+
}
13+
14+
export function TopBanner({
15+
text = "",
16+
link = "https://sourcegraph.com/",
17+
backgroundColor = "#F34E3F",
18+
textColor = "white",
19+
linkText = 'new docs',
20+
}: TopBannerProps) {
21+
const [isVisible, setIsVisible] = useState(true);
22+
23+
if (!isVisible) return null;
24+
25+
return (
26+
<div
27+
style={{ backgroundColor, color: textColor }}
28+
className="fixed top-0 z-[100] min-h-[42px] w-full flex items-center justify-center px-4 py-2 md:py-0 md:h-[42px]"
29+
>
30+
<div className="flex items-center gap-2 text-xs sm:text-sm max-w-[90%] md:max-w-none text-center">
31+
<span className="line-clamp-2 md:line-clamp-1">{text}</span>
32+
<Link href={link} target="_blank" className="flex items-center hover:opacity-80 whitespace-nowrap">
33+
{linkText && <span>{linkText}</span>}
34+
<svg className="lucide lucide-arrow-right w-3 h-3 ml-1 sm:w-4 sm:h-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" >
35+
<path d="M5 12h14" />
36+
<path d="m12 5 7 7-7 7" />
37+
</svg>
38+
</Link>
39+
</div>
40+
<button
41+
onClick={() => setIsVisible(false)}
42+
className="absolute right-2 sm:right-4 hover:opacity-80"
43+
>
44+
<svg
45+
className="h-3 w-3 sm:h-4 sm:w-4"
46+
fill="none"
47+
stroke="currentColor"
48+
viewBox="0 0 24 24"
49+
>
50+
<path
51+
strokeLinecap="round"
52+
strokeLinejoin="round"
53+
strokeWidth={2}
54+
d="M6 18L18 6M6 6l12 12"
55+
/>
56+
</svg>
57+
</button>
58+
</div>
59+
);
60+
}

0 commit comments

Comments
 (0)