Design: 워크스페이스 양쪽 레이아웃 여백 통일

This commit is contained in:
홍창기 2024-09-23 18:49:52 +09:00
parent 06681218a6
commit 5083b90624
3 changed files with 10 additions and 9 deletions

View File

@ -12,12 +12,12 @@ export default function WorkspaceLabelBar() {
};
return (
<div className="flex h-full w-[280px] flex-col justify-between border-l border-gray-300 bg-gray-50">
<div className="flex h-full w-[280px] flex-col justify-between gap-2 border-l border-gray-300 bg-gray-50 p-3">
<div className="flex flex-col gap-2.5">
<header className="subheading flex w-full items-center gap-2 px-5 py-2.5">
<header className="subheading flex w-full items-center gap-2">
<h1 className="w-full overflow-hidden text-ellipsis whitespace-nowrap"> </h1>
</header>
<div className="flex flex-col gap-1 px-2.5">
<div className="flex flex-col gap-1">
{labels.map((label) => (
<LabelButton
key={label.id}

View File

@ -1,11 +1,12 @@
import { Project } from '@/types';
import { Play, SquarePenIcon, Upload } from 'lucide-react';
import { Play } from 'lucide-react';
import ProjectFileItem from './ProjectFileItem';
import ProjectDirectoryItem from './ProjectDirectoryItem';
import useFolderQuery from '@/queries/folders/useFolderQuery';
import useCanvasStore from '@/stores/useCanvasStore';
import { Button } from '../ui/button';
import { useEffect } from 'react';
import WorkspaceDropdownMenu from '../WorkspaceDropdownMenu';
export default function ProjectStructure({ project }: { project: Project }) {
const setProject = useCanvasStore((state) => state.setProject);
@ -21,7 +22,7 @@ export default function ProjectStructure({ project }: { project: Project }) {
<div className="flex flex-col overflow-y-auto px-1 pb-2">
<header className="flex w-full items-center gap-2 rounded p-1">
<div className="flex w-full items-center gap-1 overflow-hidden pr-1">
<h3 className="caption overflow-hidden text-ellipsis whitespace-nowrap">{project.type}</h3>
<h2 className="caption overflow-hidden text-ellipsis whitespace-nowrap">{project.type}</h2>
</div>
<WorkspaceDropdownMenu
projectId={project.id}

View File

@ -22,13 +22,13 @@ export default function WorkspaceSidebar({ workspaceName, projects }: { workspac
minSize={10}
maxSize={35}
defaultSize={20}
className="flex h-full flex-col bg-gray-50"
className="flex h-full flex-col gap-2 bg-gray-50 p-3"
onResize={(size) => setSidebarSize(size)}
>
<header className="body flex w-full items-center gap-2 p-2">
<h1 className="w-full overflow-hidden text-ellipsis whitespace-nowrap">{workspaceName}</h1>
<header className="body flex w-full items-center gap-2">
<h1 className="subheading w-full overflow-hidden text-ellipsis whitespace-nowrap">{workspaceName}</h1>
</header>
<div className="p-2">
<div className="">
<Select
onValueChange={handleSelectProject}
defaultValue={selectedProjectId}