Skip to content

feat: create idp sync page skeleton #14543

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.

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
merged 14 commits into from
Sep 6, 2024
Merged
Prev Previous commit
Next Next commit
feat: update StatusIndicator for outlined variant
  • Loading branch information
jaaydenh committed Sep 5, 2024
commit f2281e962aceddd51fc2f8306dfc00506a32c19d
13 changes: 11 additions & 2 deletions site/src/components/StatusIndicator/StatusIndicator.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,13 @@ import type { ThemeRole } from "theme/roles";

interface StatusIndicatorProps {
color: ThemeRole;
variant?: "solid" | "outlined";
}

export const StatusIndicator: FC<StatusIndicatorProps> = ({ color }) => {
export const StatusIndicator: FC<StatusIndicatorProps> = ({
color,
variant = "solid",
}) => {
const theme = useTheme();

return (
Expand All @@ -15,7 +19,12 @@ export const StatusIndicator: FC<StatusIndicatorProps> = ({ color }) => {
height: 8,
width: 8,
borderRadius: 4,
backgroundColor: theme.roles[color].fill.solid,
backgroundColor:
variant === "solid" ? theme.roles[color].fill.solid : undefined,
border:
variant === "outlined"
? `1px solid ${theme.roles[color].outline}`
: undefined,
}}
/>
);
Expand Down