-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
23a9bca
commit fee25a8
Showing
5 changed files
with
224 additions
and
37 deletions.
There are no files selected for viewing
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,140 @@ | ||
"use client"; | ||
|
||
import * as React from "react"; | ||
import * as SheetPrimitive from "@radix-ui/react-dialog"; | ||
import { Cross2Icon } from "@radix-ui/react-icons"; | ||
import { cva, type VariantProps } from "class-variance-authority"; | ||
|
||
import { cn } from "r/lib/utils"; | ||
|
||
const Sheet = SheetPrimitive.Root; | ||
|
||
const SheetTrigger = SheetPrimitive.Trigger; | ||
|
||
const SheetClose = SheetPrimitive.Close; | ||
|
||
const SheetPortal = SheetPrimitive.Portal; | ||
|
||
const SheetOverlay = React.forwardRef< | ||
React.ElementRef<typeof SheetPrimitive.Overlay>, | ||
React.ComponentPropsWithoutRef<typeof SheetPrimitive.Overlay> | ||
>(({ className, ...props }, ref) => ( | ||
<SheetPrimitive.Overlay | ||
className={cn( | ||
"fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", | ||
className, | ||
)} | ||
{...props} | ||
ref={ref} | ||
/> | ||
)); | ||
SheetOverlay.displayName = SheetPrimitive.Overlay.displayName; | ||
|
||
const sheetVariants = cva( | ||
"fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500 data-[state=open]:animate-in data-[state=closed]:animate-out", | ||
{ | ||
variants: { | ||
side: { | ||
top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top", | ||
bottom: | ||
"inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom", | ||
left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm", | ||
right: | ||
"inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm", | ||
}, | ||
}, | ||
defaultVariants: { | ||
side: "right", | ||
}, | ||
}, | ||
); | ||
|
||
interface SheetContentProps | ||
extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>, | ||
VariantProps<typeof sheetVariants> {} | ||
|
||
const SheetContent = React.forwardRef< | ||
React.ElementRef<typeof SheetPrimitive.Content>, | ||
SheetContentProps | ||
>(({ side = "right", className, children, ...props }, ref) => ( | ||
<SheetPortal> | ||
<SheetOverlay /> | ||
<SheetPrimitive.Content | ||
ref={ref} | ||
className={cn(sheetVariants({ side }), className)} | ||
{...props} | ||
> | ||
<SheetPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary"> | ||
<Cross2Icon className="h-4 w-4" /> | ||
<span className="sr-only">Close</span> | ||
</SheetPrimitive.Close> | ||
{children} | ||
</SheetPrimitive.Content> | ||
</SheetPortal> | ||
)); | ||
SheetContent.displayName = SheetPrimitive.Content.displayName; | ||
|
||
const SheetHeader = ({ | ||
className, | ||
...props | ||
}: React.HTMLAttributes<HTMLDivElement>) => ( | ||
<div | ||
className={cn( | ||
"flex flex-col space-y-2 text-center sm:text-left", | ||
className, | ||
)} | ||
{...props} | ||
/> | ||
); | ||
SheetHeader.displayName = "SheetHeader"; | ||
|
||
const SheetFooter = ({ | ||
className, | ||
...props | ||
}: React.HTMLAttributes<HTMLDivElement>) => ( | ||
<div | ||
className={cn( | ||
"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", | ||
className, | ||
)} | ||
{...props} | ||
/> | ||
); | ||
SheetFooter.displayName = "SheetFooter"; | ||
|
||
const SheetTitle = React.forwardRef< | ||
React.ElementRef<typeof SheetPrimitive.Title>, | ||
React.ComponentPropsWithoutRef<typeof SheetPrimitive.Title> | ||
>(({ className, ...props }, ref) => ( | ||
<SheetPrimitive.Title | ||
ref={ref} | ||
className={cn("text-lg font-semibold text-foreground", className)} | ||
{...props} | ||
/> | ||
)); | ||
SheetTitle.displayName = SheetPrimitive.Title.displayName; | ||
|
||
const SheetDescription = React.forwardRef< | ||
React.ElementRef<typeof SheetPrimitive.Description>, | ||
React.ComponentPropsWithoutRef<typeof SheetPrimitive.Description> | ||
>(({ className, ...props }, ref) => ( | ||
<SheetPrimitive.Description | ||
ref={ref} | ||
className={cn("text-sm text-muted-foreground", className)} | ||
{...props} | ||
/> | ||
)); | ||
SheetDescription.displayName = SheetPrimitive.Description.displayName; | ||
|
||
export { | ||
Sheet, | ||
SheetPortal, | ||
SheetOverlay, | ||
SheetTrigger, | ||
SheetClose, | ||
SheetContent, | ||
SheetHeader, | ||
SheetFooter, | ||
SheetTitle, | ||
SheetDescription, | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -7,26 +7,22 @@ import YoutubeLogo from "rbrgs/app/_components/YoutubeLogo"; | |
|
||
export default function Footer() { | ||
return ( | ||
<footer className="mt-[5rem] flex w-full max-w-full items-center justify-items-center bg-gradient-to-tr from-neutral-950 to-neutral-800 py-[5vw] font-archivo text-white sm:grid-cols-1 sm:flex-wrap sm:px-4 md:flex-row md:px-[5rem] lg:flex lg:h-[15rem] lg:grid-cols-2 lg:items-center lg:py-0"> | ||
<div className="flex sm:flex-wrap md:flex-row"> | ||
<div> | ||
<p className="font-anton text-[2rem] text-white"> | ||
More about RoBorregos | ||
</p> | ||
<div className="mt-[1rem] flex flex-wrap"> | ||
<div> | ||
<a href="mailto:[email protected]"> | ||
<p className="hover:underline">[email protected]</p> | ||
</a> | ||
<Link href="https://www.roborregos.com/"> | ||
<p className="cursor-pointer hover:underline"> | ||
www.roborregos.com | ||
</p> | ||
</Link> | ||
</div> | ||
</div> | ||
<footer className="mt-[5rem] flex w-full max-w-full flex-col items-center gap-2 bg-gradient-to-tr from-neutral-950 to-neutral-800 px-10 py-[5vw] text-center font-archivo text-white md:flex-row"> | ||
<div> | ||
<p className="font-anton text-[2rem] text-white"> | ||
More about RoBorregos | ||
</p> | ||
<div className="mt-[1rem] flex w-full flex-col flex-wrap gap-2"> | ||
<a href="mailto:[email protected]"> | ||
<p className="hover:underline">[email protected]</p> | ||
</a> | ||
<Link href="https://www.roborregos.com/"> | ||
<p className="cursor-pointer hover:underline">www.roborregos.com</p> | ||
</Link> | ||
</div> | ||
<div className="lg:ml-[5rem]"> | ||
</div> | ||
<div className="flex w-full flex-col items-center gap-2"> | ||
<div> | ||
<p>RoBorregos</p> | ||
<p> | ||
<Link href="https://www.tec.mx/" className="hover:underline"> | ||
|
@@ -55,7 +51,7 @@ export default function Footer() { | |
</div> | ||
<Link | ||
href="https://www.roborregos.com/" | ||
className="h-[8rem] w-fit self-center justify-self-center object-contain sm:mt-0 md:mt-[3rem] lg:ml-auto lg:mt-0" | ||
className="flex h-[8rem] w-fit items-center justify-center self-center justify-self-center object-contain lg:ml-auto" | ||
> | ||
<Image | ||
src={robologo} | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters