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

feat: themes (#902)

Browse source 
* chore: add next theme and initial setup

* chore: add dark mode colors to layouts

* chore: user general setting page theming

* chore: dashboard theming

* chore: project page theming

* chore: workspace setting page theming

* chore: my issue page theming

* chore: cmdk theming

* chore: change hardcode bg and text color to theme

* chore: change color name according to the design

* style: fix card in the dashboard

* style: fix merge conflict design issues

* style: add light high contrast and dark high contrast

* style: fix cmd k menu color and selection

* feat: change theme from cmdk menu

* chore: add multiple theme field to custom theme

* chore: removed custom theming

* fix: build error

---------

Co-authored-by: Saheb Giri <iamsahebgiri@gmail.com>
This commit is contained in:
Aaryan Khandelwal 2023-04-20 13:41:24 +05:30 • committed by GitHub
parent 9f04933957
commit 3c2f5d12ed
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
191 changed files with 1550 additions and 880 deletions
Download patch file Download diff file Expand all files Collapse all files

16
apps/app/components/modules/single-module-card.tsx
View file

@ -122,14 +122,14 @@ export const SingleModuleCard: React.FC<Props> = ({ module, handleEditModule })
setIsOpen={setModuleDeleteModal}
data={module}
/>
<div className="flex flex-col divide-y overflow-hidden rounded-[10px] border bg-white text-xs">
<div className="flex flex-col divide-y divide-brand-base overflow-hidden rounded-[10px] border border-brand-base bg-brand-surface-2 text-xs">
<div className="p-4">
<div className="flex w-full flex-col gap-5">
<div className="flex items-start justify-between gap-2">
<Tooltip tooltipContent={module.name} position="top-left">
<Link href={`/${workspaceSlug}/projects/${module.project}/modules/${module.id}`}>
<a className="w-auto max-w-[calc(100%-9rem)]">
<h3 className="truncate break-all text-lg font-semibold text-black">
<h3 className="truncate break-all text-lg font-semibold text-brand-base">
{truncateText(module.name, 75)}
</h3>
</a>
@ -137,7 +137,7 @@ export const SingleModuleCard: React.FC<Props> = ({ module, handleEditModule })
</Tooltip>
<div className="flex items-center gap-1">
<div className="mr-2 flex whitespace-nowrap rounded bg-gray-100 px-2.5 py-2">
<div className="mr-2 flex whitespace-nowrap rounded bg-brand-surface-1 px-2.5 py-2">
<span className="capitalize">{module?.status?.replace("-", " ")}</span>
</div>
{module.is_favorite ? (
@ -174,12 +174,12 @@ export const SingleModuleCard: React.FC<Props> = ({ module, handleEditModule })
</div>
<div className="grid grid-cols-2 gap-4">
<div className="flex items-start gap-1">
<CalendarMonthIcon className="h-4 w-4 text-gray-900" />
<CalendarMonthIcon className="h-4 w-4 text-brand-base" />
<span className="text-gray-400">Start:</span>
<span>{renderShortDateWithYearFormat(startDate)}</span>
</div>
<div className="flex items-start gap-1">
<TargetIcon className="h-4 w-4 text-gray-900" />
<TargetIcon className="h-4 w-4 text-brand-base" />
<span className="text-gray-400">End:</span>
<span>{renderShortDateWithYearFormat(endDate)}</span>
</div>
@ -187,7 +187,7 @@ export const SingleModuleCard: React.FC<Props> = ({ module, handleEditModule })
</div>
</div>
<div className="flex h-20 flex-col items-end">
<div className="flex w-full items-center justify-between gap-2 justify-self-end bg-gray-100 p-4">
<div className="flex w-full items-center justify-between gap-2 justify-self-end bg-brand-surface-1 p-4">
<span>Progress</span>
<div className="bar relative h-1 w-full rounded bg-gray-300">
<div
@ -199,10 +199,10 @@ export const SingleModuleCard: React.FC<Props> = ({ module, handleEditModule })
</div>
<span>{isNaN(completionPercentage) ? 0 : completionPercentage.toFixed(0)}%</span>
</div>
<div className="item-center flex h-full w-full justify-between bg-gray-100 px-4 pb-4">
<div className="item-center flex h-full w-full justify-between bg-brand-surface-1 px-4 pb-4">
<p className="text-[#858E96]">
Last updated:
<span className="font-medium text-black">
<span className="font-medium text-brand-base">
{renderShortDateWithYearFormat(lastUpdated)}
</span>
</p>