diff --git a/frontend/app/components/marketplace/products-pagination.tsx b/frontend/app/components/marketplace/products-pagination.tsx index c39a6f3..31bf175 100644 --- a/frontend/app/components/marketplace/products-pagination.tsx +++ b/frontend/app/components/marketplace/products-pagination.tsx @@ -1,70 +1,72 @@ import { - Pagination, - PaginationContent, - PaginationItem, - PaginationPrevious, - PaginationLink, - PaginationEllipsis, - PaginationNext, + Pagination, + PaginationContent, + PaginationEllipsis, + PaginationItem, + PaginationLink, + PaginationNext, + PaginationPrevious, } from "../ui/pagination"; import { - Select, - SelectContent, - SelectGroup, - SelectItem, - SelectTrigger, - SelectValue, + Select, + SelectContent, + SelectGroup, + SelectItem, + SelectTrigger, + SelectValue, } from "../ui/select"; export const ProductsPagination = () => { - return ( -
-
- - -
+ return ( +
+
+ + +
-
- - - - - - - 1 - - - 2 - - - 3 - - - 4 - - - - - - - - - -
-
- ); +
+ + + + + + + 1 + + + 2 + + + 3 + + + 4 + + + + + + + + + +
+
+ ); }; diff --git a/frontend/app/components/ui/button.tsx b/frontend/app/components/ui/button.tsx index 65d4fcd..d18eb21 100644 --- a/frontend/app/components/ui/button.tsx +++ b/frontend/app/components/ui/button.tsx @@ -1,57 +1,57 @@ -import * as React from "react" -import { Slot } from "@radix-ui/react-slot" -import { cva, type VariantProps } from "class-variance-authority" +import { Slot } from "@radix-ui/react-slot"; +import { type VariantProps, cva } from "class-variance-authority"; +import * as React from "react"; -import { cn } from "@/lib/utils" +import { cn } from "@/lib/utils"; const buttonVariants = cva( - "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", - { - variants: { - variant: { - default: - "bg-primary text-primary-foreground shadow hover:bg-primary/90", - destructive: - "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90", - outline: - "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground", - secondary: - "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80", - ghost: "hover:bg-accent hover:text-accent-foreground", - link: "text-primary underline-offset-4 hover:underline", - }, - size: { - default: "h-9 px-4 py-2", - sm: "h-8 rounded-md px-3 text-xs", - lg: "h-10 rounded-md px-8", - icon: "h-9 w-9", - }, - }, - defaultVariants: { - variant: "default", - size: "default", - }, - } -) + "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", + { + variants: { + variant: { + default: + "bg-primary text-primary-foreground shadow hover:bg-primary/90", + destructive: + "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90", + outline: + "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground", + secondary: + "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80", + ghost: "hover:bg-accent hover:text-accent-foreground", + link: "text-primary underline-offset-4 hover:underline", + }, + size: { + default: "h-9 px-4 py-2", + sm: "h-8 rounded-md px-3 text-xs", + lg: "h-10 rounded-md px-8", + icon: "h-9 w-9", + }, + }, + defaultVariants: { + variant: "default", + size: "default", + }, + }, +); export interface ButtonProps - extends React.ButtonHTMLAttributes, - VariantProps { - asChild?: boolean + extends React.ButtonHTMLAttributes, + VariantProps { + asChild?: boolean; } const Button = React.forwardRef( - ({ className, variant, size, asChild = false, ...props }, ref) => { - const Comp = asChild ? Slot : "button" - return ( - - ) - } -) -Button.displayName = "Button" + ({ className, variant, size, asChild = false, ...props }, ref) => { + const Comp = asChild ? Slot : "button"; + return ( + + ); + }, +); +Button.displayName = "Button"; -export { Button, buttonVariants } +export { Button, buttonVariants }; diff --git a/frontend/app/components/ui/feature-section.tsx b/frontend/app/components/ui/feature-section.tsx index 2aa4794..0ccefb9 100644 --- a/frontend/app/components/ui/feature-section.tsx +++ b/frontend/app/components/ui/feature-section.tsx @@ -6,7 +6,8 @@ export function FeatureSection() { { icon: , title: "Smart Contract Escrow", - description: "Automated protection with Stellar smart contracts. Trustless Work API abstracts the complexities of smart contract configuration. It leverages the blockchain to ensure transactions are secure and transparent, providing fairness without bias in the marketplace. Read more on trustless Work: https://www.trustlesswork.com/", + description: + "Automated protection with Stellar smart contracts. Trustless Work API abstracts the complexities of smart contract configuration. It leverages the blockchain to ensure transactions are secure and transparent, providing fairness without bias in the marketplace. Read more on trustless Work: https://www.trustlesswork.com/", gradient: "from-blue-500 to-cyan-500", }, { diff --git a/frontend/app/components/ui/pagination.tsx b/frontend/app/components/ui/pagination.tsx index 76d28d5..37fea24 100644 --- a/frontend/app/components/ui/pagination.tsx +++ b/frontend/app/components/ui/pagination.tsx @@ -1,116 +1,120 @@ -import * as React from "react" -import { cn } from "@/lib/utils" -import { ButtonProps, buttonVariants } from "@/app/components/ui/button" -import { ChevronLeftIcon, ChevronRightIcon, DotsHorizontalIcon } from "@radix-ui/react-icons" +import { ButtonProps, buttonVariants } from "@/app/components/ui/button"; +import { cn } from "@/lib/utils"; +import { + ChevronLeftIcon, + ChevronRightIcon, + DotsHorizontalIcon, +} from "@radix-ui/react-icons"; +import * as React from "react"; const Pagination = ({ className, ...props }: React.ComponentProps<"nav">) => ( -