@coinmeca/ui
Version:
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
67 lines (60 loc) • 1.82 kB
JSX
"use client";
import { styled } from "styled-components";
import { Root } from "../../lib/style";
import * as Row from "../../components/layouts/row/Row.styled";
import * as Col from "../../components/layouts/col/Col.styled";
export const Logo = styled.a `
max-width: max-content;
`;
export const Style = styled.section `
--white: 255, 255, 255;
--black: 0, 0, 0;
scroll-snap-align: end;
position: relative;
flex-direction: row;
background: black;
min-height: max-content !important;
color: white;
border-top: 1px solid rgba(255, 255, 255, 0.15);
padding: 4em;
padding-bottom: 8em;
overflow: hidden;
a:hover,
a:active {
background: none;
}
&:after {
content: "";
--range: 32em;
position: absolute;
width: 100%;
left: 0;
bottom: 0;
height: calc(150% + var(--range));
box-shadow: inset 0px 0px var(--range) rgba(255, 255, 255, 0.15);
pointer-events: none;
}
@media all and (max-width: ${Root.Device.Tablet}px) {
& {
padding: 3em;
padding-bottom: 8em;
${Row.default} {
${Row.default} {
width: initial !important;
max-width: initial !important;
${Col.default} {
flex: 1;
width: 100%;
}
${Row.default} {
width: initial !important;
max-width: initial !important;
flex-basis: 33.333%;
}
}
}
}
}
`;
export default Style;
//# sourceMappingURL=Footer.styled.jsx.map