mobile styles

This commit is contained in:
2025-06-29 20:02:22 -04:00
parent bd63eac8d0
commit 6efc29c669
4 changed files with 42 additions and 52 deletions

View File

@@ -5,11 +5,10 @@ import React from 'react'
export default function DashboardNavbar() {
const session = useSession()
console.log(session)
return (
<div className='bg-[#00000008] rounded-xl p-6 flex flex-col gap-2'>
<div className='bg-white md:bg-[#00000008] rounded-xl w-full md:w-auto p-2 pr-10 md:p-6 fixed md:static top-0 md:flex flex-col gap-2'>
<h2 className='text-lg font-semibold'>Hello, {session.data?.user.username}</h2>
<div className='*:bg-[#00000010] *:hover:bg-brand-primary-700 *:transition-colors *:duration-200 *:p-4 *:rounded-lg *:w-full flex flex-col gap-2'>
<div className='*:bg-[#00000010] *:hover:bg-brand-primary-700 *:transition-colors *:duration-200 *:px-2 *:py-1 md:*:p-4 *:rounded-lg *:w-full flex md:flex-col gap-2'>
<Link href={'/dashboard'} className='bg-brand-primary-800'>Overview</Link>
<Link href={'/events'} className=''>Events</Link>
<Link href={'/guest-book'} className=''>Guest Book</Link>

View File

@@ -48,7 +48,6 @@ export default function EventInfoDisplay({ event }: Props) {
const [todos, setTodos] = useState(event.todos)
const eventGuests = event.eventGuests
console.log(eventGuests)
const [saving, setSaving] = useState(false)
const [error, setError] = useState('')
@@ -111,8 +110,8 @@ export default function EventInfoDisplay({ event }: Props) {
}
return (
<div className="*:bg-[#00000008] *:p-6 *:rounded-lg *:space-y-4 grid grid-cols-6 gap-4">
<div className='col-span-6'>
<div className="*:bg-[#00000008] *:p-6 *:rounded-lg *:space-y-4 grid grid-cols-1 md:grid-cols-6 gap-4">
<div className='md:col-span-6 order-first'>
<div className="flex justify-between items-start col-span-6">
<h2 className="text-2xl font-bold">{event.name}</h2>
<button
@@ -187,7 +186,7 @@ export default function EventInfoDisplay({ event }: Props) {
/>
</div>
</div>
<div className='col-span-3'>
<div className='md:col-span-3 order-3 md:order-2'>
<div className='flex justify-between items-center'>
<h2 className='text-xl font-semibold'>Guest List</h2>
<button
@@ -239,7 +238,7 @@ export default function EventInfoDisplay({ event }: Props) {
</ul>
</div>
<div className='col-span-3'>
<div className='md:col-span-3 order-2 md:order-3'>
<ToDoList
eventId={event.id}
initialTodos={todos}