mythic-insight/calcom
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 5

relative top bar on mobile

Browse source
This commit is contained in:
Peer Richelsen 2021-08-03 13:13:48 +02:00
parent b9125a54c8
commit 59748b4d40
1 changed files with 103 additions and 99 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
components/Shell.tsx
View file

@ -67,6 +67,7 @@ export default function Shell(props) {
} }
return session ? ( return session ? (
<>
<div className="h-screen flex overflow-hidden bg-gray-100"> <div className="h-screen flex overflow-hidden bg-gray-100">
{/* Static sidebar for desktop */} {/* Static sidebar for desktop */}
<div className="hidden md:flex md:flex-shrink-0"> <div className="hidden md:flex md:flex-shrink-0">
@ -91,7 +92,9 @@ export default function Shell(props) {
)}> )}>
<item.icon <item.icon
className={classNames( className={classNames(
item.current ? "text-neutral-500" : "text-neutral-400 group-hover:text-neutral-500", item.current
? "text-neutral-500"
: "text-neutral-400 group-hover:text-neutral-500",
"mr-3 flex-shrink-0 h-5 w-5" "mr-3 flex-shrink-0 h-5 w-5"
)} )}
aria-hidden="true" aria-hidden="true"
@ -108,7 +111,9 @@ export default function Shell(props) {
</div> </div>
</div> </div>
</div> </div>
<div className="flex flex-col w-0 flex-1 overflow-hidden"> <div className="flex flex-col w-0 flex-1 overflow-hidden">
<main className="flex-1 relative z-0 overflow-y-auto focus:outline-none">
{/* show top navigation for md and smaller (tablet and phones) */} {/* show top navigation for md and smaller (tablet and phones) */}
<nav className="md:hidden bg-white shadow p-4 flex justify-between items-center"> <nav className="md:hidden bg-white shadow p-4 flex justify-between items-center">
<Link href="/event-types"> <Link href="/event-types">
@ -130,8 +135,6 @@ export default function Shell(props) {
</div> </div>
</div> </div>
</nav> </nav>
<main className="flex-1 relative z-0 overflow-y-auto focus:outline-none">
<div className="py-6"> <div className="py-6">
<div className="block sm:flex justify-between px-4 sm:px-6 md:px-8"> <div className="block sm:flex justify-between px-4 sm:px-6 md:px-8">
<div className="mb-6"> <div className="mb-6">
@ -178,6 +181,7 @@ export default function Shell(props) {
</main> </main>
</div> </div>
</div> </div>
</>
) : null; ) : null;
} }