cx/commerce
4
0
Fork 0
forked from crowetic/commerce
Code Pull Requests Activity

Changes to the sidebar

Browse Source
This commit is contained in:
Belen Curcio 2020-10-06 15:56:59 -03:00
parent de63c75d92
commit b3d2802739
2 changed files with 3 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/ui/Sidebar/Sidebar.module.css
View File

@ -1,3 +1,3 @@
.root { .root {
@apply transition-all duration-75 ease-in-out; @apply fixed inset-0 overflow-hidden h-full z-50;
} }

4
components/ui/Sidebar/Sidebar.tsx
View File

@ -12,7 +12,7 @@ const Sidebar: FC<Props> = ({ className, children, show = true }) => {
const rootClassName = cn(s.root, className) const rootClassName = cn(s.root, className)
return ( return (
<Transition show={show}> <Transition show={show}>
<div className="fixed inset-0 overflow-hidden h-full"> <div className={rootClassName}>
<div className="absolute inset-0 overflow-hidden"> <div className="absolute inset-0 overflow-hidden">
<Transition.Child <Transition.Child
enter="transition-opacity ease-linear duration-300" enter="transition-opacity ease-linear duration-300"
@ -34,7 +34,7 @@ const Sidebar: FC<Props> = ({ className, children, show = true }) => {
leaveTo="translate-x-full" leaveTo="translate-x-full"
> >
<div className="h-full w-screen max-w-2xl"> <div className="h-full w-screen max-w-2xl">
<div className="h-full flex flex-col space-y-6 py-6 bg-white shadow-xl overflow-y-scroll"> <div className="h-full flex flex-col space-y-6 bg-white shadow-xl overflow-y-scroll">
{children} {children}
</div> </div>
</div> </div>