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

style: auth screens (#1531)

Browse source 
* chore: invitations empty state

* style: new auth screens

* chore: update typography

* chore: update border colors

* chore: resend code text
This commit is contained in:
Aaryan Khandelwal 2023-07-17 13:00:44 +05:30 • committed by GitHub
parent da6ecd439c
commit 5fadf53580
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
181 changed files with 682 additions and 645 deletions
Download patch file Download diff file Expand all files Collapse all files

4
apps/app/pages/[workspaceSlug]/analytics.tsx
View file

@ -96,12 +96,12 @@ const Analytics = () => {
projects.length > 0 ? (
<div className="h-full flex flex-col overflow-hidden bg-custom-background-100">
<Tab.Group as={Fragment}>
<Tab.List as="div" className="space-x-2 border-b border-custom-border-100 px-5 py-3">
<Tab.List as="div" className="space-x-2 border-b border-custom-border-300 px-5 py-3">
{tabsList.map((tab) => (
<Tab
key={tab}
className={({ selected }) =>
`rounded-3xl border border-custom-border-100 px-4 py-2 text-xs hover:bg-custom-background-80 ${
`rounded-3xl border border-custom-border-300 px-4 py-2 text-xs hover:bg-custom-background-80 ${
selected ? "bg-custom-background-80" : ""
}`
}

6
apps/app/pages/[workspaceSlug]/index.tsx
View file

@ -93,21 +93,21 @@ const WorkspacePage: NextPage = () => {
projects.length > 0 ? (
<div className="p-8">
<div className="flex flex-col gap-8">
<div className="text-custom-text-200 flex flex-col justify-between gap-x-2 gap-y-6 rounded-lg border border-custom-border-100 bg-custom-background-100 px-4 py-6 md:flex-row md:items-center md:py-3">
<div className="text-custom-text-200 flex flex-col justify-between gap-x-2 gap-y-6 rounded-lg border border-custom-border-300 bg-custom-background-100 px-4 py-6 md:flex-row md:items-center md:py-3">
<p className="font-semibold">
Plane is open source, support us by starring us on GitHub.
</p>
<div className="flex items-center gap-2">
<button
onClick={() => setIsProductUpdatesModalOpen(true)}
className="rounded-md border-2 border-custom-border-100 px-3 py-1.5 text-sm font-medium duration-300"
className="rounded-md border-2 border-custom-border-300 px-3 py-1.5 text-sm font-medium duration-300"
>
{`What's New?`}
</button>
<a
href="https://github.com/makeplane/plane"
target="_blank"
className="rounded-md border-2 border-custom-border-100 px-3 py-1.5 text-sm font-medium duration-300"
className="rounded-md border-2 border-custom-border-300 px-3 py-1.5 text-sm font-medium duration-300"
rel="noopener noreferrer"
>
Star us on GitHub

4
apps/app/pages/[workspaceSlug]/me/my-issues.tsx
View file

@ -50,7 +50,7 @@ const MyIssuesPage: NextPage = () => {
{({ open }) => (
<>
<Popover.Button
className={`group flex items-center gap-2 rounded-md border border-custom-border-100 bg-transparent px-3 py-1.5 text-xs hover:bg-custom-background-90 hover:text-custom-text-100 focus:outline-none ${
className={`group flex items-center gap-2 rounded-md border border-custom-border-300 bg-transparent px-3 py-1.5 text-xs hover:bg-custom-background-90 hover:text-custom-text-100 focus:outline-none ${
open ? "bg-custom-background-90 text-custom-text-100" : "text-custom-text-200"
}`}
>
@ -81,7 +81,7 @@ const MyIssuesPage: NextPage = () => {
className={`rounded border px-2 py-1 text-xs capitalize ${
properties[key as keyof Properties]
? "border-custom-primary bg-custom-primary text-white"
: "border-custom-border-100"
: "border-custom-border-300"
}`}
onClick={() => setProperties(key as keyof Properties)}
>

4
apps/app/pages/[workspaceSlug]/projects/[projectId]/archived-issues/[archivedIssueId].tsx
View file

@ -170,7 +170,7 @@ const ArchivedIssueDetailsPage: NextPage = () => {
</button>
</div>
)}
<div className="space-y-5 divide-y-2 divide-custom-border-100 opacity-60">
<div className="space-y-5 divide-y-2 divide-custom-border-300 opacity-60">
<IssueMainContent
issueDetails={issueDetails}
submitChanges={submitChanges}
@ -178,7 +178,7 @@ const ArchivedIssueDetailsPage: NextPage = () => {
/>
</div>
</div>
<div className="w-1/3 space-y-5 border-l border-custom-border-100 p-5">
<div className="w-1/3 space-y-5 border-l border-custom-border-300 p-5">
<IssueDetailsSidebar
control={control}
issueDetail={issueDetails}

4
apps/app/pages/[workspaceSlug]/projects/[projectId]/archived-issues/index.tsx
View file

@ -55,11 +55,11 @@ const ProjectArchivedIssues: NextPage = () => {
}
>
<div className="h-full w-full flex flex-col">
<div className="flex items-center ga-1 px-4 py-2.5 shadow-sm border-b border-custom-border-100">
<div className="flex items-center ga-1 px-4 py-2.5 shadow-sm border-b border-custom-border-300">
<button
type="button"
onClick={() => router.push(`/${workspaceSlug}/projects/${projectId}/issues/`)}
className="flex items-center gap-1.5 rounded-full border border-custom-border-100 px-3 py-1.5 text-xs"
className="flex items-center gap-1.5 rounded-full border border-custom-border-300 px-3 py-1.5 text-xs"
>
<Icon iconName="archive" className="text-base" />
<span>Archived Issues</span>

2
apps/app/pages/[workspaceSlug]/projects/[projectId]/cycles/index.tsx
View file

@ -177,7 +177,7 @@ const ProjectCycles: NextPage = () => {
`rounded-3xl border px-6 py-1 outline-none ${
selected
? "border-custom-primary bg-custom-primary text-white font-medium"
: "border-custom-border-100 bg-custom-background-100 hover:bg-custom-background-80"
: "border-custom-border-300 bg-custom-background-100 hover:bg-custom-background-80"
}`
}
>

2
apps/app/pages/[workspaceSlug]/projects/[projectId]/inbox/[inboxId].tsx
View file

@ -52,7 +52,7 @@ const ProjectInbox: NextPage = () => {
>
<div className="flex flex-col h-full">
<InboxActionHeader />
<div className="grid grid-cols-4 flex-1 divide-x divide-custom-border-100 overflow-hidden">
<div className="grid grid-cols-4 flex-1 divide-x divide-custom-border-300 overflow-hidden">
<IssuesListSidebar />
<div className="col-span-3 h-full overflow-auto">
<InboxMainContent />

4
apps/app/pages/[workspaceSlug]/projects/[projectId]/issues/[issueId].tsx
View file

@ -120,10 +120,10 @@ const IssueDetailsPage: NextPage = () => {
>
{issueDetails && projectId ? (
<div className="flex h-full">
<div className="w-2/3 space-y-5 divide-y-2 divide-custom-border-100 p-5">
<div className="w-2/3 space-y-5 divide-y-2 divide-custom-border-300 p-5">
<IssueMainContent issueDetails={issueDetails} submitChanges={submitChanges} />
</div>
<div className="w-1/3 space-y-5 border-l border-custom-border-100 p-5">
<div className="w-1/3 space-y-5 border-l border-custom-border-300 p-5">
<IssueDetailsSidebar
control={control}
issueDetail={issueDetails}

2
apps/app/pages/[workspaceSlug]/projects/[projectId]/pages/[pageId].tsx
View file

@ -337,7 +337,7 @@ const SinglePage: NextPage = () => {
return (
<div
key={label.id}
className="group flex cursor-pointer items-center gap-1 rounded-2xl border border-custom-border-100 px-2 py-0.5 text-xs hover:border-red-500 hover:bg-red-50"
className="group flex cursor-pointer items-center gap-1 rounded-2xl border border-custom-border-300 px-2 py-0.5 text-xs hover:border-red-500 hover:bg-red-50"
onClick={() => {
const updatedLabels = pageDetails.labels.filter((l) => l !== labelId);
partialUpdatePage({ labels_list: updatedLabels });

2
apps/app/pages/[workspaceSlug]/projects/[projectId]/pages/index.tsx
View file

@ -177,7 +177,7 @@ const ProjectPages: NextPage = () => {
`rounded-full border px-5 py-1.5 text-sm outline-none ${
selected
? "border-custom-primary bg-custom-primary text-white"
: "border-custom-border-100 bg-custom-background-100 hover:bg-custom-background-90"
: "border-custom-border-300 bg-custom-background-100 hover:bg-custom-background-90"
}`
}
>

2
apps/app/pages/[workspaceSlug]/projects/[projectId]/settings/estimates.tsx
View file

@ -146,7 +146,7 @@ const EstimatesSettings: NextPage = () => {
</section>
{estimatesList ? (
estimatesList.length > 0 ? (
<section className="h-full mt-5 divide-y divide-custom-border-100 rounded-xl border border-custom-border-100 bg-custom-background-100 px-6 overflow-y-auto">
<section className="h-full mt-5 divide-y divide-custom-border-300 rounded-xl border border-custom-border-300 bg-custom-background-100 px-6 overflow-y-auto">
{estimatesList.map((estimate) => (
<SingleEstimate
key={estimate.id}

2
apps/app/pages/[workspaceSlug]/projects/[projectId]/settings/features.tsx
View file

@ -154,7 +154,7 @@ const FeaturesSettings: NextPage = () => {
{featuresList.map((feature) => (
<div
key={feature.property}
className="flex items-center justify-between gap-x-8 gap-y-2 rounded-[10px] border border-custom-border-100 bg-custom-background-100 p-5"
className="flex items-center justify-between gap-x-8 gap-y-2 rounded-[10px] border border-custom-border-300 bg-custom-background-100 p-5"
>
<div className="flex items-start gap-3">
{feature.icon}

2
apps/app/pages/[workspaceSlug]/projects/[projectId]/settings/index.tsx
View file

@ -261,7 +261,7 @@ const GeneralSettings: NextPage = () => {
</div>
<div className="col-span-12 sm:col-span-6">
{watch("cover_image") ? (
<div className="h-32 w-full rounded border border-custom-border-100 p-1">
<div className="h-32 w-full rounded border border-custom-border-300 p-1">
<div className="relative h-full w-full rounded">
<img
src={watch("cover_image")!}

2
apps/app/pages/[workspaceSlug]/projects/[projectId]/settings/members.tsx
View file

@ -168,7 +168,7 @@ const MembersSettings: NextPage = () => {
<Loader.Item height="40px" />
</Loader>
) : (
<div className="divide-y divide-custom-border-100 rounded-[10px] border border-custom-border-100 bg-custom-background-100 px-6">
<div className="divide-y divide-custom-border-300 rounded-[10px] border border-custom-border-300 bg-custom-background-100 px-6">
{members.length > 0
? members.map((member) => (
<div key={member.id} className="flex items-center justify-between py-6">

4
apps/app/pages/[workspaceSlug]/projects/[projectId]/settings/states.tsx
View file

@ -95,7 +95,7 @@ const StatesSettings: NextPage = () => {
Add
</button>
</div>
<div className="divide-y divide-custom-border-100 rounded-[10px] border border-custom-border-100">
<div className="divide-y divide-custom-border-300 rounded-[10px] border border-custom-border-300">
{key === activeGroup && (
<CreateUpdateStateInline
groupLength={orderedStateGroups[key].length}
@ -121,7 +121,7 @@ const StatesSettings: NextPage = () => {
/>
) : (
<div
className="border-b border-custom-border-100 last:border-b-0"
className="border-b border-custom-border-300 last:border-b-0"
key={state.id}
>
<CreateUpdateStateInline

2
apps/app/pages/[workspaceSlug]/projects/[projectId]/views/index.tsx
View file

@ -102,7 +102,7 @@ const ProjectViews: NextPage = () => {
views.length > 0 ? (
<div className="space-y-5 p-8">
<h3 className="text-2xl font-semibold text-custom-text-100">Views</h3>
<div className="divide-y divide-custom-border-100 rounded-[10px] border border-custom-border-100">
<div className="divide-y divide-custom-border-300 rounded-[10px] border border-custom-border-300">
{views.map((view) => (
<SingleViewItem
key={view.id}

2
apps/app/pages/[workspaceSlug]/settings/billing.tsx
View file

@ -48,7 +48,7 @@ const BillingSettings: NextPage = () => {
</div>
<div className="space-y-8 md:w-2/3">
<div>
<div className="w-80 rounded-md border border-custom-border-100 bg-custom-background-100 p-4 text-center">
<div className="w-80 rounded-md border border-custom-border-300 bg-custom-background-100 p-4 text-center">
<h4 className="text-md mb-1 leading-6">Payment due</h4>
<h2 className="text-3xl font-extrabold">--</h2>
</div>

2
apps/app/pages/[workspaceSlug]/settings/members.tsx
View file

@ -169,7 +169,7 @@ const MembersSettings: NextPage = () => {
<Loader.Item height="40px" />
</Loader>
) : (
<div className="divide-y divide-custom-border-100 rounded-[10px] border border-custom-border-100 bg-custom-background-100 px-6">
<div className="divide-y divide-custom-border-300 rounded-[10px] border border-custom-border-300 bg-custom-background-100 px-6">
{members.length > 0
? members.map((member) => (
<div key={member.id} className="flex items-center justify-between py-6">