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

[WEB-5614] fix: new design system consistency (#8351)

Browse source 
* chore: tooltip enhancements

* chore: project card enhancements

* chore: work item card enhancements

* chore: update component styles and class names for consistency across the application

---------

Co-authored-by: Anmol Singh Bhatia <anmolsinghbhatia@plane.so>
This commit is contained in:
Jayash Tripathy 2025-12-17 13:32:29 +05:30 • committed by GitHub
parent df710e00dc
commit 88f5a063d6
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
23 changed files with 98 additions and 61 deletions
Download patch file Download diff file Expand all files Collapse all files

2
packages/propel/src/dialog/root.tsx
View file

@ -36,7 +36,7 @@ export interface DialogTitleProps extends React.ComponentProps<typeof BaseDialog
// Constants
const OVERLAY_CLASSNAME = cn("fixed inset-0 z-backdrop bg-backdrop");
const BASE_CLASSNAME = "relative text-left bg-surface-1 rounded-lg shadow-md w-full z-modal";
const BASE_CLASSNAME = "relative text-left bg-surface-1 rounded-lg shadow-md w-full z-modal border border-subtle";
// Utility functions
const getPositionClassNames = (position: DialogPosition) =>

6
packages/propel/src/input/input.tsx
View file

@ -29,10 +29,10 @@ const Input = React.forwardRef(function Input(props: InputProps, ref: React.Forw
type={type}
name={name}
className={cn(
"block rounded-md bg-transparent text-13 placeholder-custom-text-400 focus:outline-none",
"block rounded-md bg-layer-1 text-13 placeholder-tertiary border-subtle-1 focus:outline-none",
{
"rounded-md border-[0.5px] border-subtle": mode === "primary",
"rounded-sm border-none bg-transparent ring-0 transition-all focus:ring-1 focus:ring-custom-primary":
"rounded-md border-[0.5px]": mode === "primary",
"rounded-sm border-none bg-transparent ring-0 transition-all focus:ring-1 focus:ring-accent-strong":
mode === "transparent",
"rounded-sm border-none bg-transparent ring-0": mode === "true-transparent",
"border-red-500": hasError,

2
packages/propel/src/tabs/tabs.tsx
View file

@ -40,7 +40,7 @@ const TabsRoot = React.forwardRef(function TabsRoot(
const TabsList = React.forwardRef(function TabsList(
{
className,
background = "layer-1",
background = "layer-2",
...props
}: React.ComponentProps<typeof TabsPrimitive.List> & {
background?: BackgroundVariant;

12
packages/propel/src/tooltip/root.tsx
View file

@ -61,8 +61,16 @@ export function Tooltip(props: ITooltipProps) {
align={finalAlign}
render={
<BaseTooltip.Popup>
{tooltipHeading && <div className="text-caption-md-medium text-primary">{tooltipHeading}</div>}
{tooltipContent && <div className="mt-1 text-caption-sm-regular text-secondary">{tooltipContent}</div>}
{tooltipHeading && <p className="text-caption-md-medium text-primary">{tooltipHeading}</p>}
{tooltipContent && (
<p
className={cn("text-caption-sm-regular text-secondary", {
"mt-1": tooltipHeading && tooltipHeading !== "",
})}
>
{tooltipContent}
</p>
)}
</BaseTooltip.Popup>
}
/>