Change summary
server/styles.css | 12 ++++++++----
server/templates/community.hbs | 2 +-
server/templates/partials/layout.hbs | 18 +++++++++++++-----
server/templates/releases.hbs | 2 +-
server/templates/team.hbs | 2 +-
5 files changed, 24 insertions(+), 12 deletions(-)
Detailed changes
@@ -55,6 +55,10 @@
display: flex;
}
+ .site-mobile-nav a.active {
+ font-weight: bold;
+ }
+
.text-columns-2 {
-webkit-column-break-inside: avoid;
page-break-inside: avoid;
@@ -98,8 +102,8 @@
}
.checkbox__control {
- width: 1.5rem;
- height: 1.5rem;
+ width: 30px;
+ height: 30px;
}
.checkbox__control svg {
@@ -114,8 +118,8 @@
.checkbox__input input {
opacity: 0;
- width: 1.5rem;
- height: 1.5rem;
+ width: 30px;
+ height: 30px;
}
.checkbox__input input:focus + .checkbox__control {
@@ -1,6 +1,6 @@
{{#> layout }}
-<div class="max-w-screen-lg p-10 mx-auto font-extralight text-main lg:p-20">
+<div class="max-w-screen-lg p-5 mx-auto font-extralight text-main lg:p-20">
<h1 class="mb-10 font-display font-extralight">We’re building a community of passionate developers & advocates.</h1>
<p class="mt-5 leading-relaxed">If you would like to get involved early, sign up for the our community below and we will let you know when it opens.</p>
@@ -34,7 +34,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 class="p-5 pt-10 pb-0 bg-black font-extralight lg:hidden">
+ <nav id="mobile-nav" class="p-5 pt-10 pb-5 bg-black font-extralight lg:hidden site-mobile-nav">
<div class="flex flex-row justify-between">
<a href="/" class="block hover:opacity-80">
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
@@ -69,16 +69,16 @@
</a>
<a href="/community" class="mr-2 text-lg leading-relaxed">
- Waitlist <span class="pt-1 mr-1 text-lg text-gray-500">·</span>
+ Waitlist
</a>
{{#if current_user}}
<a href="/releases" class="mr-2 text-lg leading-relaxed">
- Releases <span class="pt-1 mr-1 text-lg text-gray-500">·</span>
+ <span class="pt-1 mr-1 text-lg text-gray-500">·</span> Releases
</a>
{{#if current_user.is_admin }}
<a href="/admin" class="inline-block mr-2 text-lg leading-relaxed">
- Manage Users <span class="pt-1 mr-1 text-lg text-gray-500">·</span>
+ <span class="pt-1 mr-1 text-lg text-gray-500">·</span> Manage Users
</a>
{{/if}}
{{/if}}
@@ -164,7 +164,7 @@
{{/if}}
</nav>
- <div class="col-span-3 bg-black">
+ <div class="col-span-3 pb-20 bg-black">
{{> @partial-block}}
</div>
</main>
@@ -180,6 +180,14 @@
link.classList.add('active');
}
}
+ const mnav = document.getElementById('mobile-nav');
+ const mlinks = mnav.getElementsByTagName('a');
+ const mcurrentPath = window.location.pathname;
+ for (const mlink of mlinks) {
+ if (mlink.getAttribute('href') === mcurrentPath) {
+ mlink.classList.add('active');
+ }
+ }
</script>
</html>
@@ -1,6 +1,6 @@
{{#> layout }}
-<div class="max-w-screen-lg p-10 mx-auto font-extralight text-main lg:p-20">
+<div class="max-w-screen-lg p-5 mx-auto font-extralight text-main lg:p-20">
{{#if current_user}}
<h1 class="mb-10 font-display font-extralight">Releases</h1>
<p class="mt-5 leading-relaxed">Zed is currently only available on macOS.</p>
@@ -1,6 +1,6 @@
{{#> layout }}
-<div class="max-w-screen-lg p-10 mx-auto font-extralight text-main lg:p-20">
+<div class="max-w-screen-lg p-5 mx-auto font-extralight text-main lg:p-20">
<h1 class="mb-10 text-4xl text-white font-display font-extralight">
We think there’s a better way to write code–and we've been working for more than a decade to bring it into existence.
</h1>