Skip to content

Instantly share code, notes, and snippets.

@paulwongx

paulwongx/dashboard_sidebar.html

Created September 1, 2023 20:48
Show Gist options
  • Save paulwongx/d2f283841851104b25af33abd2ee18f4 to your computer and use it in GitHub Desktop.
Save paulwongx/d2f283841851104b25af33abd2ee18f4 to your computer and use it in GitHub Desktop.
Download ZIP
Tailwind Gists
Raw
dashboard_sidebar.html
<div class="flex h-screen w-full flex-col bg-green-50">
<div class="h-[72px] w-full bg-green-100">Header</div>
<div id="body" class="flex flex-row">
<div id="sidebar" class="flex-0 scrollbar h-[calc(100vh-72px)] w-64 bg-green-200 flex flex-col">
<div id="top-sidebar" class="flex flex-col bg-red-50">
<div>Menu 1</div>
<div>Menu 2</div>
<div>Menu 3</div>
</div>
<div class="mt-auto">Footer</div>
</div>
<div class="w-full bg-yellow-100">Main content</div>
</div>
</div>
@paulwongx
Copy link
Author

Tailwind playground url: https://play.tailwindcss.com/KbaHvLcFq1

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment