fix: Design tokens update + icons alignment fix (#460)

Co-authored-by: mparticle-automation <developers@mparticle.com>
mParticle · Oct 18, 2024 · 9c93165 · 9c93165
1 parent 7a51472
commit 9c93165
Show file tree

Hide file tree

Showing 10 changed files with 29 additions and 10 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,16 @@
+## [1.33.2-fix-design-tokens-fix.2](https://github.com/mParticle/aquarium/compare/v1.33.2-fix-design-tokens-fix.1...v1.33.2-fix-design-tokens-fix.2) (2024-10-17)
+
+### Bug Fixes
+
+- (styles) override lineheight on icons ([015268f](https://github.com/mParticle/aquarium/commit/015268ffb2d631825561ec7f31af5524a2db7a36))
+
+## [1.33.2-fix-design-tokens-fix.1](https://github.com/mParticle/aquarium/compare/v1.33.1...v1.33.2-fix-design-tokens-fix.1) (2024-10-17)
+
+### Bug Fixes
+
+- (styles) remove shadow of the buttons and update suite selector hover color ([7502b54](https://github.com/mParticle/aquarium/commit/7502b54a03128be280cd5942cc54e6a795c88442))
+- ensure PostCSS handles CSS unnesting in Vite config ([#457](https://github.com/mParticle/aquarium/issues/457)) ([1978e65](https://github.com/mParticle/aquarium/commit/1978e657bec3a360be45ea4f8a4a52653cd79640))
+
 ## [1.33.2-fix-unnested-css.1](https://github.com/mParticle/aquarium/compare/v1.33.1...v1.33.2-fix-unnested-css.1) (2024-10-15)
 
 ### Bug Fixes

diff --git a/design/LightTheme.ts b/design/LightTheme.ts
@@ -108,9 +108,6 @@ export const LightTheme: IMpThemeConfig = {
     },
     Button: {
       borderColorDisabled: '#dcdcd8',
-      primaryShadow: '0 2px 0 rgba(44, 0, 170, 0.4)',
-      defaultShadow: '0 2px 0 rgba(44, 0, 170, 0.2)',
-      dangerShadow: '0 2px 0 rgba(44, 0, 170, 0.3)',
     },
     Input: {
       activeShadow: '0 0 0 2px rgba(54, 0, 209, 0.1)',

diff --git a/design/MpThemeConfig.d.ts b/design/MpThemeConfig.d.ts
@@ -70,9 +70,6 @@ export type IMpThemeConfig = ThemeConfig & {
     }
     Button: {
       borderColorDisabled: string
-      primaryShadow: string
-      defaultShadow: string
-      dangerShadow: string
     }
     Input: {
       activeShadow: string

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mparticle/aquarium",
-  "version": "1.33.2-fix-unnested-css.1",
+  "version": "1.33.2-fix-design-tokens-fix.2",
   "description": "mParticle Component Library",
   "license": "Apache-2.0",
   "keywords": [

diff --git a/src/components/general/Button/Button.tsx b/src/components/general/Button/Button.tsx
@@ -5,6 +5,7 @@ import { Icon } from 'src/components'
 import type { IIconProps } from 'src/components'
 import { ConfigProvider } from 'src/components/other/ConfigProvider/ConfigProvider'
 import { type ReactNode } from 'react'
+import './button.css'
 
 export interface IButtonProps extends Omit<AntButtonProps, 'variant'> {
   /**

diff --git a/src/components/general/Button/button.css b/src/components/general/Button/button.css
@@ -0,0 +1,3 @@
+.ant-btn .ant-btn-icon {
+    line-height: 0 !important;
+}
diff --git a/src/components/general/Icon/icon.css b/src/components/general/Icon/icon.css
@@ -1,3 +1,7 @@
+.anticon >* {
+  line-height: 0 !important;
+}
+
 .icon-size-xxxxl {
   width: var(--mp-icon-size-xxxxl);
   min-width: var(--mp-icon-size-xxxxl);

diff --git a/src/components/navigation/GlobalNavigation/SuiteSelector/suite-selector.css b/src/components/navigation/GlobalNavigation/SuiteSelector/suite-selector.css
@@ -18,7 +18,7 @@
 }
 
 .suiteSelector__link:not(.suiteSelector__link--active, .suiteSelector__link--disabled):hover .suiteSelector__suiteLogo {
-  background-color: var(--control-item-bg-hover);
+  background-color: var(--color-white);
 }
 
 .suiteSelector__link.suiteSelector__link--active {

diff --git a/src/components/navigation/GlobalNavigation/global-navigation.css b/src/components/navigation/GlobalNavigation/global-navigation.css
@@ -360,4 +360,8 @@
 .notificationCenter__header {
   padding: var(--padding-content-vertical-lg) var(--padding-content-horizontal-lg);
   border-bottom: 1px solid var(--color-border-secondary);
+}
+
+.ant-menu .ant-menu-submenu-title .ant-menu-item-icon svg {
+  line-height: 0 !important;
 }