From 532871ac24057f0f63ac91c6295499088d33a380 Mon Sep 17 00:00:00 2001 From: unknown Date: Tue, 8 Mar 2022 11:25:39 +0530 Subject: [PATCH] Resolved conflits --- .../components/HomeSection/HomeSection.jsx | 84 +- .../HomeSection/HomeSection.style.js | 2 + frontend/components/NavBar/Logo.js | 39 +- frontend/components/NavBar/index.js | 48 +- frontend/package-lock.json | 4367 +++++++++++++++++ frontend/package.json | 1 + frontend/pages/index.js | 3 + frontend/pages/login.js | 3 +- frontend/styles/HomeSection.module.css | 36 +- frontend/styles/globals.css | 12 +- frontend/yarn.lock | 1572 ++++++ 11 files changed, 6112 insertions(+), 55 deletions(-) create mode 100644 frontend/package-lock.json create mode 100644 frontend/yarn.lock diff --git a/frontend/components/HomeSection/HomeSection.jsx b/frontend/components/HomeSection/HomeSection.jsx index 5842b9b..1138686 100644 --- a/frontend/components/HomeSection/HomeSection.jsx +++ b/frontend/components/HomeSection/HomeSection.jsx @@ -1,15 +1,52 @@ import React, { useState } from 'react' import HomeSectionStyle from './HomeSection.style' import Link from 'next/link' +import { motion } from 'framer-motion' import Image from 'next/image' import Axios from 'helpers/Axios' import { Alert, Button, Collapse, IconButton } from '@mui/material' import CloseIcon from '@mui/icons-material/Close' import ContentCopyIcon from '@mui/icons-material/ContentCopy' import QRCode from 'qrcode' +import { signup } from '@pages/signup' import NotFound from '@pages/404' import styles from '../../styles/HomeSection.module.css' +const spanVariants = { + visible: { y: 0, scaleY: 1 }, + hover: { + y: [-1, -2, -2.8, 0.9, 0], + scaleY: [1, 1.3, 0.8, 1.2, 1], + color: '#4A1C40' + } +} +const list = { + hidden: { + opacity: 0, + transition: { + when: 'afterChildren' + } + }, + visible: { + opacity: 1, + transition: { + when: 'beforeChildren', + staggerChildren: 0.3 + } + } +} + +const effect = { + hidden: { + opacity: 0, + }, + visible: { + opacity: 1, + y: [-1, -1.9, -2.7, 1], + scaleY: [1, 1.3, 0.8, 1] + } +} + const QR = { marginTop: '1.8em', } @@ -22,6 +59,7 @@ function HomeSection(props) { const setMinfy = async () => { + props.setLongUrl('') setOpen(false) setDisabled(true) let res @@ -59,12 +97,32 @@ function HomeSection(props) { } } + const text1 = "Url"; + const text2 = "MiniFy"; + + return (
-

URL MINIFY

- -
+ +
+ {text1.split("").map((Letter, id) => ( + + + {Letter} + + ))} +      +
+
+ {text2.split("").map((Letter, id) => ( + + {Letter} + + ))} +
+ + MINIFY -
- -
-

+ +
+ Need more advanced features? |{' '} - - Create an account + + Create an account -

+
{ @@ -112,10 +171,10 @@ function HomeSection(props) { ) }
- + - ) } diff --git a/frontend/components/HomeSection/HomeSection.style.js b/frontend/components/HomeSection/HomeSection.style.js index 5e14c88..4090455 100644 --- a/frontend/components/HomeSection/HomeSection.style.js +++ b/frontend/components/HomeSection/HomeSection.style.js @@ -10,5 +10,7 @@ export default styled.section` justify-content: center; align-items: center; flex-direction: column; + .title{display: flex; + margin-bottom:0.5rem;} } ` diff --git a/frontend/components/NavBar/Logo.js b/frontend/components/NavBar/Logo.js index 489571f..4e2746b 100644 --- a/frontend/components/NavBar/Logo.js +++ b/frontend/components/NavBar/Logo.js @@ -1,26 +1,47 @@ import React from 'react' +import { motion } from 'framer-motion' + +const pathvariant = { + initial: { pathLength: 0, opacity: 0 }, + animate: { pathLength: 1, opacity: 1, transition: { duration: 1.5, yoyo: Infinity, ease: 'easeInOut' } } +} + export default function Logo() { return (
- -

URL MINIFY

+
) } + diff --git a/frontend/components/NavBar/index.js b/frontend/components/NavBar/index.js index 0257f1a..4756f49 100644 --- a/frontend/components/NavBar/index.js +++ b/frontend/components/NavBar/index.js @@ -1,4 +1,5 @@ import React, { useContext } from 'react' +import { motion } from 'framer-motion' import { Avatar, Box, @@ -49,8 +50,9 @@ function Index(props) { > - - URL MINIFY + + + UrlMiniFy - - + + GitHub - - + + CREDITS @@ -127,24 +129,33 @@ function Index(props) { color: 'white', display: 'flex', gap: '10px', - fontSize: 'h5.fontSize', - fontFamily: 'sans-serif', - fontStyle: 'bold', + fontSize: 'h6.fontSize', + fontFamily: "'Open Sans', sans-serif;", textTransform: 'capitalize', fontWeight: 'bold', }} + component={motion.div} + initial={{ y: -50, opacity: 0 }} + animate={{ y: 0, opacity: 1, transition: { delay: 1 } }} + whileHover={{ scale: 1.1, textShadow: '2px 2px black' }} > - + GitHub - +