eSPJ/Views/Admin/Transport/SpjDriverUpst/Shared/Components/_Navigation.cshtml

60 lines
3.7 KiB
Plaintext

<div class="fixed bottom-0 left-1/2 transform -translate-x-1/2 w-full lg:max-w-sm z-99">
<div class="relative backdrop-blur-lg border border-gray-200/50 rounded-t-3xl shadow-xl overflow-hidden">
<div class="absolute -top-0 left-1/2 transform -translate-x-1/2 w-20 h-10">
<div class="w-full h-full bg-transparent relative">
<div class="absolute left-0 top-0 w-10 h-10 backdrop-blur-lg rounded-br-full"></div>
<div class="absolute right-0 top-0 w-10 h-10 backdrop-blur-lg rounded-bl-full"></div>
</div>
</div>
<div class="flex justify-between items-center px-8 relative pt-6">
<a href="@Url.Action("Index", "Home")" class="flex flex-col items-center gap-1 px-4 py-2 transition-all duration-300 hover:scale-105 group">
<div class="relative">
<i class="w-6 h-6 text-gray-400 group-hover:text-gray-500 transition-colors duration-300" data-lucide="home"></i>
<div class="absolute -bottom-0.5 left-1/2 transform -translate-x-1/2 w-0 h-0.5 bg-upst group-hover:w-full transition-all duration-300"></div>
</div>
<span class="text-xs text-gray-600 group-hover:text-gray-500 font-medium transition-colors duration-300">Home</span>
</a>
<div class="w-12"></div>
<a href="@Url.Action("Index", "History")" class="flex flex-col items-center gap-1 px-4 py-2 transition-all duration-300 hover:scale-105 group">
<div class="relative">
<i class="w-6 h-6 text-gray-400 group-hover:text-gray-500 transition-colors duration-300" data-lucide="clipboard-check"></i>
<div class="absolute -bottom-0.5 left-1/2 transform -translate-x-1/2 w-0 h-0.5 bg-upst group-hover:w-full transition-all duration-300"></div>
</div>
<span class="text-xs text-gray-600 group-hover:text-gray-500 font-medium transition-colors duration-300">History</span>
</a>
</div>
</div>
<div class="absolute -top-4 left-1/2 transform -translate-x-1/2 flex flex-col items-center">
@* <a href="@Url.Action("Index", "Submit")"
id="odoBtn"
class="hover:cursor-pointer w-14 h-14 bg-blue-800 rounded-full shadow-xl flex items-center justify-center transition-all duration-300 hover:scale-110 hover:rotate-6 border-4 border-white ring-2 ring-gray-200">
<i class="w-6 h-6 text-white" data-lucide="truck"></i>
</a>
<span class="bg-blue-800 px-2 py-1 rounded-full text-xs text-white font-medium mt-2 text-center">
Upload Muatan
</span> *@
<!-- ini untuk yang struk -->
<a href="@Url.Action("Struk", "Submit")" id="strukBtn" class="hover:cursor-pointer w-14 h-14 bg-green-700 rounded-full shadow-xl flex items-center justify-center transition-all duration-300 hover:scale-110 hover:rotate-6 border-4 border-white ring-2 ring-green-200">
<i class="w-6 h-6 text-white" data-lucide="file-text"></i>
</a>
<span class="bg-green-700 px-2 py-1 rounded-full text-xs text-white font-medium mt-2 text-center">
Upload Struk
</span>
</div>
</div>
<div class="h-30"></div>
<register-block dynamic-section="scripts" key="jsNav">
</register-block>