From f1fb7c868a68f88eb333387bb0d973e941c0d3b5 Mon Sep 17 00:00:00 2001 From: chu eun ju Date: Tue, 16 Dec 2025 16:53:23 +0900 Subject: [PATCH] =?UTF-8?q?mpt=ED=99=94=EB=A9=B4=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/app/cow/[cowNo]/page.tsx | 29 +- frontend/src/app/demo/mobile-auth-v1/page.tsx | 253 ++++++++++++++++++ 2 files changed, 264 insertions(+), 18 deletions(-) create mode 100644 frontend/src/app/demo/mobile-auth-v1/page.tsx diff --git a/frontend/src/app/cow/[cowNo]/page.tsx b/frontend/src/app/cow/[cowNo]/page.tsx index e77d80d..c75a507 100644 --- a/frontend/src/app/cow/[cowNo]/page.tsx +++ b/frontend/src/app/cow/[cowNo]/page.tsx @@ -1678,26 +1678,19 @@ export default function CowOverviewPage() { {/* 번식능력 탭 */} - {/* 혈액화학검사(MPT) 테이블 */} + {/* 혈액화학검사(MPT) 테이블 - 추후 사용 - - {/* TODO: 번식능력 분석 결과 (추후 사용) - {hasReproductionData ? ( -
-

번식능력 분석 결과

-
- ) : ( - - - -

번식능력 분석 데이터 없음

-

- 이 개체는 아직 번식능력 분석이 완료되지 않았습니다. -

- - - )} */} + + + + +

번식능력 분석 데이터 없음

+

+ 이 개체는 아직 번식능력 분석이 완료되지 않았습니다. +

+ + diff --git a/frontend/src/app/demo/mobile-auth-v1/page.tsx b/frontend/src/app/demo/mobile-auth-v1/page.tsx new file mode 100644 index 0000000..6389e4c --- /dev/null +++ b/frontend/src/app/demo/mobile-auth-v1/page.tsx @@ -0,0 +1,253 @@ +'use client'; + +import { useState } from "react"; +import Image from "next/image"; +import { Button } from "@/components/ui/button"; +import { Input } from "@/components/ui/input"; +import { Field, FieldGroup, FieldLabel, FieldSeparator } from "@/components/ui/field"; +import { Tabs, TabsList, TabsTrigger } from "@/components/ui/tabs"; +import { Eye, EyeOff } from "lucide-react"; + +/** + * 모바일 로그인 디자인 시안 모음 + * 원본 이미지 로고 기반으로 크기/배치/여백 조정한 변형들 + */ +export default function MobileAuthDemoPage() { + const [showPassword, setShowPassword] = useState(false); + const [activeTab, setActiveTab] = useState<'v1' | 'v2' | 'v3' | 'v4'>('v1'); + + const descriptions: Record = { + v1: { + title: '시안 1: 로고 축소', + items: ['로고 200px → 100px', '여백 최소화', '기존 레이아웃 유지'] + }, + v2: { + title: '시안 2: 가로 배치', + items: ['로고 + 타이틀 가로 정렬', '로고 60px', '공간 효율적 사용'] + }, + v3: { + title: '시안 3: 상단 바 형태', + items: ['로고를 상단 바에 배치', '로고 40px', '폼 영역 최대화'] + }, + v4: { + title: '시안 4: 배경 워터마크', + items: ['로고를 배경으로 사용', '반투명 처리', '폼에 집중'] + } + }; + + // 공통 폼 컴포넌트 + const LoginFormContent = ({ compact = false }: { compact?: boolean }) => ( +
+ + + 아이디 + + + + +
+ 비밀번호 + 비밀번호 찾기 +
+
+ + +
+ + + + + + + + + 또는 + + + + + +
+ + 아이디를 잊으셨나요? + +
+ +
+ ); + + return ( +
+ {/* 상단 탭 */} +
+ setActiveTab(v as 'v1' | 'v2' | 'v3' | 'v4')} className="w-full"> + + 축소 + 가로 + 상단바 + 배경 + + +
+ + {/* 모바일 프리뷰 컨테이너 */} +
+ + {/* 시안 1: 로고 크기만 축소 */} + {activeTab === 'v1' && ( +
+ {/* 로고 - 100px로 축소 */} +
+ 로고 +
+ + {/* 타이틀 */} +
+

로그인

+

한우 유전능력 컨설팅 서비스

+
+ + {/* 폼 영역 */} +
+
+ +
+
+
+ )} + + {/* 시안 2: 로고 + 타이틀 가로 배치 */} + {activeTab === 'v2' && ( +
+ {/* 로고 + 타이틀 가로 배치 */} +
+ 로고 +
+

로그인

+

한우 유전능력 컨설팅 서비스

+
+
+ + {/* 폼 영역 */} +
+
+ +
+
+
+ )} + + {/* 시안 3: 상단 바 형태 */} + {activeTab === 'v3' && ( +
+ {/* 상단 헤더 바 */} +
+ 로고 + 한우 유전능력 컨설팅 +
+ + {/* 폼 영역 */} +
+
+
+

로그인

+

계정에 로그인하세요

+
+ +
+
+
+ )} + + {/* 시안 4: 배경 워터마크 */} + {activeTab === 'v4' && ( +
+ {/* 배경 로고 (워터마크) */} +
+ +
+ + {/* 폼 영역 */} +
+
+
+

로그인

+

한우 유전능력 컨설팅 서비스

+
+ +
+
+
+ )} +
+ + {/* 시안 설명 (하단 고정) */} +
+
+

{descriptions[activeTab].title}

+
    + {descriptions[activeTab].items.map((item, i) => ( +
  • • {item}
    • + ))} +
+
+
+
+ ); +}