info/developer-roadmap
1
0
Fork 0
mirror of https://github.com/kamranahmedse/developer-roadmap.git synced 2025-08-29 20:21:50 +02:00
Code Issues Releases Wiki Activity

Activate buttons in hero section

Browse Source
This commit is contained in:
Kamran Ahmed
2024-03-29 21:00:37 +00:00
parent dd728b526e
commit fd48e980cd
2 changed files with 30 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/Roadmaps/CategoryFilterButton.tsx
View File

@@ -12,11 +12,13 @@ export function CategoryFilterButton(props: CategoryFilterButtonProps) {
return ( return (
<button <button
className={cn( className={cn(
'border-b bg-gradient-to-l py-1.5 pr-3 text-center text-sm text-gray-500 hover:from-white hover:text-gray-900 sm:text-right', 'border-b bg-gradient-to-l py-1.5 pr-3 text-center text-sm text-gray-500 hover:text-gray-900 sm:text-right',
{ {
'from-white font-semibold text-gray-900': 'from-white font-semibold text-gray-900':
selected && category !== 'All Roadmaps', selected && category !== 'All Roadmaps',
'font-semibold text-gray-900': selected && category === 'All Roadmaps', 'font-semibold text-gray-900':
selected && category === 'All Roadmaps',
'hover:from-white': category !== 'All Roadmaps',
}, },
)} )}
type="button" type="button"

36
src/components/Roadmaps/RoadmapsPageHeader.tsx
View File

@@ -1,24 +1,40 @@
import { isLoggedIn } from '../../lib/jwt.ts';
import { showLoginPopup } from '../../lib/popup.ts';
export function RoadmapsPageHeader() { export function RoadmapsPageHeader() {
return ( return (
<div className="bg-white py-3 sm:py-12"> <div className="bg-white py-3 sm:py-12">
<div className="container"> <div className="container">
<div className="flex flex-col items-start sm:items-center bg-white"> <div className="flex flex-col items-start bg-white sm:items-center">
<h1 className="text-2xl sm:text-5xl font-bold">Developer Roadmaps</h1> <h1 className="text-2xl font-bold sm:text-5xl">Developer Roadmaps</h1>
<p className="mb-3 mt-1 sm:my-3 text-sm sm:text-lg"> <p className="mb-3 mt-1 text-sm sm:my-3 sm:text-lg">
Browse the ever-growing list of up-to-date, community driven roadmaps Browse the ever-growing list of up-to-date, community driven
roadmaps
</p> </p>
<p className="flex flex-col sm:flex-row gap-1.5 sm:gap-3 w-full sm:w-auto mb-3 sm:mb-0"> <p className="mb-3 flex w-full flex-col gap-1.5 sm:mb-0 sm:w-auto sm:flex-row sm:gap-3">
<a <a
className="inline-block rounded-md bg-black px-3.5 py-2 sm:py-1.5 text-sm sm:text-base text-white" className="inline-block rounded-md bg-black px-3.5 py-2 text-sm text-white sm:py-1.5 sm:text-base"
href="#" href="https://draw.roadmap.sh"
onClick={(e) => {
if (!isLoggedIn()) {
e.preventDefault();
showLoginPopup();
}
}}
> >
Draw your own roadmap Draw your own roadmap
</a> </a>
<a <a
className="inline-block rounded-md bg-gray-300 px-3.5 py-2 sm:py-1.5 text-sm sm:text-base text-black" className="inline-block rounded-md bg-gray-300 px-3.5 py-2 text-sm text-black sm:py-1.5 sm:text-base"
href="#" href="https://roadmap.sh/ai"
onClick={(e) => {
if (!isLoggedIn()) {
e.preventDefault();
showLoginPopup();
}
}}
> >
Generate Roadmap with AI Generate Roadmaps with AI
</a> </a>
</p> </p>
</div> </div>