Skip to content

Commit 2df520f

Browse files
holim0holim0
committed
chore: 컴포넌트 스타일 수정(테일 윈드 테마 적용) (#258)
1 parent 6986325 commit 2df520f

File tree

3 files changed

+26
-26
lines changed

3 files changed

+26
-26
lines changed

‎services/one-app/src/app/(site)/_component/Editor/index.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ const Placeholder = ({
2020
}: {
2121
placeholder?: string;
2222
}) => (
23-
<pre className="absolute text-wrap text-[15px] leading-[1.5] tracking-[-0.02em] top-[12px] text-[#95979F] left-[12px] -z-50 font-sans">
23+
<pre className="absolute text-wrap text-body-large-semi top-[12px] text-gray-70 left-[12px] -z-50 font-sans">
2424
{placeholder}
2525
</pre>
2626
);
@@ -37,7 +37,7 @@ const Editor = ({ placeholder, onChange, initialState }: any) => {
3737
<div className="relative h-full">
3838
<RichTextPlugin
3939
contentEditable={
40-
<ContentEditable className="h-full w-full border rounded-[5px] p-3 overflow-hidden text-wrap text-[15px] text-[#33333E] leading-[1.5] tracking-[-0.02em]" />
40+
<ContentEditable className="h-full w-full border rounded-[5px] p-3 overflow-hidden text-wrap text-gray-90 text-body-large-semi" />
4141
}
4242
placeholder={<Placeholder placeholder={placeholder} />}
4343
ErrorBoundary={LexicalErrorBoundary}

‎services/one-app/src/app/(site)/lost-found/_components/LostFoundForm.tsx‎

Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -101,14 +101,14 @@ const LostFoundForm = ({ lostId = null }: Props) => {
101101
<button
102102
type="submit"
103103
disabled={!isActiveSubmitButton}
104-
className={`px-[13px] py-[6px] ${isActiveSubmitButton ? 'bg-[#2ACF6C] text-[#FBFBFB] cursor-pointer' : 'bg-[#EAECF1] text-[#95979F] cursor-not-allowed'} text-xs rounded-[3px] font-medium`}
104+
className={`px-[13px] py-[6px] rounded-[3px] text-body-small ${isActiveSubmitButton ? 'bg-key-color text-gray-0 cursor-pointer' : 'bg-gray-30 text-gray-70 cursor-not-allowed'}`}
105105
>
106106
등록
107107
</button>
108108
</div>
109109
<div className="h-full box-border pb-[26px] px-5 max-w-[520px]">
110110
<div className="mb-8">
111-
<p className="font-medium mb-3">유실물 상세정보</p>
111+
<p className="text-label-medium mb-3">유실물 상세정보</p>
112112
<div
113113
className={`flex pt-1.5 overflow-x-auto overflow-scroll [&::-webkit-scrollbar]:hidden`}
114114
>
@@ -149,9 +149,9 @@ const LostFoundForm = ({ lostId = null }: Props) => {
149149
</div>
150150

151151
<div className="mb-8">
152-
<div className="flex items-center font-medium mb-3">
153-
<p className="mr-1">카테고리</p>
154-
<span className="inline-block w-[5px] h-[5px] bg-red-500 rounded-full" />
152+
<div className="flex items-center mb-3">
153+
<p className="mr-1 gray-90 text-label-medium">카테고리</p>
154+
<span className="inline-block w-[5px] h-[5px] bg-red rounded-full" />
155155
</div>
156156
<fieldset>
157157
<input
@@ -165,7 +165,7 @@ const LostFoundForm = ({ lostId = null }: Props) => {
165165
/>
166166
<label
167167
htmlFor="lost"
168-
className="box-border px-[12px] py-[7px] rounded text-sm border font-semibold text-[#33333E] mr-2.5 peer-checked/lost:border-[#2ACF6C] peer-checked/lost:bg-[#2ACF6C] peer-checked/lost:text-[#FBFBFB]"
168+
className="box-border px-[12px] py-[7px] rounded border text-label-medium text-gray-90 mr-2.5 peer-checked/lost:border-key-color peer-checked/lost:bg-key-color peer-checked/lost:text-gray-0"
169169
>
170170
분실물
171171
</label>
@@ -180,39 +180,39 @@ const LostFoundForm = ({ lostId = null }: Props) => {
180180
/>
181181
<label
182182
htmlFor="acquire"
183-
className="box-border px-[12px] py-[7px] rounded text-sm border font-semibold text-[#33333E] peer-checked/acquire:border-[#2ACF6C] peer-checked/acquire:bg-[#2ACF6C] peer-checked/acquire:text-[#FBFBFB]"
183+
className="box-border px-[12px] py-[7px] rounded border text-label-medium text-gray-90 peer-checked/acquire:border-key-color peer-checked/acquire:bg-key-color peer-checked/acquire:text-gray-0"
184184
>
185185
습득물
186186
</label>
187187
</fieldset>
188188
</div>
189189
<div className="mb-8">
190-
<div className="flex items-center font-medium mb-3">
191-
<p className="mr-1">호선 선택</p>
192-
<span className="inline-block w-[5px] h-[5px] bg-red-500 rounded-full" />
190+
<div className="flex items-center mb-3">
191+
<p className="mr-1 text-label-medium text-gray-90">호선 선택</p>
192+
<span className="inline-block w-[5px] h-[5px] bg-red rounded-full" />
193193
</div>
194194
<SelectLineDrawer
195195
subwayLineId={subwayLineId}
196196
setSubwayLineId={setSubwayLineId}
197197
/>
198198
</div>
199199
<div className="mb-8">
200-
<div className="flex items-center font-medium mb-3">
201-
<p className="mr-1">제목</p>
202-
<span className="inline-block w-[5px] h-[5px] bg-red-500 rounded-full" />
200+
<div className="flex items-center mb-3">
201+
<p className="mr-1 text-label-medium text-gray-90">제목</p>
202+
<span className="inline-block w-[5px] h-[5px] bg-red rounded-full" />
203203
</div>
204204
<input
205205
type="text"
206206
placeholder="제목을 입력해주세요"
207207
value={title}
208208
onChange={(e) => setTitle(e.target.value)}
209-
className="w-full border py-3 pl-3 pr-4 outline-none rounded-[5px]"
209+
className="w-full border py-3 pl-3 pr-4 outline-none rounded-[5px] text-body-large-semi text-gray-90 placeholder:text-gray-70"
210210
/>
211211
</div>
212212
<div className="relative w-full h-[200px] mb-[32px]">
213-
<div className="flex items-center font-medium mb-3">
214-
<p className="mr-1">자세한 설명</p>
215-
<span className="inline-block w-[5px] h-[5px] bg-red-500 rounded-full" />
213+
<div className="flex items-center mb-3">
214+
<p className="mr-1 text-label-medium text-gray-90">자세한 설명</p>
215+
<span className="inline-block w-[5px] h-[5px] bg-red rounded-full" />
216216
</div>
217217
<Editor
218218
placeholder={

‎services/one-app/src/app/(site)/lost-found/_components/SelectLineDrawer.tsx‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ import {
1717
DrawerTitle,
1818
DrawerDescription,
1919
} from '@/common/components/drawer';
20-
import SUBWAY_LINES from '@/constants/subwayLines';
20+
import SUBWAY_LINES from '@/common/constants/subwayLines';
2121

2222
import { type CarouselApi } from '@/common/components/carousel';
2323

@@ -77,13 +77,13 @@ const SelectLineDrawer = ({ subwayLineId, setSubwayLineId }: any) => {
7777
<ArrowDownIcon />
7878
</button>
7979
</DrawerTrigger>
80-
<DrawerContent className="w-full bg-[#F5F5F5] border border-[#EAECF1] [box-shadow:0px_-5px_8px_0px_rgba(0,0,0,0.05)]">
81-
<div className="pl-[20px] pr-[20px] w-full h-full bg-[#F5F5F5]">
80+
<DrawerContent className="w-full bg-gray-20 border border-gray-30 [box-shadow:0px_-5px_8px_0px_rgba(0,0,0,0.05)]">
81+
<div className="pl-[20px] pr-[20px] w-full h-full bg-gray-20">
8282
<DrawerHeader className="p-0 mb-[32px]">
83-
<DrawerTitle className="text-left text-[#33333E] mb-3">
83+
<DrawerTitle className="!text-title-small text-gray-90 mb-3">
8484
호선 변경
8585
</DrawerTitle>
86-
<DrawerDescription className="text-left text-[#74757C]">
86+
<DrawerDescription className="text-left !text-label-medium text-gray-80">
8787
소식이 궁금한 호선을 선택해주세요.
8888
</DrawerDescription>
8989
</DrawerHeader>
@@ -107,7 +107,7 @@ const SelectLineDrawer = ({ subwayLineId, setSubwayLineId }: any) => {
107107
<label
108108
htmlFor={line.name}
109109
onClick={() => setSubwayLineId(line.id)}
110-
className={`${subwayLineId === line.id ? 'bg-[#2ACF6C] border-[#2ACF6C] text-white' : 'bg-[#FCFCFC] border-[#EAECF1] text-[#33333E]'} w-full flex items-center justify-center rounded-full border px-[4px] py-[8px] cursor-pointer min-w-[105px]`}
110+
className={`${subwayLineId === line.id ? 'bg-key-color border-key-color text-gray-0' : 'bg-gray-10 border-gray-30 text-gray-90'} w-full flex items-center justify-center rounded-full border px-[4px] py-[8px] cursor-pointer min-w-[105px] text-label-medium`}
111111
>
112112
{line.name}
113113
</label>
@@ -132,7 +132,7 @@ const SelectLineDrawer = ({ subwayLineId, setSubwayLineId }: any) => {
132132
</div>
133133
<DrawerFooter className="w-full mt-[24px] p-0">
134134
<DrawerClose asChild>
135-
<button className="font-semibold text-white px-[138px] py-[15px] bg-[#2ACF6C] rounded-lg">
135+
<button className="text-title-large text-gray-0 px-[138px] py-[15px] bg-key-color rounded-lg">
136136
완료
137137
</button>
138138
</DrawerClose>

0 commit comments

Comments
 (0)