Fixed quiz ui

This commit is contained in:
Harivansh Rathi 2024-11-25 16:25:40 -05:00
parent a2f90d042a
commit 147ab53153
7 changed files with 78 additions and 64 deletions

View file

@ -41,7 +41,7 @@ const Navbar = () => {
</NavigationMenuItem>
<NavigationMenuItem>
<Link to="/quiz">
<Button variant="ghost">
<Button variant="secondary" size="sm">
<Users className="mr-2 h-4 w-4" />
Quiz
</Button>
@ -49,7 +49,7 @@ const Navbar = () => {
</NavigationMenuItem>
<NavigationMenuItem>
<Link to="/success-stories">
<Button variant="ghost">
<Button variant="secondary" size="sm">
<Heart className="mr-2 h-4 w-4" />
Success Stories
</Button>
@ -62,4 +62,4 @@ const Navbar = () => {
);
}
export default Navbar;
export default Navbar;

View file

@ -5,26 +5,26 @@ import { cva, type VariantProps } from 'class-variance-authority';
import { cn } from '@/lib/utils';
const buttonVariants = cva(
'inline-flex items-center justify-center 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',
'inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50',
{
variants: {
variant: {
default:
'bg-primary text-primary-foreground shadow hover:bg-primary/90',
'bg-primary text-primary-foreground hover:bg-primary/90 shadow-sm',
destructive:
'bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90',
'bg-destructive text-destructive-foreground hover:bg-destructive/90 shadow-sm',
outline:
'border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground',
'border border-input bg-background hover:bg-accent hover:text-accent-foreground shadow-sm',
secondary:
'bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80',
'bg-secondary text-secondary-foreground hover:bg-secondary/80 shadow-sm',
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',
default: 'h-10 px-4 py-2',
sm: 'h-9 rounded-md px-3',
lg: 'h-11 rounded-md px-8',
icon: 'h-10 w-10',
},
},
defaultVariants: {

View file

@ -9,7 +9,7 @@ const Card = React.forwardRef<
<div
ref={ref}
className={cn(
'rounded-xl border bg-card text-card-foreground shadow',
'rounded-lg border bg-card text-card-foreground shadow-sm transition-all hover:shadow-md',
className
)}
{...props}
@ -35,7 +35,7 @@ const CardTitle = React.forwardRef<
>(({ className, ...props }, ref) => (
<h3
ref={ref}
className={cn('font-semibold leading-none tracking-tight', className)}
className={cn('text-2xl font-semibold leading-none tracking-tight', className)}
{...props}
/>
));

View file

@ -1,6 +1,6 @@
import * as React from 'react';
import { CheckIcon } from '@radix-ui/react-icons';
import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
import { Circle } from 'lucide-react';
import { cn } from '@/lib/utils';
@ -26,13 +26,13 @@ const RadioGroupItem = React.forwardRef<
<RadioGroupPrimitive.Item
ref={ref}
className={cn(
'aspect-square h-4 w-4 rounded-full border border-primary text-primary shadow focus:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50',
'aspect-square h-5 w-5 rounded-full border-2 border-primary text-primary ring-offset-background transition-all focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:border-primary data-[state=checked]:bg-primary/10',
className
)}
{...props}
>
<RadioGroupPrimitive.Indicator className="flex items-center justify-center">
<CheckIcon className="h-3.5 w-3.5 fill-primary" />
<Circle className="h-3 w-3 fill-primary text-primary" />
</RadioGroupPrimitive.Indicator>
</RadioGroupPrimitive.Item>
);