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

2
apps/app/components/analytics/custom-analytics/create-update-analytics-modal.tsx
View file

@ -111,7 +111,7 @@ export const CreateUpdateAnalyticsModal: React.FC<Props> = ({ isOpen, handleClos
leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
>
<Dialog.Panel className="relative transform rounded-lg border border-custom-border-100 bg-custom-background-100 px-4 pt-5 pb-4 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6">
<Dialog.Panel className="relative transform rounded-lg border border-custom-border-300 bg-custom-background-100 px-4 pt-5 pb-4 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-2xl sm:p-6">
<form onSubmit={handleSubmit(onSubmit)}>
<div>
<Dialog.Title

2
apps/app/components/analytics/custom-analytics/graph/custom-tooltip.tsx
View file

@ -31,7 +31,7 @@ export const CustomTooltip: React.FC<Props> = ({ datum, analytics, params }) =>
}
return (
<div className="flex items-center gap-2 rounded-md border border-custom-border-100 bg-custom-background-80 p-2 text-xs">
<div className="flex items-center gap-2 rounded-md border border-custom-border-300 bg-custom-background-80 p-2 text-xs">
<span
className="h-3 w-3 rounded"
style={{

2
apps/app/components/analytics/custom-analytics/sidebar.tsx
View file

@ -185,7 +185,7 @@ export const AnalyticsSidebar: React.FC<Props> = ({
<div
className={`px-5 py-2.5 flex items-center justify-between space-y-2 ${
fullScreen
? "border-l border-custom-border-100 md:h-full md:border-l md:border-custom-border-100 md:space-y-4 overflow-hidden md:flex-col md:items-start md:py-5"
? "border-l border-custom-border-300 md:h-full md:border-l md:border-custom-border-300 md:space-y-4 overflow-hidden md:flex-col md:items-start md:py-5"
: ""
}`}
>

8
apps/app/components/analytics/custom-analytics/table.tsx
View file

@ -37,9 +37,9 @@ export const AnalyticsTable: React.FC<Props> = ({ analytics, barGraphData, param
<div className="flow-root">
<div className="overflow-x-auto">
<div className="inline-block min-w-full align-middle">
<table className="min-w-full divide-y divide-custom-border-100 whitespace-nowrap border-y border-custom-border-100">
<table className="min-w-full divide-y divide-custom-border-300 whitespace-nowrap border-y border-custom-border-300">
<thead className="bg-custom-background-80">
<tr className="divide-x divide-custom-border-100 text-sm text-custom-text-100">
<tr className="divide-x divide-custom-border-300 text-sm text-custom-text-100">
<th scope="col" className="py-3 px-2.5 text-left font-medium">
{ANALYTICS_X_AXIS_VALUES.find((v) => v.value === params.x_axis)?.label}
</th>
@ -80,11 +80,11 @@ export const AnalyticsTable: React.FC<Props> = ({ analytics, barGraphData, param
)}
</tr>
</thead>
<tbody className="divide-y divide-custom-border-100">
<tbody className="divide-y divide-custom-border-300">
{barGraphData.data.map((item, index) => (
<tr
key={`table-row-${index}`}
className="divide-x divide-custom-border-100 text-xs text-custom-text-200"
className="divide-x divide-custom-border-300 text-xs text-custom-text-200"
>
<td
className={`flex items-center gap-2 whitespace-nowrap py-2 px-2.5 font-medium ${

6
apps/app/components/analytics/project-modal.tsx
View file

@ -155,7 +155,7 @@ export const AnalyticsProjectModal: React.FC<Props> = ({ isOpen, onClose }) => {
} ${isOpen ? "right-0" : "-right-full"} duration-300 transition-all`}
>
<div
className={`flex h-full flex-col overflow-hidden border-custom-border-100 bg-custom-background-100 text-left ${
className={`flex h-full flex-col overflow-hidden border-custom-border-300 bg-custom-background-100 text-left ${
fullScreen ? "rounded-lg border" : "border-l"
}`}
>
@ -186,12 +186,12 @@ export const AnalyticsProjectModal: React.FC<Props> = ({ isOpen, onClose }) => {
</div>
</div>
<Tab.Group as={Fragment}>
<Tab.List as="div" className="space-x-2 border-b border-custom-border-100 p-5 pt-0">
<Tab.List as="div" className="space-x-2 border-b border-custom-border-300 p-5 pt-0">
{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" : ""
}`
}

4
apps/app/components/analytics/scope-and-demand/demand.tsx
View file

@ -10,7 +10,7 @@ type Props = {
};
export const AnalyticsDemand: React.FC<Props> = ({ defaultAnalytics }) => (
<div className="space-y-3 rounded-[10px] border border-custom-border-100 p-3">
<div className="space-y-3 rounded-[10px] border border-custom-border-300 p-3">
<h5 className="text-xs text-red-500">DEMAND</h5>
<div>
<h4 className="text-custom-text-100 text-base font-medium">Total open tasks</h4>
@ -50,7 +50,7 @@ export const AnalyticsDemand: React.FC<Props> = ({ defaultAnalytics }) => (
);
})}
</div>
<div className="!mt-6 flex w-min items-center gap-2 whitespace-nowrap rounded-md border border-custom-border-100 bg-custom-background-80 p-2 text-xs">
<div className="!mt-6 flex w-min items-center gap-2 whitespace-nowrap rounded-md border border-custom-border-300 bg-custom-background-80 p-2 text-xs">
<p className="flex items-center gap-1 text-custom-text-200">
<PlayIcon className="h-4 w-4 -rotate-90" aria-hidden="true" />
<span>Estimate Demand:</span>

2
apps/app/components/analytics/scope-and-demand/leaderboard.tsx
View file

@ -10,7 +10,7 @@ type Props = {
};
export const AnalyticsLeaderboard: React.FC<Props> = ({ users, title }) => (
<div className="p-3 border border-custom-border-100 rounded-[10px]">
<div className="p-3 border border-custom-border-300 rounded-[10px]">
<h6 className="text-base font-medium">{title}</h6>
{users.length > 0 ? (
<div className="mt-3 space-y-3">

6
apps/app/components/analytics/scope-and-demand/scope.tsx
View file

@ -8,9 +8,9 @@ type Props = {
};
export const AnalyticsScope: React.FC<Props> = ({ defaultAnalytics }) => (
<div className="rounded-[10px] border border-custom-border-100">
<div className="rounded-[10px] border border-custom-border-300">
<h5 className="p-3 text-xs text-green-500">SCOPE</h5>
<div className="divide-y divide-custom-border-100">
<div className="divide-y divide-custom-border-300">
<div>
<h6 className="px-3 text-base font-medium">Pending issues</h6>
{defaultAnalytics.pending_issue_user.length > 0 ? (
@ -27,7 +27,7 @@ export const AnalyticsScope: React.FC<Props> = ({ defaultAnalytics }) => (
);
return (
<div className="rounded-md border border-custom-border-100 bg-custom-background-80 p-2 text-xs">
<div className="rounded-md border border-custom-border-300 bg-custom-background-80 p-2 text-xs">
<span className="font-medium text-custom-text-200">
{assignee
? assignee.assignees__first_name + " " + assignee.assignees__last_name

4
apps/app/components/analytics/scope-and-demand/year-wise-issues.tsx
View file

@ -15,7 +15,7 @@ export const AnalyticsYearWiseIssues: React.FC<Props> = ({ defaultAnalytics }) =
const quarterMonthsList = [startMonth, startMonth + 1, startMonth + 2];
return (
<div className="py-3 border border-custom-border-100 rounded-[10px]">
<div className="py-3 border border-custom-border-300 rounded-[10px]">
<h1 className="px-3 text-base font-medium">Issues closed in a year</h1>
{defaultAnalytics.issue_completed_month_wise.length > 0 ? (
<LineGraph
@ -43,7 +43,7 @@ export const AnalyticsYearWiseIssues: React.FC<Props> = ({ defaultAnalytics }) =
margin={{ top: 20 }}
enableSlices="x"
sliceTooltip={(datum) => (
<div className="rounded-md border border-custom-border-100 bg-custom-background-80 p-2 text-xs">
<div className="rounded-md border border-custom-border-300 bg-custom-background-80 p-2 text-xs">
{datum.slice.points[0].data.yFormatted}
<span className="text-custom-text-200"> issues closed in </span>
{datum.slice.points[0].data.xFormatted}