diff --git a/src/components/common/inputs/inputwithtitle/styled.js b/src/components/common/inputs/inputwithtitle/styled.js
index ad1f7f4..076c9a3 100644
--- a/src/components/common/inputs/inputwithtitle/styled.js
+++ b/src/components/common/inputs/inputwithtitle/styled.js
@@ -84,26 +84,28 @@ export const closeIcon = styled(TfiClose)`
cursor: pointer;
position: absolute;
- top: 13px;
- right: 40px;
+ top: 50%;
+ transform: translateY(-50%);
+ right: 10%;
@media (max-width: 360px) {
width: 16px;
height: 16px;
-
- top: 11px;
- right: 38px;
}
`;
export const ToggleButton = styled.div`
position: absolute;
- top: 13px;
- right: 70px;
+ top: 50%;
+ transform: translateY(-50%);
+ right: calc(10% + 30px);
@media (max-width: 360px) {
- top: 11px;
- right: 60px;
+ width: 16px;
+ height: 16px;
+
+ right: calc(10% + 20px);
+
}
`;
diff --git a/src/components/layout/header/Header.jsx b/src/components/layout/header/Header.jsx
index 8b5a818..833443a 100644
--- a/src/components/layout/header/Header.jsx
+++ b/src/components/layout/header/Header.jsx
@@ -7,10 +7,18 @@ export const Header = () => {
const { goToPage, goBack, goFoward } = useCustomNavigate();
const location = useLocation();
const isMagPage = location.pathname === "/main";
+
+ const disabledLogoPaths = ["/", "/signup", "/login"];
+ const isLogoDisabled = disabledLogoPaths.includes(location.pathname);
+
return (
{!isMagPage && }
- goToPage("/main")}/>
+ goToPage("/main") : undefined}
+ $disabled={isLogoDisabled}
+ />
)
}
\ No newline at end of file
diff --git a/src/pages/selectpage/SelectPage.jsx b/src/pages/selectpage/SelectPage.jsx
index 12c18e9..fa4d490 100644
--- a/src/pages/selectpage/SelectPage.jsx
+++ b/src/pages/selectpage/SelectPage.jsx
@@ -10,6 +10,8 @@ import { ChoiceModal } from "@components/common/choicemodal/ChoiceModal";
import { UserExplain } from "@components/common/userexplain/UserExplain";
import { InputAndTitle } from "@components/common/inputs/inputandtitle/InputAndTitle";
+import { formatDate } from "@utils/FormatDate";
+
import { useSelect } from "@hooks/useSelect";
import hint from "/images/apply/hint.svg";
import plus from "/images/apply/plus.svg";
@@ -169,12 +171,15 @@ export const SelectPage = () => {
type="date"
value={SelectData.startDate}
onChange={(e) => SelectHandlers.setStartDate(e.target.value)}
+ readOnly
/>
+
—
SelectHandlers.setEndDate(e.target.value)}
+ $isRight="true"
/>
diff --git a/src/pages/selectpage/styled.js b/src/pages/selectpage/styled.js
index 3753fd4..7abad19 100644
--- a/src/pages/selectpage/styled.js
+++ b/src/pages/selectpage/styled.js
@@ -312,6 +312,7 @@ export const inputWrap = styled.div`
export const DatePickerWrapper = styled.div`
display: flex;
+ justify-content: space-evenly;
align-items: center;
gap: 8px;
`;
@@ -321,10 +322,12 @@ export const StyledInput = styled.input`
padding: 8px;
border-radius: 8px;
background: ${({ theme }) => theme.colors.lightbluegray};
- color: ${({ theme }) => theme.colors.graytext};
+ color: ${({ theme, $isRight }) => $isRight ? theme.colors.bluetext : theme.colors.graytext};
cursor: pointer;
`;
+
+
export const Dash = styled.span`
font-size: 16px;
color: ${({ theme }) => theme.colors.grayback};
diff --git a/src/routes/router.jsx b/src/routes/router.jsx
index 6a9d6bc..b052fa9 100644
--- a/src/routes/router.jsx
+++ b/src/routes/router.jsx
@@ -31,7 +31,7 @@ export const router = createBrowserRouter([
children: [
{
path: ROUTE_PATHS.HOME,
- element: ,
+ element: ,
},
{
path: ROUTE_PATHS.MAIN,
diff --git a/src/styles/Theme.js b/src/styles/Theme.js
index b139e23..c895636 100644
--- a/src/styles/Theme.js
+++ b/src/styles/Theme.js
@@ -18,6 +18,7 @@ export const theme = {
red: "#FF3B30",
graytext: "#818181",
graytext2: "#8F8F8F",
+ bluetext: "#007AFF",
lightbluegray: "#EBEDF0",
grayback: "#D9D9D9",
},
diff --git a/src/utils/FormatDate.js b/src/utils/FormatDate.js
index d32073a..482c00a 100644
--- a/src/utils/FormatDate.js
+++ b/src/utils/FormatDate.js
@@ -1 +1,8 @@
-// 날짜 형식 유틸리티
\ No newline at end of file
+// 날짜 형식 유틸리티
+
+export const formatDate = (dateString) => {
+ if (!dateString) return "";
+
+ const options = { year: "numeric", month: "short", day: "numeric" };
+ return new Intl.DateTimeFormat("en-US", options).format(new Date(dateString));
+};
\ No newline at end of file