feat: update ui

Author: dannweeeee

src/components/layout/activity/index.tsx

@@ -12,7 +12,7 @@ export default function ActivityComponent() {
   return (
     <div className="container mx-auto px-4 lg:px-8 py-6 md:py-10 space-y-6 md:space-y-10 max-w-7xl">
       <div className="flex justify-center md:justify-start">
-        <Badge className="bg-primary/10 hover:bg-primary/20 text-primary hover:text-primary/90 p-3 rounded-lg shadow-sm hover:shadow-md transition-all duration-300 transform hover:scale-105 border border-primary/20 hover:border-primary/30">
+        <Badge className="bg-primary/10 hover:bg-primary/20 text-primary hover:text-primary/90 p-3 rounded-lg shadow-sm hover:shadow-md transition-all duration-300 transform hover:scale-105">
           <ActivityIcon className="w-5 h-5 mr-2" />
           <span className="font-medium text-sm">Activity</span>
         </Badge>

src/components/layout/home/index.tsx

@@ -3,9 +3,9 @@ import { LayoutDashboard } from "lucide-react";
 
 export default function HomeComponent() {
   return (
-    <div className="container mx-auto px-4 lg:px-8 py-4 md:py-8 space-y-4 md:space-y-8">
+    <div className="container mx-auto px-4 lg:px-8 py-6 md:py-10 space-y-6 md:space-y-10 max-w-7xl">
       <div className="flex justify-center md:justify-start">
-        <Badge className="bg-primary/10 hover:bg-primary/20 text-primary hover:text-primary/90 p-3 rounded-lg shadow-sm hover:shadow-md transition-all duration-300 transform hover:scale-105 border border-primary/20 hover:border-primary/30">
+        <Badge className="bg-primary/10 hover:bg-primary/20 text-primary hover:text-primary/90 p-3 rounded-lg shadow-sm hover:shadow-md transition-all duration-300 transform hover:scale-105">
           <LayoutDashboard className="w-5 h-5 mr-2" />
           <span className="font-medium text-sm">Home</span>
         </Badge>

src/components/layout/merchant/index.tsx

@@ -49,7 +49,7 @@ export default function MerchantComponent() {
   return (
     <div className="container mx-auto px-4 lg:px-8 py-6 md:py-10 space-y-6 md:space-y-10 max-w-7xl">
       <div className="flex justify-center md:justify-start">
-        <Badge className="bg-primary/10 hover:bg-primary/20 text-primary hover:text-primary/90 p-3 rounded-lg shadow-sm hover:shadow-md transition-all duration-300 transform hover:scale-105 border border-primary/20 hover:border-primary/30">
+        <Badge className="bg-primary/10 hover:bg-primary/20 text-primary hover:text-primary/90 p-3 rounded-lg shadow-sm hover:shadow-md transition-all duration-300 transform hover:scale-105">
           <Store className="w-5 h-5 mr-2" />
           <span className="font-medium text-sm">Merchant</span>
         </Badge>

src/components/layout/payliao/index.tsx

@@ -3,9 +3,9 @@ import { ScanQrCode } from "lucide-react";
 
 export default function PayliaoComponent() {
   return (
-    <div className="container mx-auto px-4 lg:px-8 py-4 md:py-8 space-y-4 md:space-y-8">
+    <div className="container mx-auto px-4 lg:px-8 py-6 md:py-10 space-y-6 md:space-y-10 max-w-7xl">
       <div className="flex justify-center md:justify-start">
-        <Badge className="bg-primary/10 hover:bg-primary/20 text-primary hover:text-primary/90 p-3 rounded-lg shadow-sm hover:shadow-md transition-all duration-300 transform hover:scale-105 border border-primary/20 hover:border-primary/30">
+        <Badge className="bg-primary/10 hover:bg-primary/20 text-primary hover:text-primary/90 p-3 rounded-lg shadow-sm hover:shadow-md transition-all duration-300 transform hover:scale-105">
           <ScanQrCode className="w-5 h-5 mr-2" />
           <span className="font-medium text-sm">Payliao</span>
         </Badge>