ActiveAssesmentCardjsx
Gitju002
jsx
4 months ago
1.4 kB
3
Indexable
import React from 'react' import { ArrowRight } from 'lucide-react' import { Badge } from './ui/badge' import { Button } from './ui/button' const Component = () => { return ( <div className='text-sm'> <h2 className='text-nowrap'>Active Assesments</h2> <h1 className='font-bold text-sm'>12</h1> </div> ) } const ActiveAssesmentCard = () => { return ( <div className='border p-4 gap-4 border-gray-200 flex justify-between items-center max-xl:flex-wrap'> <h2 className='font-semibold text-nowrap max-xl:w-full'>UI UX Designer</h2> <div className='flex gap-2 items-center justify-between w-full xl:ps-8 flex-wrap'> <div className='flex items-center gap-4 flex-wrap'> <Component /> <Component /> <Component /> <Component /> </div> <Badge className="text-nowrap bg-[#0369A1]/10 text-[#0369A1] capitalize">ends {new Date().toJSON().slice(0, 10)}</Badge> <Button size="icon" variant="outline" > <ArrowRight /> </Button> </div> </div> ) } export default ActiveAssesmentCard
Editor is loading...
Leave a Comment