lubo_comment_query/resources/views/common/header.blade.php

<nav class="bg-white dark:bg-gray-800 shadow-md sticky top-0 z-50 transition-colors duration-200">
    <div class="max-w-7xl mx-auto px-2 sm:px-6 lg:px-8">
        <div class="relative flex h-16 items-center justify-between">
            <div class="absolute inset-y-0 left-0 flex items-center md:hidden">
                <!-- Mobile menu button-->
                <button type="button" onclick="document.getElementById('_mobile_menu').classList.toggle('hidden')" class="inline-flex items-center justify-center rounded-md p-2 text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 hover:text-gray-500 dark:hover:text-white focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500" aria-controls="mobile-menu" aria-expanded="false">
                    <span class="sr-only">Open main menu</span>
                    <svg class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true">
                        <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" />
                    </svg>
                </button>
            </div>
            
            <div class="flex flex-1 items-center justify-center md:items-stretch md:justify-start">
                <div class="flex flex-shrink-0 items-center">
                    <a href="/" class="flex items-center space-x-2 text-gray-900 dark:text-white font-bold text-xl tracking-tight">
                         <span class="bg-indigo-600 text-white p-1 rounded-lg">
                            <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z"></path><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
                         </span>
                        <span>永恒の录播</span>
                    </a>
                </div>
                <div class="hidden md:ml-6 md:block">
                    <div class="flex space-x-2">
                        <!-- Navigation Links -->
                        <a href="/comments" class="{{ (request()->is('comments', '/', 'video/*')) ? 'bg-indigo-50 dark:bg-gray-700 text-indigo-700 dark:text-indigo-400' : 'text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 hover:text-indigo-600 dark:hover:text-white' }} px-3 py-2 rounded-md text-sm font-medium transition-colors">节目单查询</a>
                        <a href="/danmakus" class="{{ (request()->is('danmakus', 'danmakus/*')) ? 'bg-indigo-50 dark:bg-gray-700 text-indigo-700 dark:text-indigo-400' : 'text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 hover:text-indigo-600 dark:hover:text-white' }} px-3 py-2 rounded-md text-sm font-medium transition-colors">稿件查询</a>
                        <a href="/programs" class="{{ (request()->is('programs', 'programs/*/video')) ? 'bg-indigo-50 dark:bg-gray-700 text-indigo-700 dark:text-indigo-400' : 'text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 hover:text-indigo-600 dark:hover:text-white' }} px-3 py-2 rounded-md text-sm font-medium transition-colors">节目查询</a>
                        @auth("web")
                            <a href="/construct/programs" class="{{ (request()->is('construct/*')) ? 'bg-indigo-50 dark:bg-gray-700 text-indigo-700 dark:text-indigo-400' : 'text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 hover:text-indigo-600 dark:hover:text-white' }} px-3 py-2 rounded-md text-sm font-medium transition-colors">建设</a>
                        @endauth
                    </div>
                </div>
            </div>
            
            <div class="absolute inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto sm:ml-6 sm:pr-0">
                <div class="relative ml-3">
                     @auth("web")
                        <button type="button" onclick="document.getElementById('_user_menu').classList.toggle('hidden')" class="flex rounded-full bg-white dark:bg-gray-800 text-sm focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2" id="user-menu-button" aria-expanded="false" aria-haspopup="true">
                            <span class="sr-only">Open user menu</span>
                            <span class="inline-flex h-8 w-8 items-center justify-center rounded-full bg-indigo-600 text-white font-semibold">
                                {{ substr(Auth::user()->name, 0, 1) }}
                            </span>
                        </button>
                        
                        <div id="_user_menu" class="hidden absolute right-0 z-10 mt-2 w-48 origin-top-right rounded-md bg-white dark:bg-gray-800 py-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none" role="menu" aria-orientation="vertical" aria-labelledby="user-menu-button" tabindex="-1">
                            <div class="px-4 py-2 text-xs text-gray-500 dark:text-gray-400 border-b dark:border-gray-700">
                                {{ Auth::user()->name }}
                            </div>
                            <a href="{{ route("logout") }}" class="block px-4 py-2 text-sm text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700" role="menuitem" tabindex="-1">退出登录</a>
                        </div>
                    @endauth
                    @guest
                        <a href="{{ route("login") }}" class="text-gray-700 dark:text-gray-300 hover:text-indigo-600 dark:hover:text-white font-medium text-sm">登录</a>
                    @endguest
                </div>
            </div>
        </div>
    </div>

    <!-- Mobile menu -->
    <div class="hidden md:hidden" id="_mobile_menu">
        <div class="space-y-1 px-2 pt-2 pb-3 bg-gray-50 dark:bg-gray-800 border-t dark:border-gray-700">
             <a href="/comments" class="{{ (request()->is('comments', '/', 'video/*')) ? 'bg-indigo-50 dark:bg-gray-700 text-indigo-700 dark:text-indigo-400' : 'text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 hover:text-indigo-600 dark:hover:text-white' }} block px-3 py-2 rounded-md text-base font-medium">节目单查询</a>
             <a href="/danmakus" class="{{ (request()->is('danmakus', 'danmakus/*')) ? 'bg-indigo-50 dark:bg-gray-700 text-indigo-700 dark:text-indigo-400' : 'text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 hover:text-indigo-600 dark:hover:text-white' }} block px-3 py-2 rounded-md text-base font-medium">稿件查询</a>
             <a href="/programs" class="{{ (request()->is('programs', 'programs/*/video')) ? 'bg-indigo-50 dark:bg-gray-700 text-indigo-700 dark:text-indigo-400' : 'text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 hover:text-indigo-600 dark:hover:text-white' }} block px-3 py-2 rounded-md text-base font-medium">节目查询</a>
            @auth("web")
                <a href="/construct/programs" class="{{ (request()->is('construct/*')) ? 'bg-indigo-50 dark:bg-gray-700 text-indigo-700 dark:text-indigo-400' : 'text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 hover:text-indigo-600 dark:hover:text-white' }} block px-3 py-2 rounded-md text-base font-medium">节目建设</a>
            @endauth
        </div>
    </div>
</nav>