다국어 지원 및 테이블 설정 현황 문서를 업데이트하고, 컴포넌트 패널에서 UI 개선을 통해 사용자 경험을 향상시켰습니다. 또한, 통합 패널의 너비를 조정하고, 패널 토글 기능을 추가하여 인터페이스의 유연성을 높였습니다.
This commit is contained in:
@@ -20,6 +20,8 @@ import {
|
||||
Zap,
|
||||
Languages,
|
||||
Settings2,
|
||||
PanelLeft,
|
||||
PanelLeftClose,
|
||||
} from "lucide-react";
|
||||
import { ScreenResolution, SCREEN_RESOLUTIONS } from "@/types/screen";
|
||||
import {
|
||||
@@ -60,6 +62,9 @@ interface SlimToolbarProps {
|
||||
onGenerateMultilang?: () => void;
|
||||
isGeneratingMultilang?: boolean;
|
||||
onOpenMultilangSettings?: () => void;
|
||||
// 패널 토글 기능
|
||||
isPanelOpen?: boolean;
|
||||
onTogglePanel?: () => void;
|
||||
}
|
||||
|
||||
export const SlimToolbar: React.FC<SlimToolbarProps> = ({
|
||||
@@ -76,6 +81,8 @@ export const SlimToolbar: React.FC<SlimToolbarProps> = ({
|
||||
onGenerateMultilang,
|
||||
isGeneratingMultilang = false,
|
||||
onOpenMultilangSettings,
|
||||
isPanelOpen = false,
|
||||
onTogglePanel,
|
||||
}) => {
|
||||
// 사용자 정의 해상도 상태
|
||||
const [customWidth, setCustomWidth] = useState("");
|
||||
@@ -121,13 +128,33 @@ export const SlimToolbar: React.FC<SlimToolbarProps> = ({
|
||||
|
||||
return (
|
||||
<div className="flex h-14 items-center justify-between border-b border-gray-200 bg-gradient-to-r from-gray-50 to-white px-4 shadow-sm">
|
||||
{/* 좌측: 네비게이션 및 화면 정보 */}
|
||||
{/* 좌측: 네비게이션 + 패널 토글 + 화면 정보 */}
|
||||
<div className="flex items-center space-x-4">
|
||||
<Button variant="ghost" size="sm" onClick={onBack} className="flex items-center space-x-2">
|
||||
<ArrowLeft className="h-4 w-4" />
|
||||
<span>목록으로</span>
|
||||
</Button>
|
||||
|
||||
{onTogglePanel && <div className="h-6 w-px bg-gray-300" />}
|
||||
|
||||
{/* 패널 토글 버튼 */}
|
||||
{onTogglePanel && (
|
||||
<Button
|
||||
variant={isPanelOpen ? "default" : "outline"}
|
||||
size="sm"
|
||||
onClick={onTogglePanel}
|
||||
className="flex items-center space-x-2"
|
||||
title="패널 열기/닫기 (P)"
|
||||
>
|
||||
{isPanelOpen ? (
|
||||
<PanelLeftClose className="h-4 w-4" />
|
||||
) : (
|
||||
<PanelLeft className="h-4 w-4" />
|
||||
)}
|
||||
<span>패널</span>
|
||||
</Button>
|
||||
)}
|
||||
|
||||
<div className="h-6 w-px bg-gray-300" />
|
||||
|
||||
<div className="flex items-center space-x-3">
|
||||
|
||||
Reference in New Issue
Block a user