Skip to content

Commit 9825800

Browse files
inhooinuinhooinu
authored
Merge pull request #228 from Pocket-SOL/feature/154-tailwind
Feature/154 tailwind
2 parents 20a336d + feb5e43 commit 9825800

File tree

9 files changed

+67
-71
lines changed

9 files changed

+67
-71
lines changed

‎src/components/HomePage.module.css‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@
2929
display: flex;
3030
justify-content: space-between;
3131
padding: 1rem;
32-
margin-bottom: 30px;
32+
/* margin-bottom: 30px; */
3333
border: 2px solid #e5e5e5; /* 테두리 선 색상 변경 */
3434
}
3535

@@ -139,12 +139,12 @@
139139
justify-content: space-between;
140140
}
141141

142-
.simplePayment {
142+
/* .simplePayment {
143143
background-color: #00db49;
144-
}
144+
} */
145145

146146
.groupPurchase {
147-
background-color: #fc25d5;
147+
background-color: #00db49;
148148
}
149149

150150
.groupPurchaseIcon {

‎src/pages/Children/Allowance/AllowanceRequestPage.jsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ function Modal({ isOpen, onClose, onSubmit }) {
2323
return (
2424
isOpen && (
2525
<div className="fixed inset-0 flex items-center justify-center bg-black bg-opacity-50">
26-
<div className="bg-white rounded-lg p-6 w-96">
26+
<div className="bg-white rounded-lg p-6 m-4 w-96">
2727
<h3 className="text-lg font-bold mb-4">금액 입력</h3>
2828
<input
2929
type="number"
@@ -63,7 +63,7 @@ function AllowanceRequest() {
6363

6464
const handleSliderChange = (e) => {
6565
const value = Number(e.target.value);
66-
const roundedValue = Math.max(0, Math.round(value / 10) * 10);
66+
const roundedValue = Math.max(0, Math.round(value));
6767
setAmount(roundedValue);
6868
};
6969

@@ -73,7 +73,7 @@ function AllowanceRequest() {
7373
const closeModal = () => setIsModalOpen(false);
7474

7575
const handleModalSubmit = (value) => {
76-
setAmount(Math.round(value / 10) * 10); // 10 단위로 반올림
76+
setAmount(Math.round(value)); // 100 단위로 반올림
7777
};
7878

7979
const calculateHandlePosition = () => {

‎src/pages/Children/GroupPurchase/GroupPurchaseListPage.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -97,7 +97,7 @@ export default function GroupPurchaseListPage() {
9797
});
9898

9999
return (
100-
<div className="bg-gray-50 py-10 sm:py-10">
100+
<div className=" py-10 sm:py-10">
101101
<div className="mx-auto max-w-3xl px-6 lg:px-8">
102102
{/* Nav & Tabs */}
103103
<div className="border-b border-gray-200 mb-8">

‎src/pages/Children/GroupPurchase/GroupPurchaseReg.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -98,7 +98,7 @@ export default function GroupPurchaseReg() {
9898
};
9999

100100
return (
101-
<div className="max-w-md mx-auto p-6 bg-white rounded-lg shadow-lg mt-8">
101+
<div className="max-w-md mx-auto p-6 bg-white rounded-lg mt-8">
102102
<h2 className="text-2xl font-bold text-center text-gray-800 mb-4">
103103
공동 구매 등록
104104
</h2>

‎src/pages/Children/HomePage.jsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -128,15 +128,15 @@ export default function ChildrenHomePage() {
128128
</div>
129129
</div>
130130
</div>
131-
<div className={styles.wideActionContainer}>
131+
{/* <div className={styles.wideActionContainer}>
132132
<WideActionItem
133133
title="빠르게 결제해봐요"
134134
backgroundColor="simplePayment"
135135
onClick={() => {
136136
navigate("/children");
137137
}}
138138
/>
139-
</div>
139+
</div> */}
140140
<div className={styles.actionContainer}>
141141
<ActionItem
142142
title="용돈 조르기"

‎src/pages/Parents/Allowance/Tip/Tip.jsx‎

Lines changed: 49 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -41,67 +41,63 @@ export default function Tip() {
4141
}
4242

4343
return (
44-
<div className="min-h-screen bg-gray-50 py-6 px-4 sm:px-6 lg:px-8 transition-all duration-500 ease-in-out">
45-
<div
46-
className={`max-w-2xl mx-auto transform transition-all duration-700 ${
47-
isVisible ? "translate-y-0 opacity-100" : "translate-y-10 opacity-0"
48-
}`}
49-
>
50-
<div className="bg-white rounded-lg shadow-md p-4 space-y-8 hover:shadow-xl transition-shadow duration-300">
51-
{/*질문부분 */}
52-
<div className="space-y-4">
53-
<h2 className="text-xl font-semibold text-gray-800 text-center animate-bounce">
54-
🌟오늘의 팁🌟
55-
</h2>
56-
<div
57-
className={`p-4 bg-blue-50 rounded-lg transform transition-all duration-500 ${
58-
isVisible
59-
? "translate-x-0 opacity-100"
60-
: "translate-x-[-50px] opacity-0"
61-
}`}
62-
>
63-
<p className="text-gray-700 text-lg text-center">
64-
{currentQuestion?.tip}
65-
</p>
66-
</div>
67-
</div>
68-
69-
{/* 답변 */}
70-
<div className="space-y-4">
71-
<h3 className="text-lg font-medium text-gray-700 text-center">
72-
해결방법
73-
</h3>
74-
<div
75-
className={`p-4 bg-green-50 rounded-lg transform transition-all duration-500 delay-300 ${
76-
isVisible
77-
? "translate-x-0 opacity-100"
78-
: "translate-x-[50px] opacity-0"
79-
}`}
80-
>
81-
<p className="text-lg text-gray-600 text-center">
82-
{currentQuestion?.answer}
83-
</p>
84-
</div>
44+
<div
45+
className={`max-w-2xl mx-auto transform transition-all duration-700 ${
46+
isVisible ? "translate-y-0 opacity-100" : "translate-y-10 opacity-0"
47+
}`}
48+
>
49+
<div className="bg-white rounded-lg shadow-md p-4 space-y-8 hover:shadow-xl transition-shadow duration-300">
50+
{/*질문부분 */}
51+
<div className="space-y-4">
52+
<h2 className="text-xl font-semibold text-gray-800 text-center animate-bounce">
53+
🌟오늘의 팁🌟
54+
</h2>
55+
<div
56+
className={`p-4 bg-blue-50 rounded-lg transform transition-all duration-500 ${
57+
isVisible
58+
? "translate-x-0 opacity-100"
59+
: "translate-x-[-50px] opacity-0"
60+
}`}
61+
>
62+
<p className="text-gray-700 text-lg text-center">
63+
{currentQuestion?.tip}
64+
</p>
8565
</div>
66+
</div>
8667

68+
{/* 답변 */}
69+
<div className="space-y-4">
70+
<h3 className="text-lg font-medium text-gray-700 text-center">
71+
해결방법
72+
</h3>
8773
<div
88-
className={`flex flex-col items-center p-5 mx-auto mt-0 transform transition-all duration-500 delay-500 ${
74+
className={`p-4 bg-green-50 rounded-lg transform transition-all duration-500 delay-300 ${
8975
isVisible
90-
? "translate-y-0 opacity-100"
91-
: "translate-y-10 opacity-0"
76+
? "translate-x-0 opacity-100"
77+
: "translate-x-[50px] opacity-0"
9278
}`}
9379
>
94-
<button
95-
onClick={() => {
96-
navigate("/parents");
97-
}}
98-
className="bg-gray-200 text-gray-700 rounded-2xl w-52 h-12 text-xl
80+
<p className="text-lg text-gray-600 text-center">
81+
{currentQuestion?.answer}
82+
</p>
83+
</div>
84+
</div>
85+
86+
<div
87+
className={`flex flex-col items-center p-5 mx-auto mt-0 transform transition-all duration-500 delay-500 ${
88+
isVisible ? "translate-y-0 opacity-100" : "translate-y-10 opacity-0"
89+
}`}
90+
>
91+
<button
92+
onClick={() => {
93+
navigate("/parents");
94+
}}
95+
className="bg-gray-200 text-gray-700 rounded-2xl w-52 h-12 text-xl
9996
shadow-md hover:shadow-lg transition-all duration-300
10097
hover:bg-gray-300 hover:-translate-y-1 active:translate-y-0"
101-
>
102-
홈으로 돌아가기
103-
</button>
104-
</div>
98+
>
99+
홈으로 돌아가기
100+
</button>
105101
</div>
106102
</div>
107103
</div>

‎src/pages/Start/LoginPage.jsx‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -77,10 +77,7 @@ export default function LoginPage() {
7777
<p>아이디와 비밀번호를 입력해주세요</p>
7878
</div>
7979

80-
<form
81-
className="w-full max-w-md p-6 bg-white rounded-lg shadow-md"
82-
onSubmit={handleSubmit}
83-
>
80+
<form className="w-full p-6" onSubmit={handleSubmit}>
8481
<div className="mb-4">
8582
<label
8683
htmlFor="id"
@@ -123,7 +120,7 @@ export default function LoginPage() {
123120
</button>
124121
</form>
125122

126-
<div className="mt-4">
123+
<div>
127124
<p>
128125
<a
129126
style={{ color: "#0084FC", fontSize: "15px" }}

‎src/pages/Start/SignUpFormPage.jsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@ export default function SignUpFormPage() {
55
const location = useLocation();
66
const navigate = useNavigate();
77
const role = location.state?.role || "parent";
8+
const today = new Date();
9+
const todayString = today.toISOString().split("T")[0];
810

911
const [formData, setFormData] = useState({
1012
name: "",
@@ -64,7 +66,7 @@ export default function SignUpFormPage() {
6466
};
6567

6668
return (
67-
<div className="flex flex-col items-center justify-center h-screen p-2">
69+
<div className="flex flex-col items-center h-screen p-2">
6870
<form className="w-full max-w-lg space-y-6" onSubmit={handleSubmit}>
6971
<div className="flex flex-col gap-2 w-full">
7072
<label htmlFor="name" className="text-lg font-semibold">
@@ -86,6 +88,7 @@ export default function SignUpFormPage() {
8688
<input
8789
id="birthdate"
8890
type="date"
91+
max={todayString} // 오늘 날짜 이후 선택 불가
8992
className="w-full max-w-md px-4 py-2 border border-gray-300 rounded-md text-lg"
9093
value={formData.birthdate}
9194
onChange={handleChange}

‎src/pages/Start/SignUpRolePage.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ export default function SignUpRolePage() {
88
};
99

1010
return (
11-
<div className="flex flex-col items-center justify-center h-screen p-5">
11+
<div className="flex flex-col items-center h-screen p-4">
1212
<h1 className="text-2xl text-black mb-8">역할을 선택해주세요</h1>
1313
<div className="flex gap-4">
1414
<button

0 commit comments

Comments
 (0)