binarybeach/bb-plane-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

[WEB-2273] Chore: page alignments (#5505)

Browse source 
* chore: headers + common containers

* fix: filters code splitting

* fix: home header

* fix: header changes

* chore: page alignments fixed

* fix: uncommented filters

* fix: used enums

* fix: cards + filters

* fix: enum changes

* fix: reverted package changes

* fix: reverted package changes

* fix: Card + tags seperated + naming fixed

* fix: card + tags seperated + naming fixed

* fix: mobile headers fixed partially

* fix: build errors + minor css

* fix: checkbox spacing

* fix: review changes

* fix: lint errors

* fix: minor review changes
This commit is contained in:
Akshita Goyal 2024-09-05 12:16:24 +05:30 • committed by GitHub
parent c78b2344b8
commit 87dbb9b888
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
181 changed files with 1323 additions and 1122 deletions
Download patch file Download diff file Expand all files Collapse all files

2
web/app/[workspaceSlug]/(projects)/settings/api-tokens/page.tsx
View file

@ -54,7 +54,7 @@ const ApiTokensPage = observer(() => {
<>
<PageHead title={pageTitle} />
<CreateApiTokenModal isOpen={isCreateTokenModalOpen} onClose={() => setIsCreateTokenModalOpen(false)} />
<section className="w-full overflow-y-auto md:pr-9 pr-4">
<section className="w-full overflow-y-auto">
{tokens.length > 0 ? (
<>
<div className="flex items-center justify-between border-b border-custom-border-200 py-3.5">

4
web/app/[workspaceSlug]/(projects)/settings/exports/page.tsx
View file

@ -31,11 +31,11 @@ const ExportsPage = observer(() => {
<>
<PageHead title={pageTitle} />
<div
className={cn("w-full overflow-y-auto md:pr-9 pr-4", {
className={cn("w-full overflow-y-auto", {
"opacity-60": !canPerformWorkspaceMemberActions,
})}
>
<div className="flex items-center border-b border-custom-border-100 py-3.5">
<div className="flex items-center border-b border-custom-border-100 pb-3.5">
<h3 className="text-xl font-medium">Exports</h3>
</div>
<ExportGuide />

10
web/app/[workspaceSlug]/(projects)/settings/header.tsx
View file

@ -4,7 +4,7 @@ import { FC } from "react";
import { observer } from "mobx-react";
import { Settings } from "lucide-react";
// ui
import { Breadcrumbs, CustomHeader } from "@plane/ui";
import { Breadcrumbs, Header } from "@plane/ui";
// components
import { BreadcrumbLink } from "@/components/common";
// hooks
@ -14,8 +14,8 @@ export const WorkspaceSettingHeader: FC = observer(() => {
const { currentWorkspace, loader } = useWorkspace();
return (
<CustomHeader>
<CustomHeader.LeftItem>
<Header>
<Header.LeftItem>
<Breadcrumbs isLoading={loader}>
<Breadcrumbs.BreadcrumbItem
type="text"
@ -29,7 +29,7 @@ export const WorkspaceSettingHeader: FC = observer(() => {
/>
<Breadcrumbs.BreadcrumbItem type="text" link={<BreadcrumbLink label="Settings" />} />
</Breadcrumbs>
</CustomHeader.LeftItem>
</CustomHeader>
</Header.LeftItem>
</Header>
);
});

4
web/app/[workspaceSlug]/(projects)/settings/imports/page.tsx
View file

@ -33,8 +33,8 @@ const ImportsPage = observer(() => {
return (
<>
<PageHead title={pageTitle} />
<section className="w-full overflow-y-auto py-8 pr-9">
<div className="flex items-center border-b border-custom-border-100 py-3.5">
<section className="w-full overflow-y-auto">
<div className="flex items-center border-b border-custom-border-100 pb-3.5">
<h3 className="text-xl font-medium">Imports</h3>
</div>
<IntegrationGuide />

8
web/app/[workspaceSlug]/(projects)/settings/integrations/page.tsx
View file

@ -1,4 +1,4 @@
"use client"
"use client";
import { observer } from "mobx-react";
import { useParams } from "next/navigation";
import useSWR from "swr";
@ -33,7 +33,7 @@ const WorkspaceIntegrationsPage = observer(() => {
return (
<>
<PageHead title={pageTitle} />
<div className="mt-10 flex h-full w-full justify-center p-4">
<div className="mt-10 flex h-full w-full justify-center">
<p className="text-sm text-custom-text-300">You are not authorized to access this page.</p>
</div>
</>
@ -46,7 +46,7 @@ const WorkspaceIntegrationsPage = observer(() => {
return (
<>
<PageHead title={pageTitle} />
<section className="w-full overflow-y-auto py-8 pr-9">
<section className="w-full overflow-y-auto">
<IntegrationAndImportExportBanner bannerName="Integrations" />
<div>
{appIntegrations ? (
@ -62,4 +62,4 @@ const WorkspaceIntegrationsPage = observer(() => {
);
});
export default WorkspaceIntegrationsPage;
export default WorkspaceIntegrationsPage;

21
web/app/[workspaceSlug]/(projects)/settings/layout.tsx
View file

@ -2,7 +2,8 @@
import { ReactNode } from "react";
// components
import { AppHeader, ContentWrapper } from "@/components/core";
import { ContentWrapper } from "@plane/ui";
import { AppHeader } from "@/components/core";
// local components
import { WorkspaceSettingHeader } from "./header";
import { MobileWorkspaceSettingsTabs } from "./mobile-header-tabs";
@ -18,17 +19,13 @@ export default function WorkspaceSettingLayout(props: IWorkspaceSettingLayout) {
return (
<>
<AppHeader header={<WorkspaceSettingHeader />} />
<ContentWrapper>
<div className="inset-y-0 z-20 flex h-full w-full gap-2">
<div className="w-80 flex-shrink-0 overflow-y-hidden pt-8 sm:hidden hidden md:block lg:block">
<WorkspaceSettingsSidebar />
</div>
<div className="flex flex-col relative w-full overflow-hidden">
<MobileWorkspaceSettingsTabs />
<div className="w-full pl-4 md:pl-0 md:py-8 py-2 overflow-x-hidden overflow-y-scroll vertical-scrollbar scrollbar-md">
{children}
</div>
</div>
<MobileWorkspaceSettingsTabs />
<ContentWrapper className="flex-row inset-y-0 gap-4">
<div className="w-80 flex-shrink-0 overflow-y-hidden sm:hidden hidden md:block lg:block">
<WorkspaceSettingsSidebar />
</div>
<div className="flex flex-col relative w-full overflow-hidden">
<div className="w-full overflow-x-hidden overflow-y-scroll vertical-scrollbar scrollbar-md">{children}</div>
</div>
</ContentWrapper>
</>

4
web/app/[workspaceSlug]/(projects)/settings/members/page.tsx
View file

@ -99,11 +99,11 @@ const WorkspaceMembersSettingsPage = observer(() => {
onSubmit={handleWorkspaceInvite}
/>
<section
className={cn("w-full overflow-y-auto md:pr-9 pr-4", {
className={cn("w-full overflow-y-auto", {
"opacity-60": !canPerformWorkspaceMemberActions,
})}
>
<div className="flex items-center justify-between gap-4 py-3.5">
<div className="flex items-center justify-between gap-4 pb-3.5">
<h4 className="text-xl font-medium">Members</h4>
<div className="ml-auto flex items-center gap-1.5 rounded-md border border-custom-border-200 bg-custom-background-100 px-2.5 py-1.5">
<Search className="h-3.5 w-3.5 text-custom-text-400" />

2
web/app/[workspaceSlug]/(projects)/settings/sidebar.tsx
View file

@ -28,7 +28,7 @@ export const WorkspaceSettingsSidebar = observer(() => {
const workspaceMemberInfo = currentWorkspaceRole || EUserWorkspaceRoles.GUEST;
return (
<div className="flex w-80 flex-col gap-6 px-5">
<div className="flex w-80 flex-col gap-6">
<div className="flex flex-col gap-2">
<span className="text-xs font-semibold text-custom-sidebar-text-400">SETTINGS</span>
<div className="flex w-full flex-col gap-1">

2
web/app/[workspaceSlug]/(projects)/settings/webhooks/page.tsx
View file

@ -51,7 +51,7 @@ const WebhooksListPage = observer(() => {
return (
<>
<PageHead title={pageTitle} />
<div className="w-full overflow-y-auto md:pr-9 pr-4">
<div className="w-full overflow-y-auto">
<CreateWebhookModal
createWebhook={createWebhook}
clearSecretKey={clearSecretKey}