Skip to content

[WEB-5614] chore: update component styles and class names for consistency across… #8376

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
pushya22 merged 1 commit into from
Dec 18, 2025
Merged

[WEB-5614] chore: update component styles and class names for consistency across… #8376

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 2 additions & 6 deletions apps/web/core/components/core/image-picker-popover.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import { Tab, Popover } from "@headlessui/react";
// plane imports
import { ACCEPTED_COVER_IMAGE_MIME_TYPES_FOR_REACT_DROPZONE, MAX_FILE_SIZE } from "@plane/constants";
import { useOutsideClickDetector } from "@plane/hooks";
import { Button } from "@plane/propel/button";
import { Button, getButtonStyling } from "@plane/propel/button";
import { TOAST_TYPE, setToast } from "@plane/propel/toast";
import { EFileAssetType } from "@plane/types";
import { Input, Loader } from "@plane/ui";
Expand Down Expand Up @@ -180,11 +180,7 @@ export const ImagePickerPopover = observer(function ImagePickerPopover(props: Pr

return (
<Popover className="relative z-19" ref={ref} tabIndex={tabIndex} onKeyDown={handleKeyDown}>
<Popover.Button
className="rounded-sm border border-strong bg-surface-1 px-2 py-1 text-11 text-secondary hover:text-primary"
onClick={handleOnClick}
disabled={disabled}
>
<Popover.Button className={getButtonStyling("secondary", "sm")} onClick={handleOnClick} disabled={disabled}>
{label}
</Popover.Button>

Expand Down
2 changes: 1 addition & 1 deletion apps/web/core/components/issues/issue-layouts/filters/header/layout-selection.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ export function LayoutSelection(props: Props) {
};

return (
<div className="flex items-center gap-1 rounded-sm bg-layer-3 p-1">
<div className="flex items-center gap-1 rounded-md bg-layer-3 p-1">
{ISSUE_LAYOUTS.filter((l) => layouts.includes(l.key)).map((layout) => (
<Tooltip key={layout.key} tooltipContent={t(layout.i18n_title)} isMobile={isMobile}>
<button
Expand Down
2 changes: 1 addition & 1 deletion apps/web/core/components/onboarding/create-workspace.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -266,7 +266,7 @@ export const CreateWorkspace = observer(function CreateWorkspace(props: Props) {
</span>
)
}
buttonClassName="!border-[0.5px] !border-strong !shadow-none !rounded-md"
buttonClassName="border border-subtle bg-layer-2 !shadow-none !rounded-md"
input
>
{ORGANIZATION_SIZE.map((item) => (
Expand Down
13 changes: 6 additions & 7 deletions apps/web/core/components/sidebar/add-button.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import { Button } from "@plane/propel/button";
import { cn } from "@plane/utils";

Copilot AI Dec 18, 2025

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The cn import from "@plane/utils" is no longer used after refactoring to use the Button component and should be removed.

Suggested change
import { cn } from "@plane/utils";

Copilot uses AI. Check for mistakes.

type Props = React.ComponentProps<"button"> & {
Expand All @@ -8,17 +9,15 @@ type Props = React.ComponentProps<"button"> & {
export function SidebarAddButton(props: Props) {
const { label, onClick, disabled, ...rest } = props;
return (
<button
type="button"
className={cn(
"flex-grow text-tertiary text-13 font-medium border-[0.5px] border-strong text-left rounded-md shadow-raised-100 h-8 px-2 flex items-center gap-1.5 transition-colors",
!disabled && "hover:bg-layer-transparent-hover"
)}
<Button
variant={"secondary"}
size={"xl"}
className="w-full justify-start"
onClick={onClick}
disabled={disabled}
{...rest}
>
{label}
</button>
</Button>
);
}
10 changes: 5 additions & 5 deletions apps/web/core/components/workspace/create-workspace-form.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -125,7 +125,7 @@ export const CreateWorkspaceForm = observer(function CreateWorkspaceForm(props:
}}
>
<div className="space-y-6 sm:space-y-7">
<div className="space-y-1 text-13">
<div className="flex flex-col gap-2 text-13">
<label htmlFor="workspaceName">
{t("workspace_creation.form.name.label")}
<span className="ml-0.5 text-red-500">*</span>
Expand Down Expand Up @@ -165,12 +165,12 @@ export const CreateWorkspaceForm = observer(function CreateWorkspaceForm(props:
<span className="text-11 text-red-500">{errors?.name?.message}</span>
</div>
</div>
<div className="space-y-1 text-13">
<div className="flex flex-col gap-2 text-13">
<label htmlFor="workspaceUrl">
{t("workspace_creation.form.url.label")}
<span className="ml-0.5 text-red-500">*</span>
</label>
<div className="flex w-full items-center rounded-md border-[0.5px] border-subtle px-3 bg-layer-1">
<div className="flex w-full items-center rounded-md border border-subtle px-3 bg-layer-2">
<span className="whitespace-nowrap text-12 text-secondary">{window && window.location.host}/</span>
<Controller
control={control}
Expand Down Expand Up @@ -208,7 +208,7 @@ export const CreateWorkspaceForm = observer(function CreateWorkspaceForm(props:
)}
{errors.slug && <span className="text-11 text-red-500">{errors.slug.message}</span>}
</div>
<div className="space-y-1 text-13">
<div className="flex flex-col gap-2 text-13">
<span>
{t("workspace_creation.form.organization_size.label")}
<span className="ml-0.5 text-red-500">*</span>
Expand All @@ -229,7 +229,7 @@ export const CreateWorkspaceForm = observer(function CreateWorkspaceForm(props:
</span>
)
}
buttonClassName="!border-[0.5px] !border-subtle !shadow-none bg-layer-1 text-12"
buttonClassName="border border-subtle bg-layer-2 !shadow-none !rounded-md"
input
>
{ORGANIZATION_SIZE.map((item) => (
Expand Down
2 changes: 1 addition & 1 deletion apps/web/core/components/workspace/settings/workspace-details.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -242,7 +242,7 @@ export const WorkspaceDetails = observer(function WorkspaceDetails() {
ORGANIZATION_SIZE.find((c) => c === value) ??
t("workspace_settings.settings.general.errors.company_size.select_a_range")
}
buttonClassName="!border-[0.5px] !border-subtle !shadow-none"
buttonClassName="border border-subtle bg-layer-2 !shadow-none !rounded-md"
input
disabled={!isAdmin}
>
Expand Down
170 changes: 85 additions & 85 deletions apps/web/core/components/workspace/sidebar/projects-list-item.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ import { useOutsideClickDetector } from "@plane/hooks";
import { useTranslation } from "@plane/i18n";
import { Logo } from "@plane/propel/emoji-icon-picker";
import { ArchiveIcon, ChevronRightIcon } from "@plane/propel/icons";
import { IconButton } from "@plane/propel/icon-button";
import { Tooltip } from "@plane/propel/tooltip";
import { CustomMenu, DropIndicator, DragHandle, ControlLink } from "@plane/ui";
import { cn } from "@plane/utils";
Expand Down Expand Up @@ -80,7 +81,7 @@ export const SidebarProjectsListItem = observer(function SidebarProjectsListItem
const isProjectListOpen = getIsProjectListOpen(projectId);
const [instruction, setInstruction] = useState<"DRAG_OVER" | "DRAG_BELOW" | undefined>(undefined);
// refs
const actionSectionRef = useRef<HTMLDivElement | null>(null);
const actionSectionRef = useRef<HTMLButtonElement | null>(null);
const projectRef = useRef<HTMLDivElement | null>(null);
const dragHandleRef = useRef<HTMLButtonElement | null>(null);
// router
Expand Down Expand Up @@ -341,31 +342,33 @@ export const SidebarProjectsListItem = observer(function SidebarProjectsListItem
</div>
)}
</ControlLink>
<CustomMenu
customButton={
<span
ref={actionSectionRef}
className="grid place-items-center p-0.5 text-placeholder hover:bg-layer-1 rounded-sm"
onClick={() => setIsMenuActive(!isMenuActive)}
>
<MoreHorizontal className="size-4" />
</span>
}
className={cn(
"opacity-0 pointer-events-none flex-shrink-0 group-hover/project-item:opacity-100 group-hover/project-item:pointer-events-auto",
{
"opacity-100 pointer-events-auto": isMenuActive,
<div className="flex items-center gap-1">
<CustomMenu
customButton={
<IconButton
ref={actionSectionRef}
variant="ghost"
size="sm"
icon={MoreHorizontal}
onClick={() => setIsMenuActive(!isMenuActive)}
className="text-placeholder"
/>
}
)}
customButtonClassName="grid place-items-center"
placement="bottom-start"
ariaLabel={t("aria_labels.projects_sidebar.toggle_quick_actions_menu")}
useCaptureForOutsideClick
closeOnSelect
onMenuClose={() => setIsMenuActive(false)}
>
{/* TODO: Removed is_favorite logic due to the optimization in projects API */}
{/* {isAuthorized && (
className={cn(
"opacity-0 pointer-events-none flex-shrink-0 group-hover/project-item:opacity-100 group-hover/project-item:pointer-events-auto",
{
"opacity-100 pointer-events-auto": isMenuActive,
}
)}
customButtonClassName="grid place-items-center"
placement="bottom-start"
ariaLabel={t("aria_labels.projects_sidebar.toggle_quick_actions_menu")}
useCaptureForOutsideClick
closeOnSelect
onMenuClose={() => setIsMenuActive(false)}
>
{/* TODO: Removed is_favorite logic due to the optimization in projects API */}
{/* {isAuthorized && (
<CustomMenu.MenuItem
onClick={project.is_favorite ? handleRemoveFromFavorites : handleAddToFavorites}
>
Expand All @@ -380,79 +383,76 @@ export const SidebarProjectsListItem = observer(function SidebarProjectsListItem
</CustomMenu.MenuItem>
)} */}

{/* publish project settings */}
{isAdmin && (
<CustomMenu.MenuItem onClick={() => setPublishModal(true)}>
<div className="relative flex flex-shrink-0 items-center justify-start gap-2">
<div className="flex h-4 w-4 cursor-pointer items-center justify-center rounded-sm text-secondary transition-all duration-300 hover:bg-layer-1">
<Share2 className="h-3.5 w-3.5 stroke-[1.5]" />
{/* publish project settings */}
{isAdmin && (
<CustomMenu.MenuItem onClick={() => setPublishModal(true)}>
<div className="relative flex flex-shrink-0 items-center justify-start gap-2">
<div className="flex h-4 w-4 cursor-pointer items-center justify-center rounded-sm text-secondary transition-all duration-300 hover:bg-layer-1">
<Share2 className="h-3.5 w-3.5 stroke-[1.5]" />
</div>
<div>{t("publish_project")}</div>
</div>
<div>{t("publish_project")}</div>
</div>
</CustomMenu.MenuItem>
)}
<CustomMenu.MenuItem onClick={handleCopyText}>
<span className="flex items-center justify-start gap-2">
<LinkIcon className="h-3.5 w-3.5 stroke-[1.5]" />
<span>{t("copy_link")}</span>
</span>
</CustomMenu.MenuItem>
)}
<CustomMenu.MenuItem onClick={handleCopyText}>
<span className="flex items-center justify-start gap-2">
<LinkIcon className="h-3.5 w-3.5 stroke-[1.5]" />
<span>{t("copy_link")}</span>
</span>
</CustomMenu.MenuItem>
{isAuthorized && (
{isAuthorized && (
<CustomMenu.MenuItem
onClick={() => {
router.push(`/${workspaceSlug}/projects/${project?.id}/archives/issues`);
}}
>
<div className="flex items-center justify-start gap-2 cursor-pointer">
<ArchiveIcon className="h-3.5 w-3.5 stroke-[1.5]" />
<span>{t("archives")}</span>
</div>
</CustomMenu.MenuItem>
)}
<CustomMenu.MenuItem
onClick={() => {
router.push(`/${workspaceSlug}/projects/${project?.id}/archives/issues`);
router.push(`/${workspaceSlug}/settings/projects/${project?.id}`);
}}
>
<div className="flex items-center justify-start gap-2 cursor-pointer">
<ArchiveIcon className="h-3.5 w-3.5 stroke-[1.5]" />
<span>{t("archives")}</span>
<Settings className="h-3.5 w-3.5 stroke-[1.5]" />
<span>{t("settings")}</span>
</div>
</CustomMenu.MenuItem>
)}
<CustomMenu.MenuItem
onClick={() => {
router.push(`/${workspaceSlug}/settings/projects/${project?.id}`);
}}
>
<div className="flex items-center justify-start gap-2 cursor-pointer">
<Settings className="h-3.5 w-3.5 stroke-[1.5]" />
<span>{t("settings")}</span>
</div>
</CustomMenu.MenuItem>
{/* leave project */}
{!isAuthorized && (
<CustomMenu.MenuItem
onClick={handleLeaveProject}
data-ph-element={MEMBER_TRACKER_ELEMENTS.SIDEBAR_PROJECT_QUICK_ACTIONS}
>
<div className="flex items-center justify-start gap-2">
<LogOut className="h-3.5 w-3.5 stroke-[1.5]" />
<span>{t("leave_project")}</span>
</div>
</CustomMenu.MenuItem>
)}
</CustomMenu>
{isAccordionMode && (
<Disclosure.Button
as="button"
type="button"
className={cn("hidden group-hover/project-item:inline-block p-0.5 rounded-sm hover:bg-layer-1", {
"inline-block": isMenuActive,
})}
onClick={() => setIsProjectListOpen(!isProjectListOpen)}
aria-label={t(
isProjectListOpen
? "aria_labels.projects_sidebar.close_project_menu"
: "aria_labels.projects_sidebar.open_project_menu"
{/* leave project */}
{!isAuthorized && (
<CustomMenu.MenuItem
onClick={handleLeaveProject}
data-ph-element={MEMBER_TRACKER_ELEMENTS.SIDEBAR_PROJECT_QUICK_ACTIONS}
>
<div className="flex items-center justify-start gap-2">
<LogOut className="h-3.5 w-3.5 stroke-[1.5]" />
<span>{t("leave_project")}</span>
</div>
</CustomMenu.MenuItem>
)}
Comment on lines +426 to 436

@coderabbitai coderabbitai Bot Dec 18, 2025

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

🧩 Analysis chain

🏁 Script executed:

cd /tmp && find . -name "projects-list-item.tsx" 2>/dev/null | head -5

Repository: makeplane/plane

Length of output: 41

🏁 Script executed:

git ls-files | grep "projects-list-item.tsx"

Repository: makeplane/plane

Length of output: 124

🏁 Script executed:

fd "projects-list-item.tsx" --type f

Repository: makeplane/plane

Length of output: 124

🏁 Script executed:

rg -n "isAuthorized|handleLeaveProject" --type ts --type tsx -B5 -A5 -i

Repository: makeplane/plane

Length of output: 86

🏁 Script executed:

rg -n "MEMBER_ROLE\|MEMBER_TRACKER" --type ts --type tsx

Repository: makeplane/plane

Length of output: 86

🏁 Script executed:

rg "handleLeaveProject" --type ts --type tsx -B10 -A10

Repository: makeplane/plane

Length of output: 86

🏁 Script executed:

cat apps/web/core/components/workspace/sidebar/projects-list-item.tsx | head -100

Repository: makeplane/plane

Length of output: 4761

🏁 Script executed:

cat apps/web/core/components/workspace/sidebar/projects-list-item.tsx | sed -n '400,450p'

Repository: makeplane/plane

Length of output: 2520

🏁 Script executed:

rg "handleLeaveProject" -A15 -B5

Repository: makeplane/plane

Length of output: 13456

🏁 Script executed:

rg "isAuthorized" -B10 -A5 apps/web/core/components/workspace/sidebar/projects-list-item.tsx

Repository: makeplane/plane

Length of output: 2894

🏁 Script executed:

rg "EUserPermissions\." --type js --type ts -A2 -B2 | head -50

Repository: makeplane/plane

Length of output: 3742

🏁 Script executed:

grep -r "leave.*project\|MEMBER\|GUEST" apps/web/core/components/project/ --include="*.tsx" --include="*.ts" | grep -i "leave\|permission" | head -20

Repository: makeplane/plane

Length of output: 2580

🏁 Script executed:

cat apps/web/core/components/project/member-list-item.tsx | grep -A20 "leaveProject\|can't leave"

Repository: makeplane/plane

Length of output: 1188

🏁 Script executed:

rg "You can't leave" -B10 -A10

Repository: makeplane/plane

Length of output: 41

🏁 Script executed:

cat apps/web/core/components/project/leave-project-modal.tsx | head -80

Repository: makeplane/plane

Length of output: 2403

🏁 Script executed:

rg "project.*leave\|leave.*project" apps/web/core/components/project/ --type ts --type tsx -B3 -A3 | grep -i "guest\|member\|admin\|authorize" | head -30

Repository: makeplane/plane

Length of output: 86

🏁 Script executed:

cat apps/web/core/components/navigation/tab-navigation-root.tsx | grep -A30 "isAuthorized"

Repository: makeplane/plane

Length of output: 2131

🏁 Script executed:

rg "onLeaveProject\|isAuthorized.*leave" apps/web/core/components/navigation/ -A5 -B5

Repository: makeplane/plane

Length of output: 41

🏁 Script executed:

cat apps/web/core/components/navigation/project-actions-menu.tsx | head -120

Repository: makeplane/plane

Length of output: 3741

🏁 Script executed:

rg "leave.*project" apps/web/core/components/project/card.tsx -B5 -A5

Repository: makeplane/plane

Length of output: 41

🏁 Script executed:

grep -n "!isAuthorized\|isAuthorized" apps/web/core/components/project/card.tsx

Repository: makeplane/plane

Length of output: 41

🏁 Script executed:

rg "leave_project\|LeaveProject" apps/web/core/components/ --type js --type ts -B3 -A3 | head -80

Repository: makeplane/plane

Length of output: 41

🏁 Script executed:

rg "leave.*guest\|guest.*leave\|member.*leave" -i --type ts --type js | head -20

Repository: makeplane/plane

Length of output: 41

🏁 Script executed:

cat apps/web/core/components/project/leave-project-modal.tsx | tail -60

Repository: makeplane/plane

Length of output: 2446

Leave project option should be available to members in sidebar menu.

Currently, the condition !isAuthorized restricts the "Leave project" option in the sidebar to guests only. Since isAuthorized checks for [EUserPermissions.ADMIN, EUserPermissions.MEMBER], members and admins cannot see this option in the quick actions menu, even though members may want to leave a project. While members can leave through other UI paths (e.g., project member settings), they should also have the leave option readily available in the sidebar menu. Consider changing the condition to isAuthorized to show the option to members, or implement a separate permission check that allows members to leave while maintaining other access controls.

🤖 Prompt for AI Agents 
In apps/web/core/components/workspace/sidebar/projects-list-item.tsx around
lines 426-436, the "Leave project" menu item is currently shown only when
!isAuthorized (effectively guests); change the visibility logic so project
members can see the option: compute an isMember boolean from the user's
permissions (e.g., check for EUserPermissions.MEMBER) and replace the
!isAuthorized condition with isMember (or a condition that includes members but
excludes admins if desired), ensuring the onClick handler and data attribute
stay the same.

>
<ChevronRightIcon
className={cn("size-4 flex-shrink-0 text-placeholder transition-transform", {
</CustomMenu>
{isAccordionMode && (
<IconButton
variant="ghost"
size="sm"
icon={ChevronRightIcon}
onClick={() => setIsProjectListOpen(!isProjectListOpen)}
className={cn("hidden group-hover/project-item:inline-flex text-placeholder transition-transform", {
"inline-flex": isMenuActive,
"rotate-90": isProjectListOpen,
})}
aria-label={t(
isProjectListOpen
? "aria_labels.projects_sidebar.close_project_menu"
: "aria_labels.projects_sidebar.open_project_menu"
)}
/>
</Disclosure.Button>
)}
)}
</div>
</>
</div>
{isAccordionMode && (
Expand Down
10 changes: 5 additions & 5 deletions packages/propel/src/button/helper.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,15 +7,15 @@ export const buttonVariants = cva(
variants: {
variant: {
primary:
"bg-accent-primary hover:bg-accent-primary-hover active:bg-accent-primary-active focus:bg-accent-primary-active disabled:bg-layer-disabled text-on-color disabled:text-disabled",
"bg-accent-primary hover:bg-accent-primary-hover active:bg-accent-primary-active disabled:bg-layer-disabled text-on-color disabled:text-disabled",
"error-fill":
"bg-danger-primary hover:bg-danger-primary-hover active:bg-danger-primary-active focus:bg-danger-primary-active disabled:bg-layer-disabled text-on-color disabled:text-disabled",
"bg-danger-primary hover:bg-danger-primary-hover active:bg-danger-primary-active disabled:bg-layer-disabled text-on-color disabled:text-disabled",
"error-outline":
"bg-layer-2 hover:bg-danger-subtle active:bg-danger-subtle-hover focus:bg-danger-subtle-hover disabled:bg-layer-2 text-danger disabled:text-disabled border border-danger-strong disabled:border-subtle-1",
"bg-layer-2 hover:bg-danger-subtle active:bg-danger-subtle-hover disabled:bg-layer-2 text-danger disabled:text-disabled border border-danger-strong disabled:border-subtle-1",
secondary:
"bg-layer-2 hover:bg-layer-2-hover active:bg-layer-2-active focus:bg-layer-2-active disabled:bg-layer-transparent text-secondary disabled:text-disabled border border-strong disabled:border-subtle-1 shadow-raised-100",
"bg-layer-2 hover:bg-layer-2-hover active:bg-layer-2-active disabled:bg-layer-transparent text-secondary disabled:text-disabled border border-strong disabled:border-subtle-1 shadow-raised-100",

Copilot AI Dec 18, 2025

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There's a double space after active:bg-layer-2-active that should be reduced to a single space for consistency with other variant definitions.

Suggested change
"bg-layer-2 hover:bg-layer-2-hover active:bg-layer-2-active disabled:bg-layer-transparent text-secondary disabled:text-disabled border border-strong disabled:border-subtle-1 shadow-raised-100",
"bg-layer-2 hover:bg-layer-2-hover active:bg-layer-2-active disabled:bg-layer-transparent text-secondary disabled:text-disabled border border-strong disabled:border-subtle-1 shadow-raised-100",

Copilot uses AI. Check for mistakes.
tertiary:
"bg-layer-3 hover:bg-layer-3-hover active:bg-layer-3-active focus:bg-layer-3-active disabled:bg-layer-transparent text-secondary disabled:text-disabled",
"bg-layer-3 hover:bg-layer-3-hover active:bg-layer-3-active disabled:bg-layer-transparent text-secondary disabled:text-disabled",
ghost:
"bg-layer-transparent hover:bg-layer-transparent-hover active:bg-layer-transparent-active focus:bg-layer-transparent-active disabled:bg-layer-transparent text-secondary disabled:text-disabled",
link: "px-0 underline text-link-primary hover:text-link-primary-hover active:text-link-primary-hover focus:text-link-primary-hover disabled:text-disabled",
Expand Down
2 changes: 1 addition & 1 deletion packages/propel/src/charts/radar-chart/root.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ function RadarChart<T extends string, K extends string>(props: TRadarChartProps<
<div className={className}>
<ResponsiveContainer width="100%" height="100%">
<CoreRadarChart cx="50%" cy="50%" outerRadius="80%" data={data} margin={margin}>
<PolarGrid stroke="--alpha(var(--border-color-subtle) / 90%)" />
<PolarGrid stroke="var(--border-color-subtle)" />
<PolarAngleAxis dataKey={angleAxis.key} tick={(props) => <CustomRadarAxisTick {...props} />} />
{showTooltip && (
<Tooltip
Expand Down
2 changes: 1 addition & 1 deletion packages/propel/src/input/input.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ const Input = React.forwardRef(function Input(props: InputProps, ref: React.Forw
type={type}
name={name}
className={cn(
"block rounded-md bg-layer-1 text-13 placeholder-tertiary border-subtle-1 focus:outline-none",
"block rounded-md bg-layer-2 text-13 placeholder-tertiary border-subtle-1 focus:outline-none",
{
"rounded-md border-[0.5px]": mode === "primary",
"rounded-sm border-none bg-transparent ring-0 transition-all focus:ring-1 focus:ring-accent-strong":
Expand Down
Loading
Loading