Skip to content

Commit 0b86755

Browse files
committed
added final code for career page
1 parent 8c2c239 commit 0b86755

File tree

9 files changed

+621
-45
lines changed

9 files changed

+621
-45
lines changed

app/lib/utils.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { clsx } from "clsx";
2+
import { twMerge } from "tailwind-merge"
3+
4+
export function cn(...inputs) {
5+
return twMerge(clsx(inputs));
6+
}

components/ui/button.tsx

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
import * as React from "react"
2+
import { Slot } from "@radix-ui/react-slot"
3+
import { cva, type VariantProps } from "class-variance-authority"
4+
import { cn } from "@/lib/utils"
5+
6+
7+
const buttonVariants = cva(
8+
"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-white transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-zinc-950 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 ",
9+
{
10+
variants: {
11+
variant: {
12+
default: "bg-zinc-900 text-zinc-50 hover:bg-zinc-900/90 dark:bg-zinc-50 dark:text-zinc-900 ",
13+
destructive:
14+
"bg-red-500 text-zinc-50 hover:bg-red-500/90 dark:bg-red-900 ",
15+
outline:
16+
"border border-zinc-200 bg-white hover:bg-zinc-100 hover:text-zinc-900 ",
17+
secondary:
18+
"bg-zinc-100 text-zinc-900 hover:bg-zinc-100/80 dark:bg-zinc-800 ",
19+
ghost: "hover:bg-zinc-100 hover:text-zinc-900 ",
20+
link: "text-zinc-900 underline-offset-4 hover:underline ",
21+
},
22+
size: {
23+
default: "h-10 px-4 py-2",
24+
sm: "h-9 rounded-md px-3",
25+
lg: "h-11 rounded-md px-8",
26+
icon: "h-10 w-10",
27+
},
28+
},
29+
defaultVariants: {
30+
variant: "default",
31+
size: "default",
32+
},
33+
}
34+
)
35+
36+
export interface ButtonProps
37+
extends React.ButtonHTMLAttributes<HTMLButtonElement>,
38+
VariantProps<typeof buttonVariants> {
39+
asChild?: boolean
40+
}
41+
42+
const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
43+
({ className, variant, size, asChild = false, ...props }, ref) => {
44+
const Comp = asChild ? Slot : "button"
45+
return (
46+
<Comp
47+
className={cn(buttonVariants({ variant, size, className }))}
48+
ref={ref}
49+
{...props}
50+
/>
51+
)
52+
}
53+
)
54+
Button.displayName = "Button"
55+
56+
export { Button, buttonVariants }

components/ui/card.tsx

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
import * as React from "react"
2+
3+
import { cn } from "@/lib/utils"
4+
5+
const Card = React.forwardRef<
6+
HTMLDivElement,
7+
React.HTMLAttributes<HTMLDivElement>
8+
>(({ className, ...props }, ref) => (
9+
<div
10+
ref={ref}
11+
className={cn(
12+
"rounded-lg border border-zinc-200 bg-white text-zinc-950 shadow-sm ",
13+
className
14+
)}
15+
{...props}
16+
/>
17+
))
18+
Card.displayName = "Card"
19+
20+
const CardHeader = React.forwardRef<
21+
HTMLDivElement,
22+
React.HTMLAttributes<HTMLDivElement>
23+
>(({ className, ...props }, ref) => (
24+
<div
25+
ref={ref}
26+
className={cn("flex flex-col space-y-1.5 p-6", className)}
27+
{...props}
28+
/>
29+
))
30+
CardHeader.displayName = "CardHeader"
31+
32+
const CardTitle = React.forwardRef<
33+
HTMLParagraphElement,
34+
React.HTMLAttributes<HTMLHeadingElement>
35+
>(({ className, ...props }, ref) => (
36+
<h3
37+
ref={ref}
38+
className={cn(
39+
"text-2xl font-semibold leading-none tracking-tight",
40+
className
41+
)}
42+
{...props}
43+
/>
44+
))
45+
CardTitle.displayName = "CardTitle"
46+
47+
const CardDescription = React.forwardRef<
48+
HTMLParagraphElement,
49+
React.HTMLAttributes<HTMLParagraphElement>
50+
>(({ className, ...props }, ref) => (
51+
<p
52+
ref={ref}
53+
className={cn("text-sm text-zinc-500 ", className)}
54+
{...props}
55+
/>
56+
))
57+
CardDescription.displayName = "CardDescription"
58+
59+
const CardContent = React.forwardRef<
60+
HTMLDivElement,
61+
React.HTMLAttributes<HTMLDivElement>
62+
>(({ className, ...props }, ref) => (
63+
<div ref={ref} className={cn("p-6 pt-0", className)} {...props} />
64+
))
65+
CardContent.displayName = "CardContent"
66+
67+
const CardFooter = React.forwardRef<
68+
HTMLDivElement,
69+
React.HTMLAttributes<HTMLDivElement>
70+
>(({ className, ...props }, ref) => (
71+
<div
72+
ref={ref}
73+
className={cn("flex items-center p-6 pt-0", className)}
74+
{...props}
75+
/>
76+
))
77+
CardFooter.displayName = "CardFooter"
78+
79+
export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent }

components/ui/footer.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -89,6 +89,9 @@ export default function Footer() {
8989
<li className="mb-2">
9090
<Link href="https://keploy.io/docs/privacy-policy/" className="text-neutral-300 hover:text-primary-300 transition duration-150 ease-in-out">Privacy Policy</Link>
9191
</li>
92+
<li className="mb-2">
93+
<Link href="https://keploy.io/careers" className="text-neutral-300 hover:text-primary-300 transition duration-150 ease-in-out">Careers</Link>
94+
</li>
9295
</ul>
9396
</div>
9497

components/ui/header.tsx

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -106,6 +106,15 @@ export default function Header() {
106106
Articles
107107
</Link>
108108
</li>
109+
<li>
110+
<Link
111+
target="_blank"
112+
href="https://keploy.io/careers"
113+
className="font-medium text-gray-600 hover:text-primary-300 px-5 py-3 flex items-center transition duration-150 ease-in-out"
114+
>
115+
Careers
116+
</Link>
117+
</li>
109118
<div className="px-5">
110119
{" "}
111120
<NavItemWithSmallDropdown

components/ui/input.tsx

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import * as React from "react"
2+
3+
import { cn } from "@/lib/utils"
4+
5+
export interface InputProps
6+
extends React.InputHTMLAttributes<HTMLInputElement> {}
7+
8+
const Input = React.forwardRef<HTMLInputElement, InputProps>(
9+
({ className, type, ...props }, ref) => {
10+
return (
11+
<input
12+
type={type}
13+
className={cn(
14+
"flex h-10 w-full rounded-md border border-zinc-200 bg-white px-3 py-2 text-sm ring-offset-white file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-zinc-950 placeholder:text-zinc-500 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-zinc-950 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 ",
15+
className
16+
)}
17+
ref={ref}
18+
{...props}
19+
/>
20+
)
21+
}
22+
)
23+
Input.displayName = "Input"
24+
25+
export { Input }

components/ui/tabs.tsx

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
"use client"
2+
3+
import * as React from "react"
4+
import * as TabsPrimitive from "@radix-ui/react-tabs"
5+
6+
import { cn } from "@/lib/utils"
7+
8+
const Tabs = TabsPrimitive.Root
9+
10+
const TabsList = React.forwardRef<
11+
React.ElementRef<typeof TabsPrimitive.List>,
12+
React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>
13+
>(({ className, ...props }, ref) => (
14+
<TabsPrimitive.List
15+
ref={ref}
16+
className={cn(
17+
"inline-flex h-10 items-center justify-center rounded-md bg-zinc-100 p-1 text-zinc-500 ",
18+
className
19+
)}
20+
{...props}
21+
/>
22+
))
23+
TabsList.displayName = TabsPrimitive.List.displayName
24+
25+
const TabsTrigger = React.forwardRef<
26+
React.ElementRef<typeof TabsPrimitive.Trigger>,
27+
React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>
28+
>(({ className, ...props }, ref) => (
29+
<TabsPrimitive.Trigger
30+
ref={ref}
31+
className={cn(
32+
"inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-white transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-zinc-950 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-white data-[state=active]:text-zinc-950 data-[state=active]:shadow-sm ",
33+
className
34+
)}
35+
{...props}
36+
/>
37+
))
38+
TabsTrigger.displayName = TabsPrimitive.Trigger.displayName
39+
40+
const TabsContent = React.forwardRef<
41+
React.ElementRef<typeof TabsPrimitive.Content>,
42+
React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>
43+
>(({ className, ...props }, ref) => (
44+
<TabsPrimitive.Content
45+
ref={ref}
46+
className={cn(
47+
"mt-2 ring-offset-white focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-zinc-950 focus-visible:ring-offset-2 ",
48+
className
49+
)}
50+
{...props}
51+
/>
52+
))
53+
TabsContent.displayName = TabsPrimitive.Content.displayName
54+
55+
export { Tabs, TabsList, TabsTrigger, TabsContent }

0 commit comments

Comments
 (0)