diff --git a/front/src/components/common/LoadingView.tsx b/front/src/components/common/LoadingView.tsx
index 1a249fb..e62b20f 100644
--- a/front/src/components/common/LoadingView.tsx
+++ b/front/src/components/common/LoadingView.tsx
@@ -1,8 +1,22 @@
import {css} from '../../../styled-system/css';
import {Loading} from '../icon/Loading.tsx';
-export const LoadingView = () => (
-
+type Props = {
+ text?: string;
+};
+
+export const LoadingView = ({text}: Props) => (
+
+ {text && {text}}
);
diff --git a/front/src/components/icon/Loading.tsx b/front/src/components/icon/Loading.tsx
index e6fa3e5..ce33bfa 100644
--- a/front/src/components/icon/Loading.tsx
+++ b/front/src/components/icon/Loading.tsx
@@ -15,7 +15,6 @@ const container = css({
display: 'grid',
justifyContent: 'center',
alignItems: 'center',
- height: '350px',
});
const spinner = css({
diff --git a/front/src/pages/ai_maker/ReferenceKeywordPickPage.tsx b/front/src/pages/ai_maker/ReferenceKeywordPickPage.tsx
index 730a992..9725517 100644
--- a/front/src/pages/ai_maker/ReferenceKeywordPickPage.tsx
+++ b/front/src/pages/ai_maker/ReferenceKeywordPickPage.tsx
@@ -23,7 +23,7 @@ export const ReferenceKeywordPickPage = () => {
};
return isLoading ? (
-
+
) : (
{
};
return isLoading ? (
-
+
) : (
{
};
return isLoading || !report ? (
-
+
) : (
{
for you!
>
}
- subtitle={'짠'}
+ subtitle={'4가지 이미지 중 하나를 선택해주세요'}
/>
{report && (
<>
@@ -59,7 +59,9 @@ export const ResultPage = () => {
-
+
>
)}
@@ -75,7 +77,7 @@ const containerStyle = css({
pb: '40px',
});
-const imageContainerStyle = css({display: 'flex', gap: '10px', justifyContent: 'center'});
+const imageContainerStyle = css({display: 'flex', gap: '10px', justifyContent: 'center', p: '0 40px'});
const imageWrapperStyle = css({
position: 'relative',
@@ -107,4 +109,12 @@ const buttonStyle = css({
color: 'white',
cursor: 'pointer',
userSelect: 'none',
+ ['&:disabled']: {
+ cursor: 'default',
+ borderColor: 'gray',
+ color: 'gray',
+ '& svg': {
+ fill: 'gray',
+ },
+ },
});
diff --git a/front/src/pages/ai_maker/UploadReferenceImagePage.tsx b/front/src/pages/ai_maker/UploadReferenceImagePage.tsx
index 14b9d98..a443fba 100644
--- a/front/src/pages/ai_maker/UploadReferenceImagePage.tsx
+++ b/front/src/pages/ai_maker/UploadReferenceImagePage.tsx
@@ -59,7 +59,7 @@ const containerStyle = css({
flexDir: 'column',
justifyContent: 'space-between',
height: '100%',
- pb: '80px',
+ pb: '100px',
});
const imageContainerStyle = css({
@@ -83,5 +83,5 @@ const uploadButtonStyle = {
border: '1px solid white',
borderRadius: '37.5px',
p: '0 37.5px',
- m: 'auto',
+ m: '0 auto auto auto',
};