Skip to content

Instantly share code, notes, and snippets.

@palcodes

palcodes/bottomsheet.html

Created January 6, 2021 07:35
Show Gist options
  • Save palcodes/b5873acb804224c4d1b6f9b3ab0430ac to your computer and use it in GitHub Desktop.
Save palcodes/b5873acb804224c4d1b6f9b3ab0430ac to your computer and use it in GitHub Desktop.
Download ZIP
Raw
bottomsheet.html
<div class="grid" data-reveal-away data-controller="reveal">
<div class="right-0" style="background-color: red;">
<button data-action="click->reveal#toggle" class="text-white px-4 w-auto h-10 bg-gray-900 rounded-full hover:bg-gray-800 active:shadow-2xl mouse shadow-2xl
transition ease-in duration-200 focus:outline-none">
<span>Add</span>
</button>
</div>
<div hidden data-reveal data-transition class="fixed bottom-0 shadow-xl bg-gray-100 p-5 rounded-t-lg">
<p class="font-semibold ml-2">Add a new Blob about you</p>
<ul>
<li class="p-2">Work Experience</li>
<hr>
<li class="p-2">Education</li>
<hr>
<li class="p-2">Link</li>
<hr>
<li class="p-2">Media</li>
<hr>
</ul>
</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment