video 블록 및 리펙터링

src/app/editor/templates/footerTemplate.ts

@@ -9,15 +9,17 @@ export function createFooterTemplateBlocks(opts: {
   const { sectionId, createId } = opts;
 
   const columns: SectionBlockProps["columns"] = [
-    { id: `${sectionId}_col_1`, span: 12 },
+    { id: `${sectionId}_col_1`, span: 4 },
+    { id: `${sectionId}_col_2`, span: 4 },
+    { id: `${sectionId}_col_3`, span: 4 },
   ];
 
   const sectionProps: SectionBlockProps = {
     background: "muted",
     paddingY: "md",
     // 푸터는 상대적으로 낮은 높이와 좁은 최대 폭을 사용한다.
-    paddingYPx: 40,
-    maxWidthPx: 800,
+    paddingYPx: 64,
+    maxWidthPx: 1120,
     backgroundColorCustom: "#020617",
     columns,
   } as any;
@@ -30,37 +32,74 @@ export function createFooterTemplateBlocks(opts: {
     columnId: null,
   };
 
-  const firstColumnId = `${sectionId}_col_1`;
+  const col1Id = `${sectionId}_col_1`;
+  const col2Id = `${sectionId}_col_2`;
+  const col3Id = `${sectionId}_col_3`;
 
+  // Col 1: Brand
+  const brandId = createId();
+  const brandProps: TextBlockProps = {
+    text: "MyLanding",
+    align: "left",
+    size: "xl",
+    bold: true,
+  } as any;
+  const brandBlock: Block = {
+    id: brandId,
+    type: "text",
+    props: brandProps,
+    sectionId,
+    columnId: col1Id,
+  };
+
+  const descId = createId();
+  const descProps: TextBlockProps = {
+    text: "더 나은 웹사이트를 위한 최고의 선택.",
+    align: "left",
+    size: "sm",
+    color: "muted",
+  } as any;
+  const descBlock: Block = {
+    id: descId,
+    type: "text",
+    props: descProps,
+    sectionId,
+    columnId: col1Id,
+  };
+
+  // Col 2: Links
   const linksId = createId();
   const linksProps: TextBlockProps = {
-    text: "이용약관 · 개인정보처리방침",
+    text: "서비스 소개\n요금제\n고객지원\n문의하기",
     align: "center",
     size: "sm",
+    color: "muted",
   } as any;
   const linksBlock: Block = {
     id: linksId,
     type: "text",
     props: linksProps,
     sectionId,
-    columnId: firstColumnId,
+    columnId: col2Id,
   };
 
+  // Col 3: Copyright
   const copyrightId = createId();
   const copyrightProps: TextBlockProps = {
-    text: "© 2025 MyLanding. All rights reserved.",
-    align: "center",
-    size: "sm",
+    text: "© 2025 MyLanding.\nAll rights reserved.",
+    align: "right",
+    size: "xs",
+    color: "muted",
   } as any;
   const copyrightBlock: Block = {
     id: copyrightId,
     type: "text",
     props: copyrightProps,
     sectionId,
-    columnId: firstColumnId,
+    columnId: col3Id,
   };
 
-  const blocks: Block[] = [sectionBlock, linksBlock, copyrightBlock];
+  const blocks: Block[] = [sectionBlock, brandBlock, descBlock, linksBlock, copyrightBlock];
   const lastSelectedId = copyrightId;
 
   return { blocks, lastSelectedId };