mirrors/zed
1
0
Fork 0
mirror of https://github.com/zed-industries/zed.git synced 2024-12-29 04:20:46 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

Add active page indicator

Browse source
This commit is contained in:
Nate 2021-09-20 18:02:04 -04:00
parent 9c0b9f0bcc
commit 1470184d45
2 changed files with 32 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
server/styles.css
View file

@ -47,6 +47,13 @@
}
}
.site-nav a:not(.active) .nav-active-arrow {
display: none;
}
.site-nav a.active .nav-active-arrow {
display: flex;
}
.text-columns-2 {
-webkit-column-break-inside: avoid;

35
server/templates/partials/layout.hbs
View file

@ -13,7 +13,7 @@
<body class="box-border font-light bg-black font-body text-main">
<main class="container flex flex-col mx-auto lg:bg-white lg:flex-none lg:grid lg:min-h-full lg:grid-cols-4 max-w-screen-2xl lg:gap-x-px text-gray-50">
<nav id="nav" class="p-10 pb-0 bg-black font-extralight lg:hidden">
<nav class="p-10 pb-0 bg-black font-extralight lg:hidden">
<a href="/">
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<mask id="path-2-inside-1" fill="white">
@ -78,7 +78,7 @@
{{/if}}
</nav>
<nav class="hidden p-10 pt-20 bg-black lg:flex lg:flex-col font-extralight">
<nav id="nav" class="hidden p-10 pt-20 bg-black lg:flex lg:flex-col font-extralight site-nav">
<a href="/" class="font-display">
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<mask id="path-2-inside-1" fill="white">
@ -89,16 +89,22 @@
</svg>
</a>
<div class="flex flex-col mt-10 font-mono">
<a href="/team" class="mt-2 text-base no-underline lowercase hover:underline">
<a href="/team" class="relative mt-2 text-base no-underline lowercase hover:underline">
<span class="absolute items-center justify-center hidden h-full align-middle nav-active-arrow -left-7">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10.1594 12.1606C10.0309 12.0567 9.96803 11.8899 9.96803 11.7204C9.96803 11.5509 10.0321 11.3846 10.1603 11.2564L12.7596 8.65813H1.6562C1.29392 8.65813 1 8.36284 1 7.97732C1 7.63829 1.29392 7.34573 1.6562 7.34573H12.7596L10.1613 4.74747C9.90501 4.49114 9.90501 4.07596 10.1613 3.81949C10.4177 3.56303 10.8328 3.56317 11.0893 3.81949L14.8078 7.53794C15.0641 7.79427 15.0641 8.20945 14.8078 8.46592L11.0893 12.1844C10.832 12.4395 10.4164 12.4395 10.1594 12.1606Z" fill="white"/></svg>
</span>
The Team
</a>
<a href="/story" class="relative mt-2 text-base no-underline lowercase nav-active hover:underline">
<span class="absolute flex items-center justify-center h-full align-middle nav-active-arrow -left-7">
<a href="/story" class="relative mt-2 text-base no-underline lowercase hover:underline">
<span class="absolute items-center justify-center hidden h-full align-middle nav-active-arrow -left-7">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10.1594 12.1606C10.0309 12.0567 9.96803 11.8899 9.96803 11.7204C9.96803 11.5509 10.0321 11.3846 10.1603 11.2564L12.7596 8.65813H1.6562C1.29392 8.65813 1 8.36284 1 7.97732C1 7.63829 1.29392 7.34573 1.6562 7.34573H12.7596L10.1613 4.74747C9.90501 4.49114 9.90501 4.07596 10.1613 3.81949C10.4177 3.56303 10.8328 3.56317 11.0893 3.81949L14.8078 7.53794C15.0641 7.79427 15.0641 8.20945 14.8078 8.46592L11.0893 12.1844C10.832 12.4395 10.4164 12.4395 10.1594 12.1606Z" fill="white"/></svg>
</span>
Our Story
</a>
<a href="/community" class="mt-2 text-base no-underline lowercase hover:underline">
<a href="/community" class="relative mt-2 text-base no-underline lowercase hover:underline">
<span class="absolute items-center justify-center hidden h-full align-middle nav-active-arrow -left-7">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10.1594 12.1606C10.0309 12.0567 9.96803 11.8899 9.96803 11.7204C9.96803 11.5509 10.0321 11.3846 10.1603 11.2564L12.7596 8.65813H1.6562C1.29392 8.65813 1 8.36284 1 7.97732C1 7.63829 1.29392 7.34573 1.6562 7.34573H12.7596L10.1613 4.74747C9.90501 4.49114 9.90501 4.07596 10.1613 3.81949C10.4177 3.56303 10.8328 3.56317 11.0893 3.81949L14.8078 7.53794C15.0641 7.79427 15.0641 8.20945 14.8078 8.46592L11.0893 12.1844C10.832 12.4395 10.4164 12.4395 10.1594 12.1606Z" fill="white"/></svg>
</span>
Community
</a>
</div>
@ -108,10 +114,16 @@
{{#if current_user}}
<div class="flex flex-col mt-10 font-mono">
<p class="text-xs tracking-widest uppercase opacity-50">Insiders</p>
<a href="/updates" class="mt-2 text-base no-underline lowercase hover:underline">
<a href="/updates" class="relative mt-2 text-base no-underline lowercase hover:underline">
<span class="absolute items-center justify-center hidden h-full align-middle nav-active-arrow -left-7">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10.1594 12.1606C10.0309 12.0567 9.96803 11.8899 9.96803 11.7204C9.96803 11.5509 10.0321 11.3846 10.1603 11.2564L12.7596 8.65813H1.6562C1.29392 8.65813 1 8.36284 1 7.97732C1 7.63829 1.29392 7.34573 1.6562 7.34573H12.7596L10.1613 4.74747C9.90501 4.49114 9.90501 4.07596 10.1613 3.81949C10.4177 3.56303 10.8328 3.56317 11.0893 3.81949L14.8078 7.53794C15.0641 7.79427 15.0641 8.20945 14.8078 8.46592L11.0893 12.1844C10.832 12.4395 10.4164 12.4395 10.1594 12.1606Z" fill="white"/></svg>
</span>
Updates
</a>
<a href="/releases" class="mt-2 text-base no-underline lowercase hover:underline">
<a href="/releases" class="relative mt-2 text-base no-underline lowercase hover:underline">
<span class="absolute items-center justify-center hidden h-full align-middle nav-active-arrow -left-7">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10.1594 12.1606C10.0309 12.0567 9.96803 11.8899 9.96803 11.7204C9.96803 11.5509 10.0321 11.3846 10.1603 11.2564L12.7596 8.65813H1.6562C1.29392 8.65813 1 8.36284 1 7.97732C1 7.63829 1.29392 7.34573 1.6562 7.34573H12.7596L10.1613 4.74747C9.90501 4.49114 9.90501 4.07596 10.1613 3.81949C10.4177 3.56303 10.8328 3.56317 11.0893 3.81949L14.8078 7.53794C15.0641 7.79427 15.0641 8.20945 14.8078 8.46592L11.0893 12.1844C10.832 12.4395 10.4164 12.4395 10.1594 12.1606Z" fill="white"/></svg>
</span>
Releases
</a>
</div>
@ -120,8 +132,11 @@
{{#if current_user.is_admin }}
<div class="flex flex-col mt-10 font-mono">
<p class="text-xs tracking-widest uppercase opacity-50">Admin</p>
<a href="/admin" class="inline-block mt-2 text-base no-underline lowercase hover:underline">
Users &amp Signups
<a href="/admin" class="relative inline-block mt-2 text-base no-underline lowercase hover:underline">
<span class="absolute items-center justify-center hidden h-full align-middle nav-active-arrow -left-7">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10.1594 12.1606C10.0309 12.0567 9.96803 11.8899 9.96803 11.7204C9.96803 11.5509 10.0321 11.3846 10.1603 11.2564L12.7596 8.65813H1.6562C1.29392 8.65813 1 8.36284 1 7.97732C1 7.63829 1.29392 7.34573 1.6562 7.34573H12.7596L10.1613 4.74747C9.90501 4.49114 9.90501 4.07596 10.1613 3.81949C10.4177 3.56303 10.8328 3.56317 11.0893 3.81949L14.8078 7.53794C15.0641 7.79427 15.0641 8.20945 14.8078 8.46592L11.0893 12.1844C10.832 12.4395 10.4164 12.4395 10.1594 12.1606Z" fill="white"/></svg>
</span>
Manage
</a>
</div>
{{/if}}