chamomind/elearning
7
0
Fork 0
Code Issues 4 Pull requests Projects Releases Packages 3 Wiki Activity Actions

feat: Add LandingHeader component with scroll-based styling, navigation links, and authentication-dependent action buttons.
All checks were successful
Build and Deploy Frontend Learner / Build Frontend Learner Docker Image (push) Successful in 36s
Details
Build and Deploy Frontend Learner / Deploy E-learning Frontend Learner to Dev Server (push) Successful in 2s
Details
Build and Deploy Frontend Learner / Notify Deployment Status (push) Successful in 1s
Details

Browse source
This commit is contained in:
supalerk-ar66 2026-02-10 15:13:30 +07:00
parent d2e78dcfbb
commit c1f1cf5e57
1 changed files with 19 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

21
Frontend-Learner/components/layout/LandingHeader.vue
View file

@ -86,8 +86,8 @@ onMounted(() => {
<template v-if="!isAuthenticated">
<NuxtLink
to="/auth/login"
class="text-sm font-bold px-4 py-2 transition-colors"
:class="[isScrolled ? 'text-slate-300 hover:text-white' : 'text-slate-600 hover:text-blue-600']"
class="btn-secondary-premium shadow-sm"
:class="[isScrolled ? 'border-white/20 text-white hover:bg-white/10' : 'bg-blue-50 border-blue-100 text-blue-600 hover:bg-blue-100 hover:border-blue-200']"
>
{{ $t('auth.login') }}
</NuxtLink>
@ -145,6 +145,23 @@ onMounted(() => {
box-shadow: 0 8px 20px -4px rgba(37, 99, 235, 0.5);
}
/* Secondary Premium Button Styling */
.btn-secondary-premium {
padding: 0.75rem 1.5rem;
border-radius: 0.75rem;
font-size: 0.875rem;
font-weight: 800;
border: 1.5px solid;
transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
display: flex;
align-items: center;
justify-content: center;
}
.btn-secondary-premium:hover {
transform: translateY(-2px);
}
@media (max-width: 768px) {
.container {
padding: 0 16px;