diff --git a/src/components/Landing/LandingPart-1/index.tsx b/src/components/Landing/LandingPart-1/index.tsx index ea2f2d6..026db68 100644 --- a/src/components/Landing/LandingPart-1/index.tsx +++ b/src/components/Landing/LandingPart-1/index.tsx @@ -1,5 +1,4 @@ import React, { useCallback, useEffect, useRef, useState } from 'react'; -import BackToTop from '../../../images/BackToTop.gif'; import LoginModal from '../../Common/LoginModal'; import Modal from '../../Common/Modal'; @@ -12,6 +11,8 @@ import { ContentsWrapper, BackToTopButton, Dimed, + BackToTopButtonWrapper, + BackToTopIcon, } from './styles'; const LandingFirst = (): JSX.Element => { @@ -38,7 +39,7 @@ const LandingFirst = (): JSX.Element => { }} > - 100 ? `1` : `0`}`, color: `${ @@ -58,9 +59,11 @@ const LandingFirst = (): JSX.Element => { } }} > - + + +

맨위로

-
+ 토이 프로젝트의 에센셜 동료와 작업공간을 한 곳에서 만나보세요 diff --git a/src/components/Landing/LandingPart-1/styles.ts b/src/components/Landing/LandingPart-1/styles.ts index 88f5e43..526175f 100644 --- a/src/components/Landing/LandingPart-1/styles.ts +++ b/src/components/Landing/LandingPart-1/styles.ts @@ -1,4 +1,5 @@ import styled from 'styled-components'; +import { IoIosArrowUp } from 'react-icons/io'; export const LandingFirstContainer = styled.div` ${({ theme }) => theme.align.flexCenter}; @@ -65,8 +66,10 @@ export const FreeExpButton = styled.div` // ----------------TODO: 맨 위로 가기 버튼---------------- -export const BackToTopButton = styled.button` +export const BackToTopButtonWrapper = styled.div` cursor: pointer; + ${({ theme }) => theme.align.flexCenter}; + flex-direction: column; position: fixed; right: 2vw; bottom: 4vh; @@ -80,8 +83,20 @@ export const BackToTopButton = styled.button` } & > p { - margin-top: -8px; + margin-top: 2px; font-family: NanumSquareB; font-size: 14px; } `; + +export const BackToTopButton = styled.div` + ${({ theme }) => theme.align.flexCenter}; + padding: 4px; + color: white; + background-color: rgba(0, 0, 0, 0.3); + border-radius: 3px; +`; + +export const BackToTopIcon = styled(IoIosArrowUp)` + font-size: 20px; +`; diff --git a/src/images/BackToTop.gif b/src/images/BackToTop.gif deleted file mode 100644 index 89dffe6..0000000 Binary files a/src/images/BackToTop.gif and /dev/null differ