style : 버튼 디자인 수정 (#425)

prgrms-web-devcourse-final-project · Dec 9, 2024 · 7c9b115 · 7c9b115
1 parent f44ff72
commit 7c9b115
Show file tree

Hide file tree

Showing 5 changed files with 9 additions and 10 deletions.
diff --git a/src/components/Common/NavigationBar/NavigationBar.tsx b/src/components/Common/NavigationBar/NavigationBar.tsx
@@ -18,7 +18,7 @@ export const NavigationBar = () => {
     ];
 
     return (
-        <nav className="flex justify-around bg-white border-y p-3 max-w-[473px] fixed min-w-[375px] w-full bottom-0 z-[9999]">
+        <nav className="flex justify-around bg-white border-y p-3 max-w-[477px] fixed min-w-[375px] w-full bottom-0 z-[9999]">
             {navItems.map((item) => (
                 <div className="flex justify-center flex-1" key={item.id}>
                     <NavigationItem

diff --git a/src/components/LetterDetailPage/LetterDatail/KeywordLetterDetail/KeywordLetterDetail.tsx b/src/components/LetterDetailPage/LetterDatail/KeywordLetterDetail/KeywordLetterDetail.tsx
@@ -99,7 +99,7 @@ export const KeywordLetterDetail = ({
                     letterType === 'LETTER' &&
                     !isReplied && (
                         <button
-                            className="btn-base flex-center rounded-3xl h-[40px]"
+                            className="btn-base z-[10000] bg-sample-blue text-white flex-center rounded-xl h-[40px]"
                             onClick={() =>
                                 navigate(
                                     `/letter/keyword/reply/create/${letterId}`

diff --git a/src/components/LetterDetailPage/LetterDatail/MapLetterDetail/MapLetterDetail.tsx b/src/components/LetterDetailPage/LetterDatail/MapLetterDetail/MapLetterDetail.tsx
@@ -145,18 +145,18 @@ export const MapLetterDetail = ({ letterData }: MapLetterDetailProps) => {
                 </div>
                 {!isOwner && (
                     <>
-                        <div className="flex">
+                        <div className="flex gap-2 m-2">
                             {!isStored && (
                                 <button
-                                    className="btn-base flex-center rounded-3xl h-[40px]"
+                                    className="btn-base z-[10000] bg-sample-blue text-white flex-center rounded-xl h-[40px]"
                                     onClick={onStorageClick}
                                 >
                                     보관하기
                                 </button>
                             )}
-                            {isReplied !== undefined && !isReplied && (
+                            {!isReplied && (
                                 <button
-                                    className="btn-base flex-center rounded-3xl h-[40px]"
+                                    className="btn-base z-[10000] bg-white flex-center rounded-xl h-[40px]"
                                     onClick={onReplyClick}
                                 >
                                     편지에 답장하기

diff --git a/src/pages/Map/MapExplorerPage.tsx b/src/pages/Map/MapExplorerPage.tsx
@@ -94,7 +94,7 @@ export const MapExplorerPage = () => {
                                 ) : (
                                     <NavLink
                                         to={'/letter/create'}
-                                        className={`mb-36 ${CreateBtnStyle}`}
+                                        className={`cursor-not-allowed mb-36 ${CreateBtnStyle}`}
                                         onClick={(e) => e.preventDefault()}
                                     >
                                         <HiOutlinePencilAlt />
@@ -125,7 +125,7 @@ export const MapExplorerPage = () => {
                                 ) : (
                                     <NavLink
                                         to={'/letter/create'}
-                                        className={CreateBtnStyle}
+                                        className={`cursor-not-allowed ${CreateBtnStyle}`}
                                         onClick={(e) => e.preventDefault()}
                                     >
                                         <HiOutlinePencilAlt />

diff --git a/tailwind.config.js b/tailwind.config.js
@@ -100,8 +100,7 @@ export default {
         ({ addComponents }) => {
             addComponents({
                 '.btn-base': {
-                    '@apply bg-primary w-full rounded p-6 text-black hover:opacity-80':
-                        ''
+                    '@apply bg-primary w-full rounded p-6 text-black': ''
                 },
                 '.text-btn': {
                     '@apply text-black hover:underline': ''