ui improvemnt

This commit is contained in:
Marshal
2026-06-06 21:17:20 +00:00
parent b62ea3f95f
commit 08b46c306f
35 changed files with 2731 additions and 1604 deletions

View File

@@ -8,7 +8,7 @@ import {
Wallet,
XCircle,
} from "lucide-react";
import { Group, Badge, UnstyledButton, Stack, Text } from "@mantine/core";
import { Group, Badge, UnstyledButton, Text } from "@mantine/core";
import {
BOOKING_LIST_TABS,
@@ -57,12 +57,12 @@ export function BookingStatusTabs({
onClick={() => onChange(tab.key)}
style={{
background: isActive ? "white" : "transparent",
border: isActive ? "1px solid var(--mantine-color-blue-3)" : "1px solid var(--mantine-color-gray-2)",
border: isActive ? "1px solid var(--mantine-color-green-3)" : "1px solid var(--mantine-color-gray-2)",
borderRadius: "10px",
padding: "10px 16px",
transition: "all 0.2s ease",
cursor: "pointer",
boxShadow: isActive ? "0 2px 8px rgba(59, 130, 246, 0.1)" : "none",
boxShadow: isActive ? "0 2px 8px rgba(34, 197, 94, 0.1)" : "none",
}}
>
<Group gap="sm" justify="space-between" wrap="nowrap">
@@ -75,8 +75,8 @@ export function BookingStatusTabs({
width: "32px",
height: "32px",
borderRadius: "8px",
background: isActive ? "var(--mantine-color-blue-1)" : "var(--mantine-color-gray-1)",
color: isActive ? "var(--mantine-color-blue-7)" : "var(--mantine-color-gray-6)",
background: isActive ? "var(--mantine-color-green-1)" : "var(--mantine-color-gray-1)",
color: isActive ? "var(--mantine-color-green-7)" : "var(--mantine-color-gray-6)",
}}
>
{TAB_ICONS[tab.key]}
@@ -89,7 +89,7 @@ export function BookingStatusTabs({
<Badge
size="sm"
variant={isActive ? "filled" : "light"}
color={isActive ? "blue" : "gray"}
color={isActive ? "green" : "gray"}
radius="lg"
>
{count}