diff --git a/src/entities/projects/ui/profile-page-projects-card/ProjectCard.tsx b/src/entities/projects/ui/profile-page-projects-card/ProjectCard.tsx
index 00f0704..3a12db9 100644
--- a/src/entities/projects/ui/profile-page-projects-card/ProjectCard.tsx
+++ b/src/entities/projects/ui/profile-page-projects-card/ProjectCard.tsx
@@ -163,7 +163,7 @@ const ProjectCard = ({
- 온라인
+ {project.workflow}
diff --git a/src/entities/projects/ui/project-insert/ProjectDetailDescriptionCard.tsx b/src/entities/projects/ui/project-insert/ProjectDetailDescriptionCard.tsx
index a54bd29..866f9cf 100644
--- a/src/entities/projects/ui/project-insert/ProjectDetailDescriptionCard.tsx
+++ b/src/entities/projects/ui/project-insert/ProjectDetailDescriptionCard.tsx
@@ -1,4 +1,5 @@
import { TextField } from "@mui/material";
+import { useMediaQuery } from "@mui/material";
import { useTheme } from "@mui/material/styles";
import type { ChangeEvent, CSSProperties, JSX } from "react";
@@ -18,6 +19,7 @@ const ProjectDetailDescriptionCard = ({
style,
}: ProjectDetailDescriptionCardProps): JSX.Element => {
const theme = useTheme();
+ const isMobile = useMediaQuery(theme.breakpoints.down("md"));
const handleChange = (e: ChangeEvent): void => {
onChange(e.target.value);
@@ -52,9 +54,11 @@ AI 기술을 활용하여 개인별 학습 패턴을 분석하고, 최적화된
variant="outlined"
sx={{
"& .MuiOutlinedInput-root": {
- fontSize: large
- ? theme.typography.h5.fontSize
- : theme.typography.body1.fontSize,
+ fontSize: isMobile
+ ? theme.typography.body2.fontSize
+ : large
+ ? theme.typography.h5.fontSize
+ : theme.typography.body1.fontSize,
fontFamily: "monospace",
lineHeight: 1.6,
padding: 0,
diff --git a/src/entities/projects/ui/project-insert/ProjectPreferentialCard.tsx b/src/entities/projects/ui/project-insert/ProjectPreferentialCard.tsx
index 4ad5d2f..b82b744 100644
--- a/src/entities/projects/ui/project-insert/ProjectPreferentialCard.tsx
+++ b/src/entities/projects/ui/project-insert/ProjectPreferentialCard.tsx
@@ -1,5 +1,6 @@
import AddIcon from "@mui/icons-material/Add";
import { Box, Button } from "@mui/material";
+import { useMediaQuery } from "@mui/material";
import { useTheme } from "@mui/material/styles";
import type {
ChangeEvent,
@@ -27,6 +28,7 @@ const ProjectPreferentialCard = ({
style,
}: ProjectPreferentialCardProps): JSX.Element => {
const theme = useTheme();
+ const isMobile = useMediaQuery(theme.breakpoints.down("md"));
const [newPreferential, setNewPreferential] = useState("");
const addPreferential = (): void => {
@@ -70,9 +72,11 @@ const ProjectPreferentialCard = ({
height: 40,
borderRadius: theme.shape.borderRadius,
border: `1px solid ${theme.palette.divider}`,
- fontSize: large
- ? theme.typography.h5.fontSize
- : theme.typography.body1.fontSize,
+ fontSize: isMobile
+ ? theme.typography.body2.fontSize
+ : large
+ ? theme.typography.h5.fontSize
+ : theme.typography.body1.fontSize,
fontFamily: theme.typography.fontFamily,
background: theme.palette.background.paper,
padding: large ? theme.spacing(2.2) : theme.spacing(1.7),
diff --git a/src/entities/projects/ui/project-insert/ProjectRequirementsCard.tsx b/src/entities/projects/ui/project-insert/ProjectRequirementsCard.tsx
index 302f4be..18850c3 100644
--- a/src/entities/projects/ui/project-insert/ProjectRequirementsCard.tsx
+++ b/src/entities/projects/ui/project-insert/ProjectRequirementsCard.tsx
@@ -1,6 +1,7 @@
import AddIcon from "@mui/icons-material/Add";
import DeleteIcon from "@mui/icons-material/Delete";
import { Box, IconButton, TextField, Button } from "@mui/material";
+import { useMediaQuery } from "@mui/material";
import { useTheme } from "@mui/material/styles";
import type { ChangeEvent, CSSProperties, JSX } from "react";
@@ -20,6 +21,7 @@ const ProjectRequirementsCard = ({
style,
}: ProjectRequirementsCardProps): JSX.Element => {
const theme = useTheme();
+ const isMobile = useMediaQuery(theme.breakpoints.down("md"));
const displayValue = value;
@@ -72,9 +74,11 @@ const ProjectRequirementsCard = ({
sx={{
"& .MuiOutlinedInput-root": {
height: 40,
- fontSize: large
- ? theme.typography.h5.fontSize
- : theme.typography.body1.fontSize,
+ fontSize: isMobile
+ ? theme.typography.body2.fontSize
+ : large
+ ? theme.typography.h5.fontSize
+ : theme.typography.body1.fontSize,
fontFamily: theme.typography.fontFamily,
background: "none",
border: "none",
diff --git a/src/entities/projects/ui/project-insert/ProjectSimpleDescCard.tsx b/src/entities/projects/ui/project-insert/ProjectSimpleDescCard.tsx
index f4fe40d..49441cd 100644
--- a/src/entities/projects/ui/project-insert/ProjectSimpleDescCard.tsx
+++ b/src/entities/projects/ui/project-insert/ProjectSimpleDescCard.tsx
@@ -51,9 +51,15 @@ const ProjectSimpleDescCard = ({
},
},
"& .MuiOutlinedInput-input": {
- padding: large ? 5 : 5,
- fontSize: 16,
- color: "#222",
+ padding: large ? theme.spacing(2.2) : theme.spacing(1.7),
+ "&::placeholder": {
+ fontSize: {
+ xs: "14px",
+ sm: "15px",
+ md: "16px",
+ },
+ color: "#999",
+ },
},
}}
required
diff --git a/src/entities/projects/ui/project-insert/ProjectWorkflowCard.tsx b/src/entities/projects/ui/project-insert/ProjectWorkflowCard.tsx
index 72a1285..d6a6321 100644
--- a/src/entities/projects/ui/project-insert/ProjectWorkflowCard.tsx
+++ b/src/entities/projects/ui/project-insert/ProjectWorkflowCard.tsx
@@ -1,5 +1,6 @@
-import { FormControl, Select, MenuItem } from "@mui/material";
import type { SelectChangeEvent } from "@mui/material";
+import { FormControl, Select, MenuItem } from "@mui/material";
+import { useMediaQuery } from "@mui/material";
import { useTheme } from "@mui/material/styles";
import type { CSSProperties, JSX } from "react";
@@ -43,6 +44,7 @@ export default function ProjectWorkflowCard({
style,
}: ProjectWorkflowCardProps): JSX.Element {
const theme = useTheme();
+ const isMobile = useMediaQuery(theme.breakpoints.down("md"));
const handleChange = (event: SelectChangeEvent): void => {
onChange(event.target.value as Workflow);
@@ -62,9 +64,11 @@ export default function ProjectWorkflowCard({
size={large ? "medium" : "small"}
displayEmpty
sx={{
- fontSize: large
- ? theme.typography.h5.fontSize
- : theme.typography.body1.fontSize,
+ fontSize: isMobile
+ ? theme.typography.body2.fontSize
+ : large
+ ? theme.typography.h5.fontSize
+ : theme.typography.body1.fontSize,
fontFamily: theme.typography.fontFamily,
padding: large ? theme.spacing(2.2) : theme.spacing(1.7),
diff --git a/src/features/email/ui/EmailModal.tsx b/src/features/email/ui/EmailModal.tsx
index 6df88de..caa8cf9 100644
--- a/src/features/email/ui/EmailModal.tsx
+++ b/src/features/email/ui/EmailModal.tsx
@@ -1,10 +1,10 @@
import {
+ Box,
+ Button,
Dialog,
- DialogTitle,
- DialogContent,
DialogActions,
- Button,
- Box,
+ DialogContent,
+ DialogTitle,
Typography,
} from "@mui/material";
import { styled } from "@mui/material/styles";
@@ -79,7 +79,7 @@ const EmailModal = ({
export default EmailModal;
const StyledDialog = styled(Dialog)({
- zIndex: 9999,
+ zIndex: 8000,
"& .MuiDialog-paper": {
width: "600px",
maxWidth: "90vw",
diff --git a/src/pages/project-insert/ui/ProjectInsertPage.tsx b/src/pages/project-insert/ui/ProjectInsertPage.tsx
index 0ba2364..170ba14 100644
--- a/src/pages/project-insert/ui/ProjectInsertPage.tsx
+++ b/src/pages/project-insert/ui/ProjectInsertPage.tsx
@@ -1,5 +1,5 @@
import type { CSSObject } from "@emotion/react";
-import { Button, Container } from "@mui/material";
+import { Container } from "@mui/material";
import type { ContainerProps } from "@mui/material/Container";
import type { Theme } from "@mui/material/styles";
import { styled } from "@mui/material/styles";
@@ -16,7 +16,7 @@ import Step3 from "@features/projects/ui/project-insert/Step3";
import Step4 from "@features/projects/ui/project-insert/Step4";
const ProjectInsertPage = (): JSX.Element => {
- const { currentStep, updateForm, goPrevPageforTest } = useProjectInsert();
+ const { currentStep, updateForm } = useProjectInsert();
return (
@@ -28,9 +28,9 @@ const ProjectInsertPage = (): JSX.Element => {
{currentStep === 3 && }
{currentStep === 4 && }
- */}
diff --git a/src/pages/user-profile/ui/UserProfilePage.tsx b/src/pages/user-profile/ui/UserProfilePage.tsx
index cda1329..b3a52a5 100644
--- a/src/pages/user-profile/ui/UserProfilePage.tsx
+++ b/src/pages/user-profile/ui/UserProfilePage.tsx
@@ -15,6 +15,7 @@ import UserProfileHeader from "@entities/user/ui/user-profile/UserProfileHeader"
import { useUserProfile } from "@shared/queries/useUserProfile";
import { useAuthStore } from "@shared/stores/authStore";
+import { useLikeStore } from "@shared/stores/likeStore";
import { useProjectStore } from "@shared/stores/projectStore";
import { ProjectCollectionTabType } from "@shared/types/project";
import LoadingSpinner from "@shared/ui/loading-spinner/LoadingSpinner";
@@ -66,6 +67,7 @@ const UserProfilePage = (): JSX.Element => {
// projectStore 동기화
const { setAppliedProjects, setLikeProjects } = useProjectStore();
+ const { setLikedProjectIds } = useLikeStore();
// 지원한 프로젝트 데이터를 store에 동기화
useEffect(() => {
@@ -74,12 +76,13 @@ const UserProfilePage = (): JSX.Element => {
}
}, [appliedProjectsData, setAppliedProjects]);
- // 좋아요한 프로젝트 데이터를 store에 동기화
+ // 좋아요한 프로젝트 데이터를 store와 likeStore에 동기화
useEffect(() => {
if (myLikedProjectsData) {
setLikeProjects(myLikedProjectsData);
+ setLikedProjectIds(myLikedProjectsData.map((p) => p.id));
}
- }, [myLikedProjectsData, setLikeProjects]);
+ }, [myLikedProjectsData, setLikeProjects, setLikedProjectIds]);
const handleDeleteProjects = async (
type: ProjectCollectionTabType,
diff --git a/src/shared/ui/SnackbarAlert.tsx b/src/shared/ui/SnackbarAlert.tsx
index 50452d9..e466221 100644
--- a/src/shared/ui/SnackbarAlert.tsx
+++ b/src/shared/ui/SnackbarAlert.tsx
@@ -29,6 +29,7 @@ const SnackbarAlert = ({
onClose={onClose}
anchorOrigin={anchorOrigin}
sx={{
+ zIndex: 9000,
marginTop: { xs: "6.4rem", md: "8rem" },
}}
>