Merge pull request #476 from sparcs-kaist/fix/loading-title-position

fix: align 'loading' text to center
sparcs-kaist · Mar 27, 2024 · d2a4cb7 · d2a4cb7
2 parents e4da96b + 4d82422
commit d2a4cb7
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 9 deletions.
diff --git a/packages/web/src/components/atoms/Text.tsx b/packages/web/src/components/atoms/Text.tsx
@@ -30,11 +30,21 @@ export const Text = styled.p<{
   variant?: Variants;
   color?: Color;
   position?: "absolute" | "static";
-}>(({ variant = "body", color = "black", theme, position = "static" }) => [
-  css({
-    color: theme.colors[color],
-    position,
-    whiteSpace: "pre-line",
-  }),
-  textStyles[variant],
-]);
+  textAlign?: "center" | "left";
+}>(
+  ({
+    variant = "body",
+    color = "black",
+    theme,
+    position = "static",
+    textAlign = "left",
+  }) => [
+    css({
+      color: theme.colors[color],
+      position,
+      whiteSpace: "pre-line",
+      textAlign,
+    }),
+    textStyles[variant],
+  ],
+);
diff --git a/packages/web/src/components/organisms/ChatSection.tsx b/packages/web/src/components/organisms/ChatSection.tsx
@@ -55,7 +55,7 @@ export const ChatSection: React.FC = () => {
           </>
         ))}
         {hasMore && (
-          <Text ref={ref} variant="body" color="gray400">
+          <Text ref={ref} variant="body" color="gray400" textAlign="center">
             로딩 중
           </Text>
         )}