diff --git a/src/domains/misc/components/Layout/AnimatingBackground.tsx b/src/domains/misc/components/Layout/AnimatingBackground.tsx deleted file mode 100644 index acf3b11..0000000 --- a/src/domains/misc/components/Layout/AnimatingBackground.tsx +++ /dev/null @@ -1,63 +0,0 @@ -import styled from 'styled-components'; - -import vars from 'src/domains/styling/utils/vars'; - -import AnimatingBgSvg from './bgAnimation.svg?react'; - -const AnimatingBackground = () => ( - - - - -); - -export default AnimatingBackground; - -const Container = styled.div` - position: fixed; - inset: 0; - - z-index: -1; - - & > * { - /* - The below values are a result of calculations aimed to achieve fluid responsiveness - based on extrapolation of states defined by the designs. Those states are positions - and sizes of the two animating elements on both desktop (1792x1084) and mobile (360x640): - +----------------------+---------------+----------+----------+---------+ - | element | x | y | width | height | - +----------------------+---------------+----------+----------+---------+ - | 1st element desktop | -350px | 250px | 1450 | 896 | - | 1st element mobile | -460px | 140px | 950opx | 587px | - | 2nd element desktop | 100vw - 700 | -300px | 1450 | 896 | - | 2nd element mobile | 100vw | -590 | 950opx | 587px | - +----------------------+---------------+----------+----------+---------+ - - Those states form points from which coefficients of the function "y = a * x + b" - where found and used in the "calc()" function as follows: "calc(vw + px)". - - This made the designs fluid in respect to the width of the window. In order - to make it better laid out in taller screens, some "calc(vh + px)" functions - (calculated with the exact same method as described above, but with respect to the - window height) were added using "max()" or "min()" (selected based on visual appeal) - which make the browser choose between the width-based and height-based fluid dimensions. - */ - position: fixed; - width: calc(35vw + 824px); - height: calc(22vw + 510px); - - & * { - stroke: ${vars('--color-neutral-stroke-3-rest')}; - } - - &:nth-child(1) { - top: max(calc(8vw + 110px), calc(25vh - 18px)); - left: calc(8vw - 490px); - } - - &:nth-child(2) { - top: min(calc(20vw - 650px), calc(60vh - 1000px)); - left: calc(100vw - (50vw - 175px)); - } - } -`; diff --git a/src/domains/misc/components/Layout/Footer.tsx b/src/domains/misc/components/Layout/Footer.tsx index 7489c26..d966b9e 100644 --- a/src/domains/misc/components/Layout/Footer.tsx +++ b/src/domains/misc/components/Layout/Footer.tsx @@ -1,6 +1,5 @@ import styled from 'styled-components'; -import Button from 'src/domains/misc/components/Button'; import { BREAKPOINTS, CHANGELOG_LINK, @@ -27,30 +26,20 @@ const Footer = () => ( blanksquare.io - - - - Copyright © {new Date().getFullYear()} Blanksquare, ver. {import.meta.env.APP_VERSION} - - - Terms of service - - - Privacy policy - - - Fraud Protection Policy - - - - + + + Copyright © {new Date().getFullYear()} Blanksquare, ver. {import.meta.env.APP_VERSION} + + + Terms of service + + + Privacy policy + + + Fraud Protection Policy + + ); @@ -79,10 +68,6 @@ const InnerContainer = styled.div` flex-wrap: wrap; `; -const CopyrightContainer = styled(InnerContainer)` - justify-content: space-between; -`; - const Copyright = styled.div` width: 100%; color: ${vars('--color-neutral-foreground-4-rest')}; diff --git a/src/domains/misc/components/Layout/Layout.tsx b/src/domains/misc/components/Layout/Layout.tsx index 04864c3..e5a570a 100644 --- a/src/domains/misc/components/Layout/Layout.tsx +++ b/src/domains/misc/components/Layout/Layout.tsx @@ -6,7 +6,6 @@ import styled from 'styled-components'; import { BREAKPOINTS, BOTTOM_NAVIGATION_HEIGHT, BOTTOM_MENU_BREAKPOINT } from 'src/domains/misc/consts/consts'; import vars from 'src/domains/styling/utils/vars'; -import AnimatingBackground from './AnimatingBackground'; import Footer from './Footer'; import Navigation from './Navigation'; import TopBar from './TopBar'; @@ -38,7 +37,6 @@ const Layout = ({ children }: Props) => { )} - ); }; diff --git a/src/domains/misc/components/Layout/bgAnimation.svg b/src/domains/misc/components/Layout/bgAnimation.svg deleted file mode 100644 index 01a3c89..0000000 --- a/src/domains/misc/components/Layout/bgAnimation.svg +++ /dev/null @@ -1,36 +0,0 @@ - - - - - - - - \ No newline at end of file