dwindown/meet-hub
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add shadows to mobile cards and fix AdminProducts wrapper

Browse Source 
- Add shadow-sm to all mobile row cards for consistency
- Hide Card wrapper on mobile for AdminProducts page
- Add shadows to review cards in AdminReviews
- Applied to AdminMembers, AdminOrders, AdminConsulting,
  AdminEvents, AdminProducts, AdminReviews

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
dwindown
2025-12-25 11:02:55 +07:00
parent bc88c0590d
commit 8c7f4000a9
6 changed files with 22 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/pages/admin/AdminConsulting.tsx
View File

@@ -412,7 +412,7 @@ export default function AdminConsulting() {
{/* Mobile Card Layout */}
<div className="md:hidden space-y-3">
{upcomingSlots.map((slot) => (
<div key={slot.id} className="border-2 border-border rounded-lg p-4 space-y-3 bg-card">
<div key={slot.id} className="border-2 border-border rounded-lg p-4 space-y-3 bg-card shadow-sm">
<div>
<div className="flex items-start justify-between gap-2">
<div className="flex-1 min-w-0">
@@ -542,7 +542,7 @@ export default function AdminConsulting() {
{/* Mobile Card Layout */}
<div className="md:hidden space-y-3">
{pastSlots.slice(0, 20).map((slot) => (
<div key={slot.id} className="border-2 border-border rounded-lg p-4 space-y-3 bg-card">
<div key={slot.id} className="border-2 border-border rounded-lg p-4 space-y-3 bg-card shadow-sm">
<div>
<div className="flex items-start justify-between gap-2">
<div className="flex-1 min-w-0">

4
src/pages/admin/AdminEvents.tsx
View File

@@ -282,7 +282,7 @@ export default function AdminEvents() {
{/* Mobile Card Layout */}
<div className="md:hidden space-y-3">
{events.map((event) => (
<div key={event.id} className="border-2 border-border rounded-lg p-4 space-y-3 bg-card">
<div key={event.id} className="border-2 border-border rounded-lg p-4 space-y-3 bg-card shadow-sm">
<div>
<div className="flex items-start justify-between gap-2">
<div className="flex-1 min-w-0">
@@ -379,7 +379,7 @@ export default function AdminEvents() {
{/* Mobile Card Layout */}
<div className="md:hidden space-y-3">
{blocks.map((block) => (
<div key={block.id} className="border-2 border-border rounded-lg p-4 space-y-3 bg-card">
<div key={block.id} className="border-2 border-border rounded-lg p-4 space-y-3 bg-card shadow-sm">
<div>
<div className="flex items-start justify-between gap-2">
<div className="flex-1 min-w-0">

2
src/pages/admin/AdminMembers.tsx
View File

@@ -160,7 +160,7 @@ export default function AdminMembers() {
{/* Mobile Card Layout */}
<div className="md:hidden space-y-3">
{members.map((member) => (
<div key={member.id} className="border-2 border-border rounded-lg p-4 space-y-3 bg-card">
<div key={member.id} className="border-2 border-border rounded-lg p-4 space-y-3 bg-card shadow-sm">
<div>
<div className="flex items-start justify-between gap-2">
<div className="flex-1 min-w-0">

2
src/pages/admin/AdminOrders.tsx
View File

@@ -224,7 +224,7 @@ export default function AdminOrders() {
{/* Mobile Card Layout */}
<div className="md:hidden space-y-3">
{orders.map((order) => (
<div key={order.id} className="border-2 border-border rounded-lg p-4 space-y-3 bg-card">
<div key={order.id} className="border-2 border-border rounded-lg p-4 space-y-3 bg-card shadow-sm">
<div>
<div className="flex items-start justify-between gap-2">
<div className="flex-1 min-w-0">

28
src/pages/admin/AdminProducts.tsx
View File

@@ -162,10 +162,10 @@ export default function AdminProducts() {
</Button>
</div>
<Card className="border-2 border-border">
<Card className="border-2 border-border hidden md:block">
<CardContent className="p-0">
{/* Desktop Table */}
<div className="hidden md:block overflow-x-auto">
<div className="overflow-x-auto">
<Table>
<TableHeader>
<TableRow>
@@ -216,11 +216,13 @@ export default function AdminProducts() {
</TableBody>
</Table>
</div>
</CardContent>
</Card>
{/* Mobile Card Layout */}
<div className="md:hidden space-y-3">
{products.map((product) => (
<div key={product.id} className="border-2 border-border rounded-lg p-4 space-y-3 bg-card">
{/* Mobile Card Layout */}
<div className="md:hidden space-y-3">
{products.map((product) => (
<div key={product.id} className="border-2 border-border rounded-lg p-4 space-y-3 bg-card shadow-sm">
<div className="flex items-start justify-between gap-2">
<div className="flex-1 min-w-0">
<h3 className="font-semibold text-base line-clamp-1">{product.title}</h3>
@@ -257,15 +259,13 @@ export default function AdminProducts() {
</div>
</div>
</div>
))}
{products.length === 0 && (
<div className="text-center py-8 text-muted-foreground">
Belum ada produk
</div>
)}
))}
{products.length === 0 && (
<div className="text-center py-8 text-muted-foreground">
Belum ada produk
</div>
</CardContent>
</Card>
)}
</div>
<Dialog open={dialogOpen} onOpenChange={setDialogOpen}>
<DialogContent className="max-w-3xl max-h-[90vh] overflow-y-auto border-2 border-border">

4
src/pages/admin/AdminReviews.tsx
View File

@@ -210,7 +210,7 @@ export default function AdminReviews() {
</Card>
) : (
filteredReviews.map((review) => (
<Card key={review.id} className="border-2 border-border">
<Card key={review.id} className="border-2 border-border shadow-sm">
<CardContent className="py-4">
<div className="flex items-start justify-between gap-4">
<div className="flex-1 space-y-2">
@@ -289,7 +289,7 @@ export default function AdminReviews() {
</Card>
) : (
pendingReviews.map((review) => (
<Card key={review.id} className="border-2 border-primary/20">
<Card key={review.id} className="border-2 border-primary/20 shadow-sm">
<CardContent className="py-4">
<div className="flex items-start justify-between gap-4">
<div className="flex-1 space-y-2">