spota-dev/rebuild/resources/views/auth/legacy-login.blade.php

<x-layouts.app :title="$meta['title']">
    <section class="bg-[#F9FAFB] pb-15 pt-34 lg:pb-20 lg:pt-39">
        <div class="mx-auto max-w-[1170px] px-4 sm:px-8 xl:px-0">
            <div class="grid gap-6 lg:grid-cols-[minmax(0,1.05fr)_minmax(360px,440px)] lg:items-start">
                <article class="rounded-xl bg-white p-7 shadow-[0_8px_12px_rgba(13,10,44,0.04)] sm:p-9">
                    <span class="inline-flex rounded-full bg-[#625DF5]/[0.08] px-3 py-1 text-sm font-medium text-[#625DF5]">{{ $meta['eyebrow'] }}</span>
                    <h1 class="mt-5 max-w-[760px] text-[28px] font-bold leading-[38px] text-[#15171A] sm:text-[38px] sm:leading-[48px]">{{ $meta['heading'] }}</h1>
                    <p class="mt-5 max-w-[760px] text-sm leading-8 text-[#4B5563] sm:text-base">{{ $meta['description'] }}</p>

                    <div class="mt-8 rounded-xl border border-[#E5E7EB] bg-[#F9FAFB] p-5">
                        <p class="text-sm font-semibold uppercase tracking-[0.16em] text-[#979797]">{{ $meta['summary_title'] }}</p>
                        <div class="mt-4 space-y-3 text-sm leading-7 text-[#374151]">
                            @foreach ($meta['summary_points'] as $point)
                                <div class="rounded-lg bg-white px-4 py-3">{{ $point }}</div>
                            @endforeach
                        </div>
                    </div>

                    <div class="mt-6 rounded-xl border border-[#E5E7EB] bg-white p-5 text-sm leading-7 text-[#4B5563]">
                        <p class="font-semibold text-[#15171A]">Informasi Login</p>
                        <p class="mt-2">{{ $meta['status_note'] }}</p>
                        <p class="mt-2">{{ $meta['help_note'] }}</p>
                    </div>
                </article>

                <div class="rounded-xl bg-white p-5 shadow-[0_8px_12px_rgba(13,10,44,0.04)] sm:p-7.5 xl:p-9">
                    <div class="mb-6 grid grid-cols-2 rounded-[14px] bg-[#F9FAFB] p-1.5 text-sm font-medium text-[#15171A]">
                        <a href="{{ route('legacy.login', 'mahasiswa') }}" class="rounded-[10px] px-4 py-3 text-center {{ $role === 'mahasiswa' ? 'bg-white shadow-[0_4px_10px_rgba(13,10,44,0.05)]' : 'text-[#5C6A78]' }}">Mahasiswa</a>
                        <a href="{{ route('legacy.login', 'dosen') }}" class="rounded-[10px] px-4 py-3 text-center {{ $role === 'dosen' ? 'bg-white shadow-[0_4px_10px_rgba(13,10,44,0.05)]' : 'text-[#5C6A78]' }}">Dosen</a>
                    </div>

                    <div class="mb-6 inline-flex rounded-full border border-[#E5E7EB] bg-[#F9FAFB] px-3 py-1.5 text-sm font-medium text-[#15171A]">
                        {{ $meta['status'] }}
                    </div>

                    @if ($errors->any())
                        <div class="mb-6 rounded-md border border-rose-200 bg-rose-50 px-4 py-3 text-sm text-rose-700">
                            <ul class="space-y-1">
                                @foreach ($errors->all() as $error)
                                    <li>{{ $error }}</li>
                                @endforeach
                            </ul>
                        </div>
                    @endif

                    <form method="POST" action="{{ route('legacy.authenticate', $role) }}">
                        @csrf
                        <div class="mb-4">
                            <label for="identifier" class="mb-3 block text-[14px] font-medium leading-[22px] text-[#15171A]">{{ $meta['input'] }}</label>
                            <input id="identifier" name="identifier" type="text" value="{{ old('identifier') }}" placeholder="{{ $meta['placeholder'] }}" class="template-input">
                        </div>
                        @if ($role === 'dosen')
                            <div class="mb-4">
                                <label for="prodi" class="mb-3 block text-[14px] font-medium leading-[22px] text-[#15171A]">Program Studi</label>
                                <input id="prodi" type="text" value="Informatika" disabled class="template-input bg-[#F9FAFB] text-[#5C6A78]">
                            </div>
                        @endif
                        <div class="mb-5">
                            <label for="password" class="mb-3 block text-[14px] font-medium leading-[22px] text-[#15171A]">Password</label>
                            <input id="password" name="password" type="password" placeholder="Masukkan password" class="template-input">
                        </div>
                        <div class="mb-7 flex items-center justify-between text-sm text-[#374151]">
                            <span>{{ $role === 'mahasiswa' ? 'Gunakan akun mahasiswa aktif' : ($role === 'dosen' ? 'Gunakan akun dosen aktif' : 'Akses admin belum tersedia') }}</span>
                            <a href="{{ route('role-login') }}" class="text-[#15171A]">Kembali</a>
                        </div>
                        <button type="submit" class="flex w-full justify-center rounded-md bg-[#15171A] px-5 py-3.5 font-medium text-white hover:opacity-90 {{ $role === 'admin' ? 'opacity-75' : '' }}">{{ $role === 'mahasiswa' ? 'Masuk ke Portal Mahasiswa' : ($role === 'dosen' ? 'Masuk ke Dashboard Dosen' : 'Coba Masuk') }}</button>
                    </form>

                    <p class="mt-5 text-sm leading-7 text-[#5C6A78]">{{ $role === 'mahasiswa' ? 'Login mahasiswa tetap memakai data autentikasi SPOTA yang aktif saat ini.' : ($role === 'dosen' ? 'Login dosen membaca akun legacy aktif dengan struktur session yang mengikuti sistem lama.' : 'Halaman admin akan dibuka setelah modul utama selesai dipindahkan.') }}</p>
                </div>
            </div>
        </div>
    </section>
</x-layouts.app>