8fafbccb66
All checks were successful
Build, Push and Deploy / build-and-push (push) Successful in 3m47s
Gitea Actions Demo / Explore-Gitea-Actions (push) Successful in 15s
Build, Push and Deploy / deploy-staging (push) Successful in 40s
Build, Push and Deploy / deploy-production (push) Has been skipped
Build, Push and Deploy / cleanup (push) Successful in 1s
159 lines
5.5 KiB
PHP
159 lines
5.5 KiB
PHP
<style>
|
|
/* New React-like Header */
|
|
.react-header {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
min-height: 80px;
|
|
background: rgba(255, 255, 255, 0.95) !important;
|
|
backdrop-filter: blur(12px);
|
|
-webkit-backdrop-filter: blur(12px);
|
|
z-index: 1050;
|
|
border-bottom: 1px solid #e2e8f0;
|
|
font-family: 'Inter', sans-serif;
|
|
}
|
|
|
|
.react-header .navbar-brand a { text-decoration: none; }
|
|
|
|
.rh-logo-icon {
|
|
width: 40px;
|
|
height: 40px;
|
|
background-color: #0d9488;
|
|
border-radius: 0.5rem;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
|
|
}
|
|
|
|
.rh-logo-icon svg { color: white; width: 24px; height: 24px; }
|
|
|
|
.rh-logo-text {
|
|
font-weight: 800;
|
|
font-size: 1.5rem;
|
|
line-height: 1;
|
|
color: #0f172a;
|
|
letter-spacing: -0.025em;
|
|
margin-left: 0.5rem;
|
|
}
|
|
.rh-logo-text span { color: #0d9488; }
|
|
|
|
.rh-link {
|
|
color: #475569 !important;
|
|
font-weight: 600 !important;
|
|
font-size: 0.875rem !important;
|
|
transition: color 0.2s;
|
|
text-decoration: none;
|
|
padding: 0.5rem 1rem !important;
|
|
}
|
|
.rh-link:hover { color: #0d9488 !important; }
|
|
|
|
.rh-ai-link {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 0.375rem;
|
|
color: #0d9488 !important;
|
|
background-color: #f0fdfa;
|
|
padding: 0.375rem 0.875rem !important;
|
|
border-radius: 9999px;
|
|
border: 1px solid #ccfbf1;
|
|
font-weight: 700 !important;
|
|
font-size: 0.875rem !important;
|
|
transition: color 0.2s;
|
|
text-decoration: none;
|
|
margin: 0 0.5rem;
|
|
}
|
|
.rh-ai-link:hover { color: #0f766e !important; }
|
|
.rh-ai-link svg { width: 16px; height: 16px; margin-bottom: 2px; }
|
|
|
|
.rh-login {
|
|
color: #475569 !important;
|
|
font-weight: 600 !important;
|
|
font-size: 0.875rem !important;
|
|
transition: color 0.2s;
|
|
text-decoration: none;
|
|
margin-right: 1.25rem;
|
|
}
|
|
.rh-login:hover { color: #dc2626 !important; }
|
|
|
|
.rh-btn {
|
|
background-color: #0d9488 !important;
|
|
color: white !important;
|
|
padding: 0.625rem 1.25rem !important;
|
|
border-radius: 0.5rem;
|
|
font-weight: 600 !important;
|
|
font-size: 0.875rem !important;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 0.5rem;
|
|
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
|
|
transition: all 0.2s;
|
|
text-decoration: none;
|
|
border: none;
|
|
}
|
|
.rh-btn:hover { background-color: #0f766e !important; }
|
|
.rh-btn svg { width: 16px; height: 16px; margin-bottom: 2px; }
|
|
|
|
body { padding-top: 80px; }
|
|
@media (max-width: 991px) {
|
|
.react-header .navbar-nav {
|
|
padding: 1.5rem 0;
|
|
gap: 0.75rem;
|
|
}
|
|
.react-header .d-lg-flex {
|
|
padding-bottom: 1.5rem;
|
|
}
|
|
.react-header {
|
|
background: #ffffff !important;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<div class="react-header">
|
|
<nav class="navbar navbar-expand-lg h-100" style="min-height:80px;">
|
|
<div class="container" style="max-width:80rem;">
|
|
<!-- Logo -->
|
|
<a href="{{ route('home') }}">
|
|
<img src="/images/logokulakpos.png" alt="footer-logo" class="footer-logo" style="height: 40px; width: auto;" />
|
|
</a>
|
|
|
|
<!-- Mobile Toggle -->
|
|
<button class="navbar-toggler border-0 shadow-none" type="button" data-bs-toggle="collapse" data-bs-target="#reactNavbar" aria-controls="reactNavbar" aria-expanded="false" aria-label="Toggle navigation">
|
|
<i class="fa fa-bars text-secondary" style="font-size:1.5rem;"></i>
|
|
</button>
|
|
|
|
<!-- Menu Content -->
|
|
<div class="collapse navbar-collapse" id="reactNavbar">
|
|
<ul class="navbar-nav mx-auto align-items-center">
|
|
<li class="nav-item">
|
|
<a class="nav-link rh-link" href="{{ route('home') }}#fitur">Fitur POS</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link rh-ai-link" href="{{ route('home') }}#ai">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 8V4H8"/><rect width="16" height="12" x="4" y="8" rx="2"/><path d="M2 14h2"/><path d="M20 14h2"/><path d="M15 13v2"/><path d="M9 13v2"/></svg>
|
|
AI Assistance
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link rh-link" href="{{ route('home') }}#perangkat">Perangkat</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link rh-link" href="{{ route('home') }}#solusi">Solusi Industri</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link rh-link" href="{{ route('plan.index') }}">Harga</a>
|
|
</li>
|
|
</ul>
|
|
|
|
<div class="d-flex align-items-center justify-content-center d-lg-flex mt-3 mt-lg-0">
|
|
<a href="{{ route('login') }}" class="rh-login">Masuk</a>
|
|
<a href="{{ route('plan.index') }}" class="rh-btn">
|
|
Coba Gratis
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"/><path d="m12 5 7 7-7 7"/></svg>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
</div> |