mirror of
https://github.com/screentinker/screentinker.git
synced 2026-05-15 07:32:23 -06:00
Landing: float Sign In to far top-right, separate from Start Free Trial
Sign In now lives outside the nav-links cluster with margin-left:auto, pinning it to the top-right corner with visible separation from the primary CTA. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
parent
87a935cb74
commit
e0bfa76545
|
|
@ -38,10 +38,11 @@
|
|||
|
||||
/* Nav */
|
||||
nav { position:fixed; top:0; left:0; right:0; z-index:100; background:rgba(17,24,39,0.9); backdrop-filter:blur(12px); border-bottom:1px solid var(--border); }
|
||||
.nav-inner { max-width:1200px; margin:0 auto; padding:16px 24px; display:flex; align-items:center; justify-content:space-between; }
|
||||
.nav-logo { display:flex; align-items:center; gap:10px; font-weight:700; font-size:18px; color:var(--accent); }
|
||||
.nav-inner { max-width:1200px; margin:0 auto; padding:16px 24px; display:flex; align-items:center; gap:24px; }
|
||||
.nav-logo { display:flex; align-items:center; gap:10px; font-weight:700; font-size:18px; color:var(--accent); flex-shrink:0; }
|
||||
.nav-links a { color:var(--muted); margin-left:24px; font-size:14px; transition:color 0.2s; }
|
||||
.nav-links a:hover { color:var(--text); }
|
||||
.nav-signin { margin-left:auto; flex-shrink:0; }
|
||||
.btn { display:inline-flex; align-items:center; gap:8px; padding:10px 20px; border-radius:8px; font-weight:600; font-size:14px; transition:all 0.2s; border:none; cursor:pointer; }
|
||||
.btn-primary { background:var(--accent); color:white; }
|
||||
.btn-primary:hover { background:#2563eb; }
|
||||
|
|
@ -123,11 +124,10 @@
|
|||
.nav-links { display:flex; align-items:center; flex-wrap:nowrap; }
|
||||
.btn-short { display:none; }
|
||||
@media (max-width:768px) {
|
||||
/* Hide section anchor links on mobile; keep Sign In + primary CTA */
|
||||
/* Hide section anchor links on mobile; keep Try Free + Sign In */
|
||||
.nav-links a:not(.btn) { display:none; }
|
||||
.nav-links { margin-left:auto; gap:8px; }
|
||||
.nav-inner { padding:12px 14px; }
|
||||
.nav-links .btn { padding:8px 12px; font-size:13px; margin-left:0 !important; flex-shrink:0; min-height:0; }
|
||||
.nav-inner { padding:12px 14px; gap:8px; }
|
||||
.nav-links .btn, .nav-signin { padding:8px 12px; font-size:13px; margin-left:0 !important; flex-shrink:0; min-height:0; }
|
||||
.btn-full { display:none; }
|
||||
.btn-short { display:inline; }
|
||||
}
|
||||
|
|
@ -162,9 +162,9 @@
|
|||
<a href="#platforms">Platforms</a>
|
||||
<a href="#pricing">Pricing</a>
|
||||
<a href="#compare">Compare</a>
|
||||
<a href="/app#/login" class="btn btn-outline" style="margin-left:16px">Sign In</a>
|
||||
<a href="/app#/login" class="btn btn-primary" style="margin-left:8px"><span class="btn-full">Start Free Trial</span><span class="btn-short">Try Free</span></a>
|
||||
<a href="/app#/login" class="btn btn-primary" style="margin-left:16px"><span class="btn-full">Start Free Trial</span><span class="btn-short">Try Free</span></a>
|
||||
</div>
|
||||
<a href="/app#/login" class="btn btn-outline nav-signin">Sign In</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue