[WMS-200] feat: 유저 상세정보 페이지 로고 추가

[WMS-200] feat: 유저 상세정보 페이지 로고 추가

Author: moaangel

src/features/user/ui/detail/UserDetail.styles.ts

@@ -10,9 +10,20 @@ export const Container = styled.div`
   display: flex;
   flex-direction: column;
   gap: 16px;
-  position: relative;
 `;
 
+export const Logo = styled.div`
+  display: flex;
+  gap: 5px;
+  position: absolute;
+  top: 30px;
+  left: 50%;
+  transform: translate(-50%);
+  font-size: 24px;
+  font-weight: ${theme.fontWeight.bold};
+  color: ${theme.colors.primary};
+  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+`;
 export const ImageContainer = styled.div`
   display: flex;
   flex-direction: column;
@@ -86,8 +97,8 @@ export const TextContents = styled.div`
 
 export const ButtonContainer = styled.div`
   position: absolute;
-  bottom: 0;
-  right: 0;
+  bottom: 40px;
+  right: 30px;
   color: #3784ff;
   font-size: 0.8rem;
 `;

src/features/user/ui/detail/UserDetail.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useState } from 'react';
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
-import { ChevronLeft, ChevronRight } from 'lucide-react';
+import { BoxesIcon, ChevronLeft, ChevronRight } from 'lucide-react';
 import { queries } from 'entities/user/api/queries';
 import { userApi } from 'entities/user/api/userApi';
 import { UpdateRoleProps } from 'entities/user/model/types';
@@ -131,6 +131,10 @@ export const UserDetail = ({ userId }: UserDetailProps) => {
     <>
       {currentPage === 1 ? (
         <S.Container>
+          <S.Logo>
+            <BoxesIcon />
+            차곡차곡
+          </S.Logo>
           <S.ImageContainer>
             <S.ProfileImage></S.ProfileImage>
             <S.ImageWrapper>