mirfalah-tech
/
pasca


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
							<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Dashboard</title>

    <link rel="preconnect" href="https://fonts.bunny.net">
    <link href="https://fonts.bunny.net/css?family=figtree:400,500,600&display=swap" rel="stylesheet" />

    @vite(['resources/css/app.css', 'resources/js/app.js'])
    <script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>

</head>
<body class="antialiased bg-gray-100 text-gray-800">

<div x-data="{ sidebarOpen: true }" class="min-h-screen flex">

    <!-- Sidebar -->
    <div :class="sidebarOpen ? 'w-64' : 'w-16'" class="bg-white border-r border-gray-200 transition-all duration-300 flex flex-col">
        <div class="p-4 flex justify-between items-center">
            <span x-show="sidebarOpen" class="font-bold text-lg">Dashboard</span>
            <button @click="sidebarOpen = !sidebarOpen" class="text-gray-600 focus:outline-none">
                <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path :class="sidebarOpen ? 'block' : 'hidden'" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
                    <path :class="!sidebarOpen ? 'block' : 'hidden'" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
                </svg>
            </button>
        </div>

        <nav class="flex-1 px-2 space-y-2" x-show="sidebarOpen">

            <!-- Dashboard -->
            <a href="#" class="block px-4 py-2 rounded hover:bg-gray-200">
                Dashboard
            </a>

            <!-- Projects (with children) -->
            <div x-data="{ open: false }" class="space-y-1">
                <button
                    @click="open = !open"
                    class="w-full flex justify-between items-center px-4 py-2 rounded hover:bg-gray-200 text-left"
                >
                    <span>Projects</span>
                    <svg :class="{'rotate-90': open}" class="w-4 h-4 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
                    </svg>
                </button>
                <div x-show="open" x-transition class="pl-6">
                    <a href="#" class="block px-2 py-1 rounded hover:bg-gray-100">All Projects</a>
                    <a href="#" class="block px-2 py-1 rounded hover:bg-gray-100">Create Project</a>
                </div>
            </div>

            <!-- Settings -->
            <a href="#" class="block px-4 py-2 rounded hover:bg-gray-200">
                Settings
            </a>

        </nav>
    </div>

    <!-- Content -->
    <div class="flex-1 p-6">
        @yield('content')
    </div>
    @yield('scripts')

</div>

</body>
</html>