yujunjun/datahub
2
0
Fork 0
mirror of https://github.com/datahub-project/datahub.git synced 2025-12-28 02:17:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui styles): updated hard coded button gradient and added it only for violet (#13201)

Browse Source
This commit is contained in:
Anna Everhart 2025-04-14 09:03:11 -07:00 committed by GitHub
parent 9258226e2f
commit 1a55dd357c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 7 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
datahub-web-react/src/alchemy-components/components/Button/utils.ts
View File

@ -107,14 +107,17 @@ const getButtonColorStyles = (variant: ButtonVariant, color: ColorOptions): Colo
};
// Generate color styles for button
const getButtonVariantStyles = (variant: ButtonVariant, colorStyles: ColorStyles): CSSObject => {
const getButtonVariantStyles = (variant: ButtonVariant, colorStyles: ColorStyles, color: ColorOptions): CSSObject => {
const isViolet = color === 'violet';
const violetGradient = `radial-gradient(115.48% 144.44% at 50% -44.44%, var(--buttons-bg-2-for-gradient, #705EE4) 38.97%, var(--buttons-bg, #533FD1) 100%)`;
const variantStyles = {
filled: {
background: `radial-gradient(115.48% 144.44% at 50% -44.44%, var(--buttons-bg-2-for-gradient, #705EE4) 38.97%, var(--buttons-bg, #533FD1) 100%)`,
background: isViolet ? violetGradient : colorStyles.bgColor,
border: `1px solid ${colorStyles.borderColor}`,
color: colorStyles.textColor,
'&:hover': {
background: `radial-gradient(115.48% 144.44% at 50% -44.44%, var(--buttons-bg-2-for-gradient, #705EE4) 38.97%, var(--buttons-bg, #533FD1) 100%)`,
background: isViolet ? violetGradient : colorStyles.hoverBgColor,
border: `1px solid ${colorStyles.hoverBgColor}`,
boxShadow: shadows.sm,
},
@ -246,7 +249,7 @@ export const getButtonStyle = (props: ButtonStyleProps): CSSObject => {
const colorStyles = getButtonColorStyles(variant, color);
// Define styles for button
const variantStyles = getButtonVariantStyles(variant, colorStyles);
const variantStyles = getButtonVariantStyles(variant, colorStyles, color);
const fontStyles = getButtonFontStyles(size);
const radiiStyles = getButtonRadiiStyles(isCircle);
const paddingStyles = getButtonPadding(size, hasChildren, isCircle);