minimal styles for admin page
Nate
created
Change summary
server/templates/admin.hbs | 15 +++++++--------
server/templates/partials/layout.hbs | 11 +++++++----
2 files changed, 14 insertions(+), 12 deletions(-)
Detailed changes
@@ -20,10 +20,10 @@
});
</script>
-<div class="bg-white">
- <div class="container py-4 px-8 md:px-12 mx-auto">
- <h1 class="text-xl font-bold border-b border-gray-300 mb-4">Users</h1>
- <table class="table" id="users">
+<div class="max-w-screen-lg mx-auto text-main text-white font-extralight p-20">
+ <h1 class="font-display font-extralight mb-10">Admin</h1>
+ <h2 class="text-xl font-bold border-b border-gray-300 mb-4">Users</h1>
+ <table class="table text-white" id="users">
<tr>
<th class="text-left pr-2">GitHub Login</th>
<th class="text-left pr-2">Admin</th>
@@ -47,7 +47,7 @@
{{#each users}}
<tr>
<form action="/users/{{id}}/delete" method="post">
- <td class="py-1">
+ <td class="py-1 text-white">
{{github_login}}
</td>
<td>
@@ -61,8 +61,8 @@
{{/each}}
</table>
- <h1 class="text-xl font-bold border-b border-gray-300 mb-4 mt-8">Signups</h1>
- <table class="table">
+ <h2 class="text-xl font-bold border-b border-gray-300 mb-4 mt-8">Signups</h1>
+ <table class="table text-white">
{{#each signups}}
<tr>
<form action="/signups/{{id}}/delete" method="post">
@@ -76,6 +76,5 @@
</tr>
{{/each}}
</table>
- </div>
</div>
{{/layout}}
@@ -40,7 +40,10 @@
<a href="/team" class="text-base lowercase no-underline hover:underline mt-2">
The Team
</a>
- <a href="/story" class="text-base lowercase no-underline hover:underline mt-2">
+ <a href="/story" class="nav-active relative text-base lowercase no-underline hover:underline mt-2">
+ <span class="nav-active-arrow absolute -left-7 h-full flex justify-center align-middle items-center">
+ <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="text-base lowercase no-underline hover:underline mt-2">
@@ -52,7 +55,7 @@
<!-- If user is at least an insider -->
{{#if current_user}}
<div class="font-mono flex flex-col mt-10">
- <p class="text-xs tracking-widest uppercase">Insider Zone</p>
+ <p class="text-xs opacity-25 tracking-widest uppercase">Insider Zone</p>
<a href="/updates" class="text-base lowercase no-underline hover:underline mt-2">
Updates
</a>
@@ -64,7 +67,7 @@
<!-- AND If user is an admin -->
{{#if current_user.is_admin }}
<div class="font-mono flex flex-col mt-10">
- <p class="text-xs tracking-widest uppercase">Admin Zone</p>
+ <p class="text-xs opacity-25 uppercase">Admin Zone</p>
<a href="/admin" class="inline-block text-base lowercase no-underline hover:underline mt-2">
Admin
</a>
@@ -75,7 +78,7 @@
<!-- TODO: Dropdown is linked to #avatar, just using it for now. Come back and clean up later -->
<p id="avatar" class="text-base lowercase no-underline hover:underline">@{{current_user.github_login}}</p>
<form id="sign_out" action="/sign_out" method="post">
- <button class="text-base text-gray-400 lowercase no-underline hover:underline mt-2">Sign out</button>
+ <button class="text-base opacity-25 lowercase no-underline hover:underline mt-2">Sign out</button>
</form>
</div>