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

Modal Dark Mode

Browse Source
This commit is contained in:
Belen Curcio 2020-10-22 18:24:04 -03:00
parent 98a1b7e8f0
commit c27c55ea46
3 changed files with 6 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
components/ui/Modal/Modal.module.css
View File

@ -1,8 +1,8 @@
.root {
@apply fixed bg-black flex items-center inset-0 z-50 justify-center;
@apply fixed bg-primary text-primary flex items-center inset-0 z-50 justify-center;
background-color: rgba(0, 0, 0, 0.35);
}
.modal {
@apply bg-white p-12;
@apply bg-primary p-12 border border-accents-2;
}

2
pages/index.tsx
View File

@ -70,7 +70,7 @@ export default function Home({
))}
</Grid>
<Marquee variant="secondary">
{bestSelling.slice(0, 3).map(({ node }) => (
{bestSelling.slice(3, 6).map(({ node }) => (
<ProductCard key={node.path} product={node} variant="slim" />
))}
</Marquee>

6
pages/login.tsx
View File

@ -28,20 +28,20 @@ export default function Login() {
<div className="pb-20">
<Modal close={() => {}}>
<div className="h-80 w-80 flex flex-col justify-between py-3 px-3">
<div className="flex justify-center pb-12">
<div className="flex justify-center pb-12 ">
<Logo width="64px" height="64px" />
</div>
<div className="flex flex-col space-y-3">
<div className="border border-accents-3 text-accents-6">
<input
placeholder="Email"
className="focus:outline-none focus:shadow-outline-gray border-none py-2 px-6 w-full appearance-none transition duration-150 ease-in-out placeholder-accents-5 pr-10"
className="focus:outline-none bg-primary focus:shadow-outline-gray border-none py-2 px-6 w-full appearance-none transition duration-150 ease-in-out placeholder-accents-5 pr-10"
/>
</div>
<div className="border border-accents-3 text-accents-6">
<input
placeholder="Password"
className="focus:outline-none focus:shadow-outline-gray border-none py-2 px-6 w-full appearance-none transition duration-150 ease-in-out placeholder-accents-5 pr-10"
className="bg-primary focus:outline-none focus:shadow-outline-gray border-none py-2 px-6 w-full appearance-none transition duration-150 ease-in-out placeholder-accents-5 pr-10"
/>
</div>
<Button variant="slim" onClick={handleSignup}>