Refactor: components 클래스 코드 스타일 수정
This commit is contained in:
parent
e746491e44
commit
198042108e
@ -12,13 +12,13 @@ export default function Footer({ className, ...props }: FooterProps) {
|
|||||||
<div className="container py-10">
|
<div className="container py-10">
|
||||||
<div className="flex flex-col items-start gap-5">
|
<div className="flex flex-col items-start gap-5">
|
||||||
<div className="relative">
|
<div className="relative">
|
||||||
<div className="text-lg text-gray-600 font-heading md:text-xl">WorLabel</div>
|
<div className="font-heading text-lg text-gray-600 md:text-xl">WorLabel</div>
|
||||||
<p className="mt-2 text-gray-500 font-body-small">Copyright © 2024 WorLabel All rights reserved</p>
|
<p className="font-body-small mt-2 text-gray-500">Copyright © 2024 WorLabel All rights reserved</p>
|
||||||
</div>
|
</div>
|
||||||
<div className="inline-flex items-center gap-4">
|
<div className="inline-flex items-center gap-4">
|
||||||
<div className="text-gray-500 font-body-small">서비스 이용약관</div>
|
<div className="font-body-small text-gray-500">서비스 이용약관</div>
|
||||||
<div className="w-px h-4 bg-gray-400" />
|
<div className="h-4 w-px bg-gray-400" />
|
||||||
<div className="text-gray-500 font-body-small">개인정보 처리방침</div>
|
<div className="font-body-small text-gray-500">개인정보 처리방침</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -22,7 +22,7 @@ export default function Header({ className, ...props }: HeaderProps) {
|
|||||||
>
|
>
|
||||||
WorLabel
|
WorLabel
|
||||||
</div>
|
</div>
|
||||||
<nav className="items-center hidden gap-5 md:flex">
|
<nav className="hidden items-center gap-5 md:flex">
|
||||||
<div className={cn('text-color-text-default-default', 'font-body-strong', 'text-sm sm:text-base md:text-lg')}>
|
<div className={cn('text-color-text-default-default', 'font-body-strong', 'text-sm sm:text-base md:text-lg')}>
|
||||||
workspace
|
workspace
|
||||||
</div>
|
</div>
|
||||||
@ -33,12 +33,12 @@ export default function Header({ className, ...props }: HeaderProps) {
|
|||||||
</div>
|
</div>
|
||||||
<div className="flex items-center gap-4 md:gap-5">
|
<div className="flex items-center gap-4 md:gap-5">
|
||||||
<img
|
<img
|
||||||
className="w-4 h-4 sm:h-5 sm:w-5"
|
className="h-4 w-4 sm:h-5 sm:w-5"
|
||||||
src={bellIcon}
|
src={bellIcon}
|
||||||
alt="Bell Icon"
|
alt="Bell Icon"
|
||||||
/>
|
/>
|
||||||
<img
|
<img
|
||||||
className="w-4 h-4 sm:h-5 sm:w-5"
|
className="h-4 w-4 sm:h-5 sm:w-5"
|
||||||
src={userIcon}
|
src={userIcon}
|
||||||
alt="User Icon"
|
alt="User Icon"
|
||||||
/>
|
/>
|
||||||
|
@ -25,7 +25,7 @@ export default function Button({ isActive, text, onClick, progress = 0 }: Button
|
|||||||
>
|
>
|
||||||
<span className="relative z-10 font-sans text-base font-bold leading-6">{buttonText}</span>
|
<span className="relative z-10 font-sans text-base font-bold leading-6">{buttonText}</span>
|
||||||
<div
|
<div
|
||||||
className="absolute top-0 left-0 z-0 h-full duration-300 bg-white transition-width bg-opacity-20"
|
className="transition-width absolute left-0 top-0 z-0 h-full bg-white bg-opacity-20 duration-300"
|
||||||
style={{ width: `var(--progress-width, 0%)` }}
|
style={{ width: `var(--progress-width, 0%)` }}
|
||||||
></div>
|
></div>
|
||||||
</button>
|
</button>
|
||||||
|
@ -8,8 +8,8 @@ interface FileListProps {
|
|||||||
|
|
||||||
export default function FileList({ files, onRemoveFile }: FileListProps): JSX.Element {
|
export default function FileList({ files, onRemoveFile }: FileListProps): JSX.Element {
|
||||||
return (
|
return (
|
||||||
<div className="max-w-full overflow-x-hidden overflow-y-auto max-h-52">
|
<div className="max-h-52 max-w-full overflow-y-auto overflow-x-hidden">
|
||||||
<ul className="p-0 m-0 list-none">
|
<ul className="m-0 list-none p-0">
|
||||||
{files.map((file, index) => (
|
{files.map((file, index) => (
|
||||||
<li
|
<li
|
||||||
key={index}
|
key={index}
|
||||||
|
@ -69,7 +69,7 @@ export default function ImageUploadModal({ title, buttonText, onClose }: ImageUp
|
|||||||
<header className="flex items-center justify-between">
|
<header className="flex items-center justify-between">
|
||||||
<h1 className="small-title">{title}</h1>
|
<h1 className="small-title">{title}</h1>
|
||||||
<button
|
<button
|
||||||
className="flex items-center justify-center w-8 h-8"
|
className="flex h-8 w-8 items-center justify-center"
|
||||||
onClick={handleClose}
|
onClick={handleClose}
|
||||||
>
|
>
|
||||||
<CloseButton />
|
<CloseButton />
|
||||||
@ -87,7 +87,7 @@ export default function ImageUploadModal({ title, buttonText, onClose }: ImageUp
|
|||||||
<input
|
<input
|
||||||
type="file"
|
type="file"
|
||||||
multiple
|
multiple
|
||||||
className="absolute inset-0 w-full h-full opacity-0 cursor-pointer"
|
className="absolute inset-0 h-full w-full cursor-pointer opacity-0"
|
||||||
onChange={handleFilesUpload}
|
onChange={handleFilesUpload}
|
||||||
/>
|
/>
|
||||||
<p className="font-sans text-base font-normal leading-relaxed text-gray-500">
|
<p className="font-sans text-base font-normal leading-relaxed text-gray-500">
|
||||||
|
Loading…
Reference in New Issue
Block a user