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

style: cycle and module theming (#923)

Browse Source 
* style: cycle theming

* style: module theming
This commit is contained in:
Anmol Singh Bhatia 2023-04-21 17:40:57 +05:30 committed by GitHub
parent 7f235739bd
commit e59137f6f2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 10 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
apps/app/components/cycles/single-cycle-card.tsx
View File

@ -271,13 +271,13 @@ export const SingleCycleCard: React.FC<TSingleStatProps> = ({
<div className="flex items-center justify-start gap-5"> <div className="flex items-center justify-start gap-5">
<div className="flex items-start gap-1 "> <div className="flex items-start gap-1 ">
<CalendarDaysIcon className="h-4 w-4 text-gray-900" /> <CalendarDaysIcon className="h-4 w-4 text-brand-base" />
<span className="text-gray-400">Start :</span> <span className="text-brand-secondary">Start :</span>
<span>{renderShortDateWithYearFormat(startDate)}</span> <span>{renderShortDateWithYearFormat(startDate)}</span>
</div> </div>
<div className="flex items-start gap-1 "> <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 className="text-brand-secondary">End :</span>
<span>{renderShortDateWithYearFormat(endDate)}</span> <span>{renderShortDateWithYearFormat(endDate)}</span>
</div> </div>
</div> </div>
@ -293,11 +293,11 @@ export const SingleCycleCard: React.FC<TSingleStatProps> = ({
alt={cycle.owned_by.first_name} alt={cycle.owned_by.first_name}
/> />
) : ( ) : (
<span className="flex h-5 w-5 items-center justify-center rounded-full bg-gray-800 capitalize text-white"> <span className="flex h-5 w-5 items-center justify-center rounded-full bg-brand-base capitalize bg-brand-secondary">
{cycle.owned_by.first_name.charAt(0)} {cycle.owned_by.first_name.charAt(0)}
</span> </span>
)} )}
<span className="text-gray-900">{cycle.owned_by.first_name}</span> <span className="text-brand-base">{cycle.owned_by.first_name}</span>
</div> </div>
<div className="flex items-center"> <div className="flex items-center">
{!isCompleted && ( {!isCompleted && (
@ -306,7 +306,7 @@ export const SingleCycleCard: React.FC<TSingleStatProps> = ({
e.preventDefault(); e.preventDefault();
handleEditCycle(); handleEditCycle();
}} }}
className="flex cursor-pointer items-center rounded p-1 duration-300 hover:bg-gray-100" className="flex cursor-pointer items-center rounded p-1 duration-300 hover:bg-brand-surface-1"
> >
<span> <span>
<PencilIcon className="h-4 w-4" /> <PencilIcon className="h-4 w-4" />

6
apps/app/components/modules/single-module-card.tsx
View File

@ -175,12 +175,12 @@ export const SingleModuleCard: React.FC<Props> = ({ module, handleEditModule })
<div className="grid grid-cols-2 gap-4"> <div className="grid grid-cols-2 gap-4">
<div className="flex items-start gap-1"> <div className="flex items-start gap-1">
<CalendarMonthIcon className="h-4 w-4 text-brand-base" /> <CalendarMonthIcon className="h-4 w-4 text-brand-base" />
<span className="text-gray-400">Start:</span> <span className="text-brand-secondary">Start:</span>
<span>{renderShortDateWithYearFormat(startDate)}</span> <span>{renderShortDateWithYearFormat(startDate)}</span>
</div> </div>
<div className="flex items-start gap-1"> <div className="flex items-start gap-1">
<TargetIcon className="h-4 w-4 text-brand-base" /> <TargetIcon className="h-4 w-4 text-brand-base" />
<span className="text-gray-400">End:</span> <span className="text-brand-secondary">End:</span>
<span>{renderShortDateWithYearFormat(endDate)}</span> <span>{renderShortDateWithYearFormat(endDate)}</span>
</div> </div>
</div> </div>
@ -189,7 +189,7 @@ export const SingleModuleCard: React.FC<Props> = ({ module, handleEditModule })
<div className="flex h-20 flex-col items-end"> <div className="flex h-20 flex-col items-end">
<div className="flex w-full items-center justify-between gap-2 justify-self-end bg-brand-surface-1 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> <span>Progress</span>
<div className="bar relative h-1 w-full rounded bg-gray-300"> <div className="bar relative h-1 w-full rounded bg-brand-surface-2">
<div <div
className="absolute top-0 left-0 h-1 rounded bg-green-500 duration-300" className="absolute top-0 left-0 h-1 rounded bg-green-500 duration-300"
style={{ style={{