Merge pull request #84 from oodd-team/feat/OD-132

[OD-132] profileEdit UI 수정

Author: gustn99

src/pages/AccountCancel/index.tsx

@@ -11,6 +11,7 @@ import back from '../../assets/arrow/left.svg';
 import BottomButton from '../../components/BottomButton';
 import { patchUserWithdrawApi } from '../../apis/user';
 
+
 const AccountCancel: React.FC = () => {
 	const [isChecked, setIsChecked] = useState(false);
 	const navigate = useNavigate();

src/pages/AccountSetting/index.tsx

@@ -25,7 +25,7 @@ const AccountSetting: React.FC = () => {
 	useEffect(() => {
 		const getUserInfo = async () => {
 			try {
-				const storedUserId = localStorage.getItem('my_id');
+				const storedUserId = Number(localStorage.getItem('my_id'));
 				if (!storedUserId) {
 					console.error('User is not logged in');
 					return;

src/pages/MyPage/index.tsx

@@ -78,7 +78,7 @@ const MyPage: React.FC = () => {
     // 사용자 정보 조회 API
     const fetchUserInfo = async () => {
         try {
-            const storedUserId = localStorage.getItem('my_id');
+            const storedUserId = Number(localStorage.getItem('my_id'));
             if (!storedUserId) {
                 console.error('User ID not found in localStorage');
                 return;
@@ -94,7 +94,7 @@ const MyPage: React.FC = () => {
     // 게시물 리스트 조회 API
     const fetchPostList = async () => {
         try {
-            const storedUserId = localStorage.getItem('my_id'); 
+            const storedUserId = Number(localStorage.getItem('my_id'));
             if (!storedUserId) {
                 console.error('User ID not found in localStorage');
                 return;

src/pages/ProfileEdit/index.tsx

@@ -10,6 +10,7 @@ import {
 	CameraIcon,
 	UserInfo,
 	Username,
+	EmailInput
 } from './styles';
 import { StyledText } from '../../components/Text/StyledText';
 import theme from '../../styles/theme';
@@ -51,7 +52,7 @@ const ProfileEdit: React.FC = () => {
 	useEffect(() => {
 		const getUserInfo = async () => {
 			try {
-				const storedUserId = localStorage.getItem('my_id'); // 사용자 ID 가져오기
+				const storedUserId = Number(localStorage.getItem('my_id'));
 				if (!storedUserId) {
 					console.error('User ID not found in localStorage');
 					return;
@@ -216,7 +217,7 @@ const ProfileEdit: React.FC = () => {
 					<StyledText $textTheme={{ style: 'body2-regular', lineHeight: 0 }} color={theme.colors.gray3}>
 						이메일
 					</StyledText>
-					<Input type="email" value={email} onChange={(e) => setEmail(e.target.value)} />
+					<EmailInput type="email" value={email} onChange={(e) => setEmail(e.target.value)} />
 				</Row>
 				<BottomButton content="완료" onClick={handleSave} />
 			</ProfileEditContainer>

src/pages/ProfileEdit/styles.tsx

@@ -80,6 +80,17 @@ export const Row = styled.div`
 	}
 `;
 
+export const EmailInput = styled.input`
+  margin-bottom: 120px;
+	width: 100%; /* Row의 padding에 맞춰 꽉 채우기 */
+	padding: 25px; /* 10px padding */
+	border: 0px;
+	box-sizing: border-box;
+	border-radius: 10px;
+	background-color: #f0f0f0; /* 박스 내부 회색 배경 */
+	text-align: left;
+`;
+
 export const FileInput = styled.input`
 	display: none;
 `;