thunderstrike/plane
thunderstrike/plane
2
0
Fork 0
forked from github/plane
Code Pull Requests Activity

style: projects settings page

Browse Source
This commit is contained in:
Aaryan Khandelwal 2022-12-20 21:14:42 +05:30
parent 009826d991
commit 21660e2872
9 changed files with 70 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/app/components/project/member-invitations.tsx
View File

@ -66,7 +66,7 @@ const ProjectMemberInvitations: React.FC<Props> = ({
return (
<>
<div
className={`w-full h-full flex flex-col px-4 py-3 rounded-md bg-white ${
className={`w-full h-full flex flex-col px-4 py-3 rounded-md border bg-white ${
selected ? "ring-2 ring-indigo-400" : ""
}`}
>

7
apps/app/layouts/navbar/settings-sidebar.tsx
View File

@ -15,11 +15,8 @@ const SettingsSidebar: React.FC<Props> = ({ links }) => {
return (
<nav className="h-screen w-72 border-r border-gray-200">
<div className="h-full p-2 pl-6 mt-16">
<h2 className="flex items-center gap-2 text-lg font-medium leading-5">
<ArrowLeftIcon className="h-4 w-4" />
Settings
</h2>
<div className="p-2 pl-6 mt-16">
<h2 className="flex items-center gap-2 text-lg font-medium leading-5">Settings</h2>
<div className="mt-6 space-y-1">
{links.map((link, index) => (
<h4 key={index}>

2
apps/app/layouts/settings-layout.tsx
View File

@ -104,7 +104,7 @@ const SettingsLayout: React.FC<Props> = ({
<main className="h-screen w-full flex flex-col overflow-y-auto min-w-0">
{noHeader ? null : <Header breadcrumbs={breadcrumbs} left={left} right={right} />}
<div
className={`w-full flex-grow ${noPadding ? "" : "p-5 px-16 pt-16"} ${
className={`w-full flex-grow ${noPadding ? "" : "p-5 px-16"} ${
bg === "primary" ? "bg-primary" : bg === "secondary" ? "bg-secondary" : "bg-primary"
}`}
>

2
apps/app/pages/projects/[projectId]/cycles/[cycleId].tsx
View File

@ -306,7 +306,7 @@ const SingleCycle: React.FC = () => {
leaveFrom="opacity-100 translate-y-0"
leaveTo="opacity-0 translate-y-1"
>
<Popover.Panel className="absolute right-0 z-10 mt-1 w-screen max-w-xs transform p-3 bg-white rounded-lg shadow-lg overflow-hidden">
<Popover.Panel className="absolute right-0 z-20 mt-1 w-screen max-w-xs transform p-3 bg-white rounded-lg shadow-lg overflow-hidden">
<div className="relative flex flex-col gap-1 gap-y-4">
<div className="flex justify-between items-center">
<h4 className="text-sm text-gray-600">Group by</h4>

15
apps/app/pages/projects/[projectId]/settings/control.tsx
View File

@ -15,7 +15,7 @@ import useUser from "lib/hooks/useUser";
// headless ui
import { Listbox, Transition } from "@headlessui/react";
// ui
import { Button } from "ui";
import { BreadcrumbItem, Breadcrumbs, Button } from "ui";
// icons
import { CheckIcon, ChevronDownIcon } from "@heroicons/react/24/outline";
// types
@ -101,7 +101,18 @@ const ControlSettings = () => {
}, [projectDetails, reset]);
return (
<SettingsLayout type="project" noHeader>
<SettingsLayout
type="project"
breadcrumbs={
<Breadcrumbs>
<BreadcrumbItem
title={`${activeProject?.name ?? "Project"}`}
link={`/projects/${activeProject?.id}/issues`}
/>
<BreadcrumbItem title="Control Settings" />
</Breadcrumbs>
}
>
<form onSubmit={handleSubmit(onSubmit)}>
<div className="space-y-8">
<div>

15
apps/app/pages/projects/[projectId]/settings/index.tsx
View File

@ -12,7 +12,7 @@ import projectService from "lib/services/project.service";
import useUser from "lib/hooks/useUser";
import useToast from "lib/hooks/useToast";
// ui
import { Button, EmojiIconPicker, Input, Select, TextArea } from "ui";
import { BreadcrumbItem, Breadcrumbs, Button, EmojiIconPicker, Input, Select, TextArea } from "ui";
// types
import { IProject, IWorkspace } from "types";
// fetch-keys
@ -116,7 +116,18 @@ const GeneralSettings = () => {
}, [projectDetails, reset]);
return (
<SettingsLayout type="project" noHeader>
<SettingsLayout
type="project"
breadcrumbs={
<Breadcrumbs>
<BreadcrumbItem
title={`${activeProject?.name ?? "Project"}`}
link={`/projects/${activeProject?.id}/issues`}
/>
<BreadcrumbItem title="General Settings" />
</Breadcrumbs>
}
>
<form onSubmit={handleSubmit(onSubmit)}>
<div className="space-y-8">
<div>

15
apps/app/pages/projects/[projectId]/settings/labels.tsx
View File

@ -17,7 +17,7 @@ import SingleLabel from "components/project/settings/single-label";
// headless ui
import { Popover, Transition } from "@headlessui/react";
// ui
import { Button, Input, Spinner } from "ui";
import { BreadcrumbItem, Breadcrumbs, Button, Input, Spinner } from "ui";
// icons
import { PlusIcon } from "@heroicons/react/24/outline";
// fetch-keys
@ -103,7 +103,18 @@ const LabelsSettings = () => {
};
return (
<SettingsLayout type="project" noHeader>
<SettingsLayout
type="project"
breadcrumbs={
<Breadcrumbs>
<BreadcrumbItem
title={`${activeProject?.name ?? "Project"}`}
link={`/projects/${activeProject?.id}/issues`}
/>
<BreadcrumbItem title="Labels Settings" />
</Breadcrumbs>
}
>
<section className="space-y-8">
<div>
<h3 className="text-3xl font-bold leading-6 text-gray-900">Labels</h3>

15
apps/app/pages/projects/[projectId]/settings/members.tsx
View File

@ -15,7 +15,7 @@ import SettingsLayout from "layouts/settings-layout";
import ConfirmProjectMemberRemove from "components/project/confirm-project-member-remove";
import SendProjectInvitationModal from "components/project/send-project-invitation-modal";
// ui
import { Button, CustomListbox, CustomMenu, Spinner } from "ui";
import { BreadcrumbItem, Breadcrumbs, Button, CustomListbox, CustomMenu, Spinner } from "ui";
// icons
import { PlusIcon } from "@heroicons/react/24/outline";
// fetch-keys
@ -128,7 +128,18 @@ const MembersSettings = () => {
setIsOpen={setInviteModal}
members={members}
/>
<SettingsLayout type="project" noHeader>
<SettingsLayout
type="project"
breadcrumbs={
<Breadcrumbs>
<BreadcrumbItem
title={`${activeProject?.name ?? "Project"}`}
link={`/projects/${activeProject?.id}/issues`}
/>
<BreadcrumbItem title="Members Settings" />
</Breadcrumbs>
}
>
<section className="space-y-8">
<div>
<h3 className="text-3xl font-bold leading-6 text-gray-900">Members</h3>

15
apps/app/pages/projects/[projectId]/settings/states.tsx
View File

@ -11,7 +11,7 @@ import {
StateGroup,
} from "components/project/issues/BoardView/state/create-update-state-inline";
// ui
import { Spinner } from "ui";
import { BreadcrumbItem, Breadcrumbs, Spinner } from "ui";
// icons
import { PencilSquareIcon, PlusIcon, TrashIcon } from "@heroicons/react/24/outline";
// types
@ -37,7 +37,18 @@ const StatesSettings = () => {
data={states?.find((state) => state.id === selectDeleteState) ?? null}
onClose={() => setSelectDeleteState(null)}
/>
<SettingsLayout type="project" noHeader>
<SettingsLayout
type="project"
breadcrumbs={
<Breadcrumbs>
<BreadcrumbItem
title={`${activeProject?.name ?? "Project"}`}
link={`/projects/${activeProject?.id}/issues`}
/>
<BreadcrumbItem title="States Settings" />
</Breadcrumbs>
}
>
<div className="space-y-8">
<div>
<h3 className="text-3xl font-bold leading-6 text-gray-900">States</h3>