diff --git a/apps/mobile/src/app/about/page.tsx b/apps/mobile/src/app/about/page.tsx index f251f55..86da0e9 100644 --- a/apps/mobile/src/app/about/page.tsx +++ b/apps/mobile/src/app/about/page.tsx @@ -3,12 +3,12 @@ import hyojun from '@/shared/assets/images/rankit_developer_HJKIM.jpg'; import seungjun from '@/shared/assets/images/rankit_developer_SJLEE.jpg'; import wooseok from '@/shared/assets/images/rankit_developer_WSPARK.jpg'; import ImsiImg from '@/shared/assets/svgs/imsiImg.svg'; -import Tier1 from '@/shared/assets/svgs/tier/sm/tier_1.svg'; -import Tier2 from '@/shared/assets/svgs/tier/sm/tier_2.svg'; -import Tier3 from '@/shared/assets/svgs/tier/sm/tier_3.svg'; -import Tier4 from '@/shared/assets/svgs/tier/sm/tier_4.svg'; -import Tier5 from '@/shared/assets/svgs/tier/sm/tier_5.svg'; -import Tier6 from '@/shared/assets/svgs/tier/sm/tier_6.svg'; +import Tier1 from '@/shared/assets/svgs/tier/default/tier_1.svg'; +import Tier2 from '@/shared/assets/svgs/tier/default/tier_2.svg'; +import Tier3 from '@/shared/assets/svgs/tier/default/tier_3.svg'; +import Tier4 from '@/shared/assets/svgs/tier/default/tier_4.svg'; +import Tier5 from '@/shared/assets/svgs/tier/default/tier_5.svg'; +import Tier6 from '@/shared/assets/svgs/tier/default/tier_6.svg'; import AboutDeveloper from './_components/aboutDeveloper/aboutDeveloper'; import { container, diff --git a/apps/mobile/src/app/user/[userId]/UserPage.css.ts b/apps/mobile/src/app/user/[userId]/UserPage.css.ts new file mode 100644 index 0000000..6b83d03 --- /dev/null +++ b/apps/mobile/src/app/user/[userId]/UserPage.css.ts @@ -0,0 +1,90 @@ +import { style } from '@vanilla-extract/css'; +import { globalTheme } from '../../../shared/styles/globalTheme.css'; + +export const flexColumnCenter = style({ + display: 'flex', + flexDirection: 'column', + alignItems: 'center', +}); + +export const containerStyle = style([ + flexColumnCenter, + { + width: '100%', + }, +]); + +export const divStyle = style({ + width: '39.3rem', +}); + +export const sharedDivStyle = style({ + display: 'flex', + flexDirection: 'column', + flexWrap: 'wrap', + + margin: '0 auto', + padding: '0 2.1rem', +}); + +export const topDivStyle = style({ + paddingTop: '4rem', + backgroundColor: globalTheme.colors.white, +}); + +export const buttonDivStyle = style({ + display: 'flex', + justifyContent: 'flex-end', + gap: '0.8rem', + marginTop: '8.8rem', + marginBottom: '8.8rem', +}); + +export const middleDivStyle = style({ + backgroundColor: globalTheme.colors.gray_bg_06, +}); + +export const middleContentDivStyle = style({ + display: 'flex', + flexWrap: 'wrap', + gap: '1.7rem', + marginTop: '10.4rem', + marginBottom: '8.8rem', +}); + +export const bottomDivStyle = style({ + minHeight: 669, + backgroundColor: globalTheme.colors.white, +}); + +export const bottomDivHeadingStyle = style({ + ...globalTheme.fonts.headBold24, + marginTop: '8.8rem', + color: globalTheme.colors.gray_19, +}); + +export const bottomDivRefreshButtonStyle = style({ + ...globalTheme.fonts.headerReg16, + color: globalTheme.colors.blue_33, + textAlign: 'end', +}); + +export const listStyle = style({ + display: 'flex', + flexWrap: 'wrap', + gap: '1.7rem', + justifyContent: 'space-between', + marginTop: '2rem', + marginBottom: '6.8rem', +}); + +export const flexColumn = style({ + display: 'flex', + flexDirection: 'column', +}); + +export const topSectionStyle = style({ + display: 'flex', + flexDirection: 'column', + gap: '4.4rem', +}); diff --git a/apps/mobile/src/app/user/[userId]/_components/SVGTier/SVGTier.tsx b/apps/mobile/src/app/user/[userId]/_components/SVGTier/SVGTier.tsx new file mode 100644 index 0000000..60fa7e6 --- /dev/null +++ b/apps/mobile/src/app/user/[userId]/_components/SVGTier/SVGTier.tsx @@ -0,0 +1,64 @@ +import { SVGAttributes, FC } from 'react'; +import Tier1DefaultIcon from '@/shared/assets/svgs/tier/default/tier_1.svg'; +import Tier2DefaultIcon from '@/shared/assets/svgs/tier/default/tier_2.svg'; +import Tier3DefaultIcon from '@/shared/assets/svgs/tier/default/tier_3.svg'; +import Tier4DefaultIcon from '@/shared/assets/svgs/tier/default/tier_4.svg'; +import Tier5DefaultIcon from '@/shared/assets/svgs/tier/default/tier_5.svg'; +import Tier6DefaultIcon from '@/shared/assets/svgs/tier/default/tier_6.svg'; +import Tier1LargeIcon from '@/shared/assets/svgs/tier/lg/tier_1.svg'; +import Tier2LargeIcon from '@/shared/assets/svgs/tier/lg/tier_2.svg'; +import Tier3LargeIcon from '@/shared/assets/svgs/tier/lg/tier_3.svg'; +import Tier4LargeIcon from '@/shared/assets/svgs/tier/lg/tier_4.svg'; +import Tier5LargeIcon from '@/shared/assets/svgs/tier/lg/tier_5.svg'; +import Tier6LargeIcon from '@/shared/assets/svgs/tier/lg/tier_6.svg'; +import Tier1SmallIcon from '@/shared/assets/svgs/tier/sm/tier_1.svg'; +import Tier2SmallIcon from '@/shared/assets/svgs/tier/sm/tier_2.svg'; +import Tier3SmallIcon from '@/shared/assets/svgs/tier/sm/tier_3.svg'; +import Tier4SmallIcon from '@/shared/assets/svgs/tier/sm/tier_4.svg'; +import Tier5SmallIcon from '@/shared/assets/svgs/tier/sm/tier_5.svg'; +import Tier6SmallIcon from '@/shared/assets/svgs/tier/sm/tier_6.svg'; + +interface SVGTierProps extends SVGAttributes { + size?: 'default' | 'sm' | 'lg'; + tier?: number; +} + +const defaultComponent: Record>> = { + 1: Tier1DefaultIcon, + 2: Tier2DefaultIcon, + 3: Tier3DefaultIcon, + 4: Tier4DefaultIcon, + 5: Tier5DefaultIcon, + 6: Tier6DefaultIcon, +}; + +const lgComponent: Record>> = { + 1: Tier1LargeIcon, + 2: Tier2LargeIcon, + 3: Tier3LargeIcon, + 4: Tier4LargeIcon, + 5: Tier5LargeIcon, + 6: Tier6LargeIcon, +}; + +const smComponent: Record>> = { + 1: Tier1SmallIcon, + 2: Tier2SmallIcon, + 3: Tier3SmallIcon, + 4: Tier4SmallIcon, + 5: Tier5SmallIcon, + 6: Tier6SmallIcon, +}; + +const SVGTier = ({ size = 'default', tier = 1, ...props }: SVGTierProps) => { + const TierComponent = + size === 'default' + ? defaultComponent[tier] + : size === 'lg' + ? lgComponent[tier] + : smComponent[tier]; + + return ; +}; + +export default SVGTier; diff --git a/apps/mobile/src/app/user/[userId]/_components/cardInfo/cardInfo.css.ts b/apps/mobile/src/app/user/[userId]/_components/cardInfo/cardInfo.css.ts new file mode 100644 index 0000000..235db01 --- /dev/null +++ b/apps/mobile/src/app/user/[userId]/_components/cardInfo/cardInfo.css.ts @@ -0,0 +1,32 @@ +import { style } from '@vanilla-extract/css'; +import { globalTheme } from '@/shared/styles/globalTheme.css'; + +export const containerStyle = style({ + display: 'flex', + justifyContent: 'center', + alignItems: 'center', + borderRadius: 8, + position: 'relative', + width: 167, + height: 145, + color: globalTheme.colors.gray_19, + backgroundColor: globalTheme.colors.gray_bg_04, +}); + +export const headingStyle = style({ + ...globalTheme.fonts.mobileDetailReg14, + position: 'absolute', + top: '1.6rem', + left: '1.6rem', +}); + +export const contentParagraphStyle = style({ + ...globalTheme.fonts.mobileTitleBold28, +}); + +export const subContentParagraphStyle = style({ + ...globalTheme.fonts.mobileDetailReg14, + position: 'absolute', + bottom: '1.6rem', + left: '1.6rem', +}); diff --git a/apps/mobile/src/app/user/[userId]/_components/cardInfo/cardInfo.tsx b/apps/mobile/src/app/user/[userId]/_components/cardInfo/cardInfo.tsx new file mode 100644 index 0000000..8d8cc85 --- /dev/null +++ b/apps/mobile/src/app/user/[userId]/_components/cardInfo/cardInfo.tsx @@ -0,0 +1,24 @@ +import { + containerStyle, + contentParagraphStyle, + headingStyle, + subContentParagraphStyle, +} from './cardInfo.css'; + +interface cardInfoProps { + title: string; + content: string; + subContent?: string; +} + +const CardInfo = ({ title, content, subContent }: cardInfoProps) => { + return ( +
+

{title}

+

{content}

+ {subContent &&

{subContent}

} +
+ ); +}; + +export default CardInfo; diff --git a/apps/mobile/src/app/user/[userId]/_components/cardProfile/cardProfile.css.ts b/apps/mobile/src/app/user/[userId]/_components/cardProfile/cardProfile.css.ts new file mode 100644 index 0000000..77ab20e --- /dev/null +++ b/apps/mobile/src/app/user/[userId]/_components/cardProfile/cardProfile.css.ts @@ -0,0 +1,53 @@ +import { style } from '@vanilla-extract/css'; +import { globalTheme } from '@/shared/styles/globalTheme.css'; + +export const containerStyle = style({ + border: `1px solid ${globalTheme.colors.gray_stroke}`, + borderRadius: 8, + width: '16.7rem', + overflow: 'hidden', +}); + +export const imageDivStyle = style({ + borderRadius: 8, + width: '16.7rem', + height: '16.7rem', +}); + +export const imageStyle = style({ + objectFit: 'cover', +}); + +export const contentDivStyle = style({ + paddingTop: '0.73rem', + paddingLeft: '1rem', + paddingRight: '1rem', +}); + +export const languageParagraphStyle = style({ + ...globalTheme.fonts.mobileDetailSemiBold14, + color: globalTheme.colors.blue_main, + marginBottom: '0.36rem', +}); + +export const titleDivStyle = style({ + ...globalTheme.fonts.mobileHeadSemiBold18, + display: 'flex', + alignItems: 'row', + gap: '0.3rem', +}); + +export const labelDivStyle = style({ + display: 'flex', + gap: '0.5em', +}); + +export const labelStyle = style({ + ...globalTheme.fonts.detailMed12, + marginTop: '1.0rem', + marginBottom: '1.36rem', + borderRadius: 4, + padding: '0.4rem 0.8rem', + color: globalTheme.colors.blue_66, + backgroundColor: globalTheme.colors.gray_bg_04, +}); diff --git a/apps/mobile/src/app/user/[userId]/_components/cardProfile/cardProfile.tsx b/apps/mobile/src/app/user/[userId]/_components/cardProfile/cardProfile.tsx new file mode 100644 index 0000000..90ffbe5 --- /dev/null +++ b/apps/mobile/src/app/user/[userId]/_components/cardProfile/cardProfile.tsx @@ -0,0 +1,59 @@ +import Image from 'next/image'; +import SVGTier from '../SVGTier/SVGTier'; +import { + containerStyle, + contentDivStyle, + imageDivStyle, + labelDivStyle, + labelStyle, + languageParagraphStyle, + titleDivStyle, +} from './cardProfile.css'; + +interface CardProfileProps { + profileSrc?: string; + language: string; + tier: number; + userName: string; + school: string; + region: string; +} + +const CardProfile = ({ + profileSrc = 'https://avatars.githubusercontent.com/u/127329855?v=4', + language, + tier, + userName, + school, + region, +}: CardProfileProps) => { + return ( +
+
+ {`${userName} +
+ +
+

{language}

+ +
+ +

{userName}

+
+ +
+ {school} + {region} +
+
+
+ ); +}; + +export default CardProfile; diff --git a/apps/mobile/src/app/user/[userId]/_components/introduction/introduction.css.ts b/apps/mobile/src/app/user/[userId]/_components/introduction/introduction.css.ts new file mode 100644 index 0000000..4e18bb1 --- /dev/null +++ b/apps/mobile/src/app/user/[userId]/_components/introduction/introduction.css.ts @@ -0,0 +1,32 @@ +import { style } from '@vanilla-extract/css'; +import { globalTheme } from '@/shared/styles/globalTheme.css'; + +export const headingTitleStyle = style({ + ...globalTheme.fonts.headBold36, + color: globalTheme.colors.gray_19, + width: '100%', + whiteSpace: 'normal', +}); + +export const headingSubTitleStyle = style({ + ...globalTheme.fonts.mobileTitleSemiBold20, + color: globalTheme.colors.gray_19, +}); + +export const paragraphContentStyle = style({ + ...globalTheme.fonts.mobileBodyReg16, + color: globalTheme.colors.blue_33, +}); + +export const contentDivStyle = style({ + display: 'flex', + flexDirection: 'column', + gap: '4.8rem', + marginTop: '4.3rem', +}); + +export const contentStyle = style({ + display: 'flex', + flexDirection: 'column', + gap: '1.6rem', +}); diff --git a/apps/mobile/src/app/user/[userId]/_components/introduction/introduction.tsx b/apps/mobile/src/app/user/[userId]/_components/introduction/introduction.tsx new file mode 100644 index 0000000..41d3bb5 --- /dev/null +++ b/apps/mobile/src/app/user/[userId]/_components/introduction/introduction.tsx @@ -0,0 +1,42 @@ +import { + headingTitleStyle, + headingSubTitleStyle, + paragraphContentStyle, + contentDivStyle, + contentStyle, +} from './introduction.css'; + +const Introduction = () => { + return ( +
+

+ {'//수정 버튼을 눌러 자기소개를 수정해주세요'} +

+ +
+
+

{'{jamooooong}의 한줄 소개'}

+

+ {'//수정 버튼을 눌러 자기소개를 수정해주세요.'} +

+
+ +
+

저는 이런거를 잘해요.

+

+ {'//수정 버튼을 눌러 자기소개를 수정해주세요.'} +

+
+ +
+

저는 이런걸 배우고 싶어요.

+

+ {'//수정 버튼을 눌러 자기소개를 수정해주세요.'} +

+
+
+
+ ); +}; + +export default Introduction; diff --git a/apps/mobile/src/app/user/[userId]/_components/profile/_components/buttonGithub/buttonGithub.css.ts b/apps/mobile/src/app/user/[userId]/_components/profile/_components/buttonGithub/buttonGithub.css.ts new file mode 100644 index 0000000..f902da6 --- /dev/null +++ b/apps/mobile/src/app/user/[userId]/_components/profile/_components/buttonGithub/buttonGithub.css.ts @@ -0,0 +1,13 @@ +import { style } from '@vanilla-extract/css'; +import { globalTheme } from '../../../../../../../shared/styles/globalTheme.css'; + +export const buttonStyle = style({ + display: 'flex', + alignItems: 'center', + gap: '0.8rem', +}); + +export const paragraphGithubStyle = style({ + ...globalTheme.fonts.bodyReg16, + color: globalTheme.colors.gray_71, +}); diff --git a/apps/mobile/src/app/user/[userId]/_components/profile/_components/buttonGithub/buttonGithub.tsx b/apps/mobile/src/app/user/[userId]/_components/profile/_components/buttonGithub/buttonGithub.tsx new file mode 100644 index 0000000..b6c5e8e --- /dev/null +++ b/apps/mobile/src/app/user/[userId]/_components/profile/_components/buttonGithub/buttonGithub.tsx @@ -0,0 +1,13 @@ +import GithubIcon from '@/shared/assets/svgs/github_btn.svg'; +import { buttonStyle, paragraphGithubStyle } from './buttonGithub.css'; + +const ButtonGithub = () => { + return ( + + ); +}; + +export default ButtonGithub; diff --git a/apps/mobile/src/app/user/[userId]/_components/profile/profile.css.ts b/apps/mobile/src/app/user/[userId]/_components/profile/profile.css.ts new file mode 100644 index 0000000..e5e01c0 --- /dev/null +++ b/apps/mobile/src/app/user/[userId]/_components/profile/profile.css.ts @@ -0,0 +1,44 @@ +import { style } from '@vanilla-extract/css'; +import { globalTheme } from '@/shared/styles/globalTheme.css'; + +export const containerStyle = style({ + display: 'flex', + flexDirection: 'row', +}); + +export const paragraphLanguageStyle = style({ + ...globalTheme.fonts.mobileBodyMed16, + color: globalTheme.colors.blue_main, +}); + +export const headingNameStyle = style({ + ...globalTheme.fonts.mobileTitleBold28, + color: globalTheme.colors.gray_19, + marginTop: '0.7rem', + marginBottom: '1.2rem', +}); + +export const divStyle = style({ + display: 'flex', + flexDirection: 'column', + marginTop: '0.5rem', + marginLeft: '1.2rem', +}); + +export const nameDivStyle = style({ + display: 'flex', + marginTop: '0.7rem', + marginBottom: '1.2rem', +}); + +export const profileImgDivStyle = style({ + position: 'relative', + display: 'flex', + flexDirection: 'row', +}); + +export const tierImgStyle = style({ + position: 'absolute', + top: '8.8rem', + left: '8.8rem', +}); diff --git a/apps/mobile/src/app/user/[userId]/_components/profile/profile.tsx b/apps/mobile/src/app/user/[userId]/_components/profile/profile.tsx new file mode 100644 index 0000000..ab3b0c0 --- /dev/null +++ b/apps/mobile/src/app/user/[userId]/_components/profile/profile.tsx @@ -0,0 +1,31 @@ +import CircleImage from '@/shared/components/circleImage/circleImage'; +import SVGTier from '../SVGTier/SVGTier'; +import ButtonGithub from './_components/buttonGithub/buttonGithub'; +import { + paragraphLanguageStyle, + headingNameStyle, + divStyle, + nameDivStyle, + containerStyle, + profileImgDivStyle, + tierImgStyle, +} from './profile.css'; + +const Profile = () => { + return ( +
+
+ + +
+ +
+

javascript

+

jamooong

+ +
+
+ ); +}; + +export default Profile; diff --git a/apps/mobile/src/app/user/[userId]/_components/progressBar/progressBar.css.ts b/apps/mobile/src/app/user/[userId]/_components/progressBar/progressBar.css.ts new file mode 100644 index 0000000..a07ac33 --- /dev/null +++ b/apps/mobile/src/app/user/[userId]/_components/progressBar/progressBar.css.ts @@ -0,0 +1,75 @@ +import { style, createVar, keyframes } from '@vanilla-extract/css'; +import { globalTheme } from '@/shared/styles/globalTheme.css'; + +const widthVar = createVar(); + +export const vars = { + widthVar, +}; + +const expandWidth = keyframes({ + '0%': { + transform: 'scaleX(0)', + }, + '100%': { + transform: 'scaleX(1)', + }, +}); + +export const outsideStyle = style({ + marginTop: '12rem', + borderRadius: 8, + position: 'relative', + width: '100%', + height: '2.4rem', + backgroundColor: globalTheme.colors.gray_bg_04, +}); + +export const insideStyle = style({ + position: 'absolute', + zIndex: 1, + top: 0, + left: 0, + borderRadius: 8, + width: widthVar, + height: '2.4rem', + backgroundColor: globalTheme.colors.blue_main, + transformOrigin: 'left', + animation: `${expandWidth} 0.5s ease-in-out`, +}); + +export const currentTierStyle = style({ + position: 'absolute', + top: '-3.2rem', +}); + +export const nextTierStyle = style({ + position: 'absolute', + top: '-3.2rem', + right: 0, +}); + +export const currentTierDivStyle = style({ + ...globalTheme.fonts.bodySemiBold16, + display: 'flex', + gap: '0.8rem', + position: 'absolute', + top: '2.8rem', + left: 0, + color: globalTheme.colors.gray_19, +}); + +export const spanStyle = style({ + ...globalTheme.fonts.detailMed14, + color: globalTheme.colors.blue_66, +}); + +export const nextTierDivStyle = style({ + ...globalTheme.fonts.detailMed14, + display: 'flex', + gap: '0.8rem', + position: 'absolute', + top: '2.8rem', + right: 0, + color: globalTheme.colors.blue_66, +}); diff --git a/apps/mobile/src/app/user/[userId]/_components/progressBar/progressBar.tsx b/apps/mobile/src/app/user/[userId]/_components/progressBar/progressBar.tsx new file mode 100644 index 0000000..3e761ba --- /dev/null +++ b/apps/mobile/src/app/user/[userId]/_components/progressBar/progressBar.tsx @@ -0,0 +1,48 @@ +import { assignInlineVars } from '@vanilla-extract/dynamic'; +import SVGTier from '../SVGTier/SVGTier'; +import { + outsideStyle, + insideStyle, + currentTierStyle, + nextTierStyle, + currentTierDivStyle, + nextTierDivStyle, + vars, + spanStyle, +} from './progressBar.css'; + +interface ProgressBarProps { + width: number; + currentTier: number; + nextTier: number; +} + +const ProgressBar = ({ width, currentTier, nextTier }: ProgressBarProps) => { + const dynamicWidth = `${width}%`; + + return ( +
+
+ + + + +
+

{`level ${1}`}

+ 5,000 +
+ +
+

{`level ${2} 까지`}

+

-3,000

+
+
+ ); +}; + +export default ProgressBar; diff --git a/apps/mobile/src/app/user/[userId]/page.tsx b/apps/mobile/src/app/user/[userId]/page.tsx index e69de29..c10a886 100644 --- a/apps/mobile/src/app/user/[userId]/page.tsx +++ b/apps/mobile/src/app/user/[userId]/page.tsx @@ -0,0 +1,115 @@ +import Button from '@/shared/components/button/button'; +import { + bottomDivHeadingStyle, + bottomDivRefreshButtonStyle, + bottomDivStyle, + buttonDivStyle, + containerStyle, + divStyle, + listStyle, + middleContentDivStyle, + middleDivStyle, + sharedDivStyle, + topDivStyle, + topSectionStyle, +} from './UserPage.css'; +import CardInfo from './_components/cardInfo/cardInfo'; +import CardProfile from './_components/cardProfile/cardProfile'; +import Introduction from './_components/introduction/introduction'; +import Profile from './_components/profile/profile'; +import ProgressBar from './_components/progressBar/progressBar'; + +//임시 목데이터 +const cardProfileData = [ + { + imageSrc: 'https://avatars.githubusercontent.com/u/48755175?v=4', + language: 'javascript', + tier: 1, + userName: 'suwonthugger1', + school: '광운대학교', + region: '경기도', + }, + { + imageSrc: 'https://avatars.githubusercontent.com/u/48755175?v=4', + language: 'javascript', + tier: 2, + userName: 'suwonthugger2', + school: '광운대학교', + region: '경기도', + }, + { + imageSrc: 'https://avatars.githubusercontent.com/u/48755175?v=4', + language: 'javascript', + tier: 1, + userName: 'suwonthugger3', + school: '광운대학교', + region: '경기도', + }, + { + imageSrc: 'https://avatars.githubusercontent.com/u/48755175?v=4', + language: 'javascript', + tier: 1, + userName: 'suwonthugger4', + school: '광운대학교', + region: '경기도', + }, +]; + +const UserPage = () => { + return ( +
+
+
+
+
+ + +
+ +
+ + +
+
+
+ +
+
+ + +
+ + + + +
+
+
+ +
+
+

추천친구

+ + + +
    + {cardProfileData.map((data) => ( +
  • + +
    • + ))} +
+
+
+
+
+ ); +}; + +export default UserPage; diff --git a/apps/mobile/src/app/user/userSetting/main-setting/page.tsx b/apps/mobile/src/app/user/userSetting/main-setting/page.tsx index 5ef993f..3bf458a 100644 --- a/apps/mobile/src/app/user/userSetting/main-setting/page.tsx +++ b/apps/mobile/src/app/user/userSetting/main-setting/page.tsx @@ -50,7 +50,7 @@ const MainSetting = ({ userSchool, userRegion }: MainSettingProps) => { 소속학교 == {userSchool || '학교 없음'}

- +

@@ -63,7 +63,7 @@ const MainSetting = ({ userSchool, userRegion }: MainSettingProps) => { 소속지역 == {userRegion || '지역 없음'}

- +

소속지역를 변경할 수 있습니다.

diff --git a/apps/mobile/src/shared/assets/svgs/github_btn.svg b/apps/mobile/src/shared/assets/svgs/github_btn.svg new file mode 100644 index 0000000..12171fe --- /dev/null +++ b/apps/mobile/src/shared/assets/svgs/github_btn.svg @@ -0,0 +1,3 @@ + + + diff --git a/apps/mobile/src/shared/assets/svgs/tier/Lg/tier_1.svg b/apps/mobile/src/shared/assets/svgs/tier/Lg/tier_1.svg new file mode 100644 index 0000000..832e7e9 --- /dev/null +++ b/apps/mobile/src/shared/assets/svgs/tier/Lg/tier_1.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/apps/mobile/src/shared/assets/svgs/tier/Lg/tier_2.svg b/apps/mobile/src/shared/assets/svgs/tier/Lg/tier_2.svg new file mode 100644 index 0000000..e61cf7d --- /dev/null +++ b/apps/mobile/src/shared/assets/svgs/tier/Lg/tier_2.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/apps/mobile/src/shared/assets/svgs/tier/Lg/tier_3.svg b/apps/mobile/src/shared/assets/svgs/tier/Lg/tier_3.svg new file mode 100644 index 0000000..26664cb --- /dev/null +++ b/apps/mobile/src/shared/assets/svgs/tier/Lg/tier_3.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/apps/mobile/src/shared/assets/svgs/tier/Lg/tier_4.svg b/apps/mobile/src/shared/assets/svgs/tier/Lg/tier_4.svg new file mode 100644 index 0000000..8021657 --- /dev/null +++ b/apps/mobile/src/shared/assets/svgs/tier/Lg/tier_4.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/apps/mobile/src/shared/assets/svgs/tier/Lg/tier_5.svg b/apps/mobile/src/shared/assets/svgs/tier/Lg/tier_5.svg new file mode 100644 index 0000000..33db83e --- /dev/null +++ b/apps/mobile/src/shared/assets/svgs/tier/Lg/tier_5.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/apps/mobile/src/shared/assets/svgs/tier/Lg/tier_6.svg b/apps/mobile/src/shared/assets/svgs/tier/Lg/tier_6.svg new file mode 100644 index 0000000..b6d21ed --- /dev/null +++ b/apps/mobile/src/shared/assets/svgs/tier/Lg/tier_6.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/apps/mobile/src/shared/assets/svgs/tier/default/tier_1.svg b/apps/mobile/src/shared/assets/svgs/tier/default/tier_1.svg index 69a8b14..961c3e1 100644 --- a/apps/mobile/src/shared/assets/svgs/tier/default/tier_1.svg +++ b/apps/mobile/src/shared/assets/svgs/tier/default/tier_1.svg @@ -1,4 +1,4 @@ - + diff --git a/apps/mobile/src/shared/assets/svgs/tier/default/tier_2.svg b/apps/mobile/src/shared/assets/svgs/tier/default/tier_2.svg index be78a49..acc35f9 100644 --- a/apps/mobile/src/shared/assets/svgs/tier/default/tier_2.svg +++ b/apps/mobile/src/shared/assets/svgs/tier/default/tier_2.svg @@ -1,4 +1,4 @@ - + diff --git a/apps/mobile/src/shared/assets/svgs/tier/default/tier_3.svg b/apps/mobile/src/shared/assets/svgs/tier/default/tier_3.svg index 2e34fdf..fdb154f 100644 --- a/apps/mobile/src/shared/assets/svgs/tier/default/tier_3.svg +++ b/apps/mobile/src/shared/assets/svgs/tier/default/tier_3.svg @@ -1,4 +1,4 @@ - + diff --git a/apps/mobile/src/shared/assets/svgs/tier/default/tier_4.svg b/apps/mobile/src/shared/assets/svgs/tier/default/tier_4.svg index a009b15..1230271 100644 --- a/apps/mobile/src/shared/assets/svgs/tier/default/tier_4.svg +++ b/apps/mobile/src/shared/assets/svgs/tier/default/tier_4.svg @@ -1,4 +1,4 @@ - + diff --git a/apps/mobile/src/shared/assets/svgs/tier/default/tier_5.svg b/apps/mobile/src/shared/assets/svgs/tier/default/tier_5.svg index 8f1fc98..106b650 100644 --- a/apps/mobile/src/shared/assets/svgs/tier/default/tier_5.svg +++ b/apps/mobile/src/shared/assets/svgs/tier/default/tier_5.svg @@ -1,4 +1,4 @@ - + diff --git a/apps/mobile/src/shared/assets/svgs/tier/default/tier_6.svg b/apps/mobile/src/shared/assets/svgs/tier/default/tier_6.svg index 35f037e..b08693a 100644 --- a/apps/mobile/src/shared/assets/svgs/tier/default/tier_6.svg +++ b/apps/mobile/src/shared/assets/svgs/tier/default/tier_6.svg @@ -1,4 +1,4 @@ - + diff --git a/apps/mobile/src/shared/assets/svgs/tier/sm/tier_1.svg b/apps/mobile/src/shared/assets/svgs/tier/sm/tier_1.svg index 5e4e07d..61a59bf 100644 --- a/apps/mobile/src/shared/assets/svgs/tier/sm/tier_1.svg +++ b/apps/mobile/src/shared/assets/svgs/tier/sm/tier_1.svg @@ -1,4 +1,4 @@ - + diff --git a/apps/mobile/src/shared/assets/svgs/tier/sm/tier_2.svg b/apps/mobile/src/shared/assets/svgs/tier/sm/tier_2.svg index baff4e5..313a094 100644 --- a/apps/mobile/src/shared/assets/svgs/tier/sm/tier_2.svg +++ b/apps/mobile/src/shared/assets/svgs/tier/sm/tier_2.svg @@ -1,4 +1,4 @@ - + diff --git a/apps/mobile/src/shared/assets/svgs/tier/sm/tier_3.svg b/apps/mobile/src/shared/assets/svgs/tier/sm/tier_3.svg index c0acea8..50a728a 100644 --- a/apps/mobile/src/shared/assets/svgs/tier/sm/tier_3.svg +++ b/apps/mobile/src/shared/assets/svgs/tier/sm/tier_3.svg @@ -1,4 +1,4 @@ - + diff --git a/apps/mobile/src/shared/assets/svgs/tier/sm/tier_4.svg b/apps/mobile/src/shared/assets/svgs/tier/sm/tier_4.svg index aa75687..0025725 100644 --- a/apps/mobile/src/shared/assets/svgs/tier/sm/tier_4.svg +++ b/apps/mobile/src/shared/assets/svgs/tier/sm/tier_4.svg @@ -1,4 +1,4 @@ - + diff --git a/apps/mobile/src/shared/assets/svgs/tier/sm/tier_5.svg b/apps/mobile/src/shared/assets/svgs/tier/sm/tier_5.svg index 8e40690..6c93e0e 100644 --- a/apps/mobile/src/shared/assets/svgs/tier/sm/tier_5.svg +++ b/apps/mobile/src/shared/assets/svgs/tier/sm/tier_5.svg @@ -1,4 +1,4 @@ - + diff --git a/apps/mobile/src/shared/assets/svgs/tier/sm/tier_6.svg b/apps/mobile/src/shared/assets/svgs/tier/sm/tier_6.svg index d073f02..d73ef30 100644 --- a/apps/mobile/src/shared/assets/svgs/tier/sm/tier_6.svg +++ b/apps/mobile/src/shared/assets/svgs/tier/sm/tier_6.svg @@ -1,4 +1,4 @@ - + diff --git a/apps/mobile/src/shared/components/button/button.css.ts b/apps/mobile/src/shared/components/button/button.css.ts index e63d3ab..2c6e00b 100644 --- a/apps/mobile/src/shared/components/button/button.css.ts +++ b/apps/mobile/src/shared/components/button/button.css.ts @@ -7,7 +7,7 @@ const paragraphCommonStyle = style({ export const paragraphStyle = styleVariants({ lg: [paragraphCommonStyle, { height: '2.4rem' }], - sm: [paragraphCommonStyle, { height: '2rem' }], + sm: [{ height: '2rem' }], }); export const commonButtonStyle = style({ diff --git a/apps/mobile/src/shared/components/button/button.tsx b/apps/mobile/src/shared/components/button/button.tsx index 820a820..e77b32f 100644 --- a/apps/mobile/src/shared/components/button/button.tsx +++ b/apps/mobile/src/shared/components/button/button.tsx @@ -4,7 +4,6 @@ import { buttonStyle, colorVariant, paragraphStyle } from './button.css'; interface ButtonProps extends ButtonHTMLAttributes { variant?: 'primary' | 'secondary'; size?: 'lg' | 'sm'; - color?: 'primary' | 'secondary'; } const Button = ({