-
Notifications
You must be signed in to change notification settings - Fork 11
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
2b69e6e
commit 56f4a42
Showing
1 changed file
with
53 additions
and
31 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,38 +1,57 @@ | ||
<script src="https://cdn.jsdelivr.net/gh/alpinejs/[email protected]/dist/alpine.min.js" defer></script> | ||
|
||
<div @click.away="open = false" | ||
class="flex flex-col w-full md:w-56 lg:w-64 text-gray-700 bg-white flex-shrink-0 md:h-screen md:z-50 md:fixed md:left-0 md:top-0" | ||
x-data="{ open: false }"> | ||
<div class="flex-shrink-0 px-6 py-4 flex flex-row items-center justify-between"> | ||
<h1 class="font-bold uppercase border-b border-gray-100 w-full text-center"> | ||
<a href="/" class="hover:text-gray-900 tracking-widest text-2xl md:text-2xl lg:text-3xl pb-2 pt-32">Tradebyte</a> | ||
</h1> | ||
<button class="rounded-lg md:hidden rounded-lg focus:outline-none focus:shadow-outline" @click="open = !open"> | ||
<svg fill="currentColor" viewBox="0 0 20 20" class="w-6 h-6"> | ||
<path x-show="!open" fill-rule="evenodd" | ||
d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM9 15a1 1 0 011-1h6a1 1 0 110 2h-6a1 1 0 01-1-1z" | ||
clip-rule="evenodd"></path> | ||
<path x-show="open" fill-rule="evenodd" | ||
d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" | ||
clip-rule="evenodd"></path> | ||
</svg> | ||
</button> | ||
</div> | ||
<nav :class="{'block': open, 'hidden': !open}" class="flex-grow md:block px-4 pb-4 md:pb-0"> | ||
<div class="flex justify-center align-center rounded-full"> | ||
<img class="h-20 w-20 border-8 border-blue-600 box-1 rounded-full" src="<%= avatar %>" alt="" /> | ||
</div> | ||
<a class="block w-2/5 md:w-4/5 max-w-xs lg:w-3/5 p-2 mt-4 mb-8 mx-auto text-xs font-bold text-gray-900 focus:shadow-outline flex justify-center bg-green-200 rounded-full text-green-900 font-bold" | ||
href="#"><svg class="w-5 mr-1 " fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" | ||
viewBox="0 0 24 24" stroke="currentColor"> | ||
<path d="M5 13l4 4L19 7"></path> | ||
</svg>Trading Active</a> | ||
<div class="nav-box flex flex-col justify-start"> | ||
<a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-gray-900 focus:text-gray-900 hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline flex <%= href === '/portfolio' ? 'bg-gray-200 border border-purple-700 border-l-8': '' %>" | ||
href="/portfolio"> | ||
<svg class="w-5 ml-2 mr-1" fill="none " stroke-linecap="round " stroke-linejoin="round " stroke-width="2 " | ||
viewBox="0 0 24 24 " stroke="currentColor "> | ||
<path | ||
d="M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4 | ||
|
||
<div class="flex-shrink-0 px-6 py-4 flex flex-row items-center justify-between"> | ||
<div class="flex-shrink-0 text-center"> | ||
<img class="h-8 w-8 tradebyte-logo " src="../images/TradeByte-Favicon.png" alt="Logo"> | ||
</div> | ||
<h4 class="font-bold text-center pt-1"> | ||
<a href="/" | ||
class="hover:text-gray-900 tracking-widest text-2xl md:text-2xl lg:text-3xl tradebyte-logo">Tradebyte</a> | ||
</h4> | ||
<button class="rounded-lg md:hidden rounded-lg focus:outline-none focus:shadow-outline" @click="open = !open"> | ||
<svg fill="currentColor" viewBox="0 0 20 20" class="w-6 h-6"> | ||
<path x-show="!open" fill-rule="evenodd" | ||
d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM9 15a1 1 0 011-1h6a1 1 0 110 2h-6a1 1 0 01-1-1z" | ||
clip-rule="evenodd"></path> | ||
<path x-show="open" fill-rule="evenodd" | ||
d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" | ||
clip-rule="evenodd"></path> | ||
</svg> | ||
</button> | ||
|
||
</div> | ||
|
||
|
||
<nav :class="{'block': open, 'hidden': !open}" class="flex-grow md:block px-4 pb-4 md:pb-0"> | ||
|
||
<hr class="line mb-6"> | ||
|
||
<div class="flex justify-center align-center rounded-full"> | ||
<img class="h-16 w-16 border-8 user-profile box-1 rounded-full" src="<%= user.image %>" alt="" /> | ||
</div> | ||
|
||
<a class="block w-2/5 md:w-4/5 max-w-xs p-2 mt-4 mb-8 mx-auto text-xs font-bold text-gray-900 focus:shadow-outline flex justify-center rounded-full text-green-900 font-bold tick-background" | ||
href="#"> | ||
<div class="tick mr-1"> | ||
<svg class="w-5 mr-1 " fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" | ||
viewBox="0 0 24 24" stroke="currentColor"> | ||
<path d="M5 13l4 4L19 7"></path> | ||
</svg> | ||
</div> Trading Active | ||
</a> | ||
|
||
<div class="nav-box flex flex-col justify-start"> | ||
|
||
<a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/portfolio' ? 'border tab-color border-l-8': '' %>" | ||
href="/portfolio"> | ||
<svg class="w-5 ml-2 mr-1" fill="none " stroke-linecap="round " stroke-linejoin="round " stroke-width="2 " | ||
viewBox="0 0 24 24 " stroke="currentColor "> | ||
<path | ||
d="M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4 | ||
13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zM16 13a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z "> | ||
</path> | ||
</svg>Dashboard</a> | ||
|
@@ -57,4 +76,7 @@ | |
d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" | ||
clip-rule="evenodd"></path> | ||
</svg>Logout</a> | ||
|
||
</div> | ||
</nav> | ||
</div> |