diff --git a/pages/login/index.tsx b/pages/login/index.tsx
index 1def5f9..9e4cff0 100644
--- a/pages/login/index.tsx
+++ b/pages/login/index.tsx
@@ -1,28 +1,25 @@
-import { Box, Grid } from '@mui/material';
+import Image from 'next/image';
+import cloudImage from 'src/assets/images/cloud.png';
import LoginBox from 'src/components/User/LoginBox';
export default function LoginPage() {
return (
-
-
-
-
-
-
-
-
-
+
+
+
);
}
diff --git a/pages/register/index.tsx b/pages/register/index.tsx
index 7c32bd1..4b311f3 100644
--- a/pages/register/index.tsx
+++ b/pages/register/index.tsx
@@ -1,17 +1,25 @@
-import { Box } from '@mui/material';
-import TemperatureBox from 'src/components/MainLayout/InfoBox/Temperature';
+import Image from 'next/image';
+import cloudImage from 'src/assets/images/cloud.png';
import RegisterBox from 'src/components/User/RegisterBox';
export default function RegisterPage() {
return (
-
-
+
-
+
);
}
diff --git a/src/assets/images/cloud.png b/src/assets/images/cloud.png
new file mode 100644
index 0000000..9bb5a84
Binary files /dev/null and b/src/assets/images/cloud.png differ
diff --git a/src/assets/images/user.png b/src/assets/images/user.png
index c72985e..a5bb254 100644
Binary files a/src/assets/images/user.png and b/src/assets/images/user.png differ
diff --git a/src/components/MainLayout/InfoBox/Temperature.tsx b/src/components/MainLayout/InfoBox/Temperature.tsx
deleted file mode 100644
index d890f56..0000000
--- a/src/components/MainLayout/InfoBox/Temperature.tsx
+++ /dev/null
@@ -1,76 +0,0 @@
-import { Box, Tooltip, Typography } from '@mui/material';
-import lottie from 'lottie-web';
-import { useEffect, useRef, useState } from 'react';
-
-import weatherSky from '../../../assets/data/weatherSky';
-import { WeatherType } from '../../../utils/types';
-import useWeatherDataStore from '../../../utils/zustand/weather/WeatherDataStore';
-
-type WeatherProps = {
- weatherData: WeatherType | undefined;
-};
-
-const WeatherSkyLottie = ({ weatherData }: WeatherProps) => {
- // weatherData에 따라 다른 애니메이션 데이터를 선택
- const getAnimationData = () => {
- if (weatherData?.sky === 'SUNNY') {
- return require('../../../assets/lotties/weather/sunny.json');
- } else if (weatherData?.sky === 'CLOUDY') {
- return require('../../../assets/lotties/weather/cloudy.json');
- } else if (weatherData?.sky === 'OVERCAST') {
- return require('../../../assets/lotties/weather/rainy.json');
- } else if (weatherData?.sky === 'SNOWY') {
- return require('../../../assets/lotties/weather/snow.json');
- }
- // 기본값으로 사용할 애니메이션 데이터
- return require('../../../assets/lotties/weather/sunny.json');
- };
-
- const animationData = getAnimationData();
- // const animationData = require('../../assets/lotties/allRain.json');
-
- //lottie
- const element = useRef(null);
- useEffect(() => {
- const animation = lottie.loadAnimation({
- container: element.current as HTMLDivElement,
- renderer: 'svg',
- loop: true,
- autoplay: true,
- animationData: animationData,
- });
-
- return () => {
- animation.destroy(); // lottie-web 인스턴스 제거
- };
- }, [weatherData]);
- return (
-
-
-
- );
-};
-
-export default function TemperatureBox() {
- const { weatherData } = useWeatherDataStore();
-
- const [windChill, setWindChill] = useState(0);
-
- useEffect(() => {
- setWindChill(weatherData.windChill | 0);
- }, [weatherData]);
-
- return (
-
-
-
- {windChill} °C
-
-
- );
-}
diff --git a/src/components/User/InputBox.tsx b/src/components/User/InputBox.tsx
index 1e3ea3a..a55e2aa 100644
--- a/src/components/User/InputBox.tsx
+++ b/src/components/User/InputBox.tsx
@@ -14,8 +14,8 @@ export default function InputBox({ type, value, onChange, onKeyPress }: Props) {
sx={{
border: '1px solid #ccc',
borderRadius: '0.4rem',
- width: '73%',
- height: '2.5rem',
+ width: '65%',
+ height: '0.4rem',
display: 'flex',
alignItems: 'center',
padding: '1rem', // 내부 여백
diff --git a/src/components/User/LoginBox.tsx b/src/components/User/LoginBox.tsx
index 84fcc3b..8665344 100644
--- a/src/components/User/LoginBox.tsx
+++ b/src/components/User/LoginBox.tsx
@@ -1,11 +1,11 @@
-import { Box, Card } from '@mui/material';
+import { Card } from '@mui/material';
import Image from 'next/image';
import router from 'next/router';
import { useState } from 'react';
import useCheckAuth from 'src/api/hook/CheckAuthHook';
import { useLogin } from 'src/api/hook/UserHook';
-import logo from '../../assets/images/bang.png';
+import logoUrl from '../../../public/title-logo.png';
import InputBox from './InputBox';
import QuestionLink from './QuestionLink';
import SubmitButton from './SubmitButton';
@@ -56,19 +56,20 @@ export default function LoginBox() {
alignItems: 'center',
display: 'flex',
flexDirection: 'column',
+ zIndex: 1,
+ backgroundColor: 'rgba(255, 255, 255, 0.8)',
}}
>
-
-
-
-
- Fashion Cloud
-
+ />
+
- Fashion Cloud
-
-
},
{