diff --git a/.changeset/big-masks-relate.md b/.changeset/big-masks-relate.md deleted file mode 100644 index c36135037f9..00000000000 --- a/.changeset/big-masks-relate.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@talend/react-components': patch ---- - -fix: tokens on the Slider component and migration to typescript diff --git a/.changeset/old-onions-remain.md b/.changeset/old-onions-remain.md deleted file mode 100644 index 44b8ec6bea6..00000000000 --- a/.changeset/old-onions-remain.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@talend/design-tokens': minor ---- - -feat: add brand & info tokens diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md index ddb2a2c6d87..4d652bfe164 100644 --- a/packages/components/CHANGELOG.md +++ b/packages/components/CHANGELOG.md @@ -1,5 +1,13 @@ # @talend/react-components +## 11.1.3 + +### Patch Changes + +- 3345262d2: fix: tokens on the Slider component and migration to typescript +- Updated dependencies [b36165add] + - @talend/design-tokens@2.8.0 + ## 11.1.2 ### Patch Changes diff --git a/packages/components/package.json b/packages/components/package.json index f88e9b9e755..700720c019e 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -36,7 +36,7 @@ "dependencies": { "@popperjs/core": "^2.11.8", "@talend/bootstrap-theme": "^8.0.0", - "@talend/design-tokens": "^2.7.3", + "@talend/design-tokens": "^2.8.0", "@talend/react-a11y": "^1.1.0", "@talend/icons": "^6.58.1", "@talend/utils": "^2.5.1", @@ -113,5 +113,5 @@ "publishConfig": { "access": "public" }, - "version": "11.1.2" + "version": "11.1.3" } diff --git a/packages/design-tokens/CHANGELOG.md b/packages/design-tokens/CHANGELOG.md index daf4692ed33..a4d1bef3e46 100644 --- a/packages/design-tokens/CHANGELOG.md +++ b/packages/design-tokens/CHANGELOG.md @@ -1,5 +1,11 @@ # @talend/design-tokens +## 2.8.0 + +### Minor Changes + +- b36165add: feat: add brand & info tokens + ## 2.7.3 ### Patch Changes diff --git a/packages/design-tokens/package.json b/packages/design-tokens/package.json index d68337b32b5..8bf7812460d 100644 --- a/packages/design-tokens/package.json +++ b/packages/design-tokens/package.json @@ -1,6 +1,6 @@ { "name": "@talend/design-tokens", - "version": "2.7.3", + "version": "2.8.0", "description": "Talend Design Tokens", "main": "lib/index.js", "types": "lib/index.d.ts", diff --git a/packages/faceted-search/CHANGELOG.md b/packages/faceted-search/CHANGELOG.md index 259f2c5e88a..5a146ce86cd 100644 --- a/packages/faceted-search/CHANGELOG.md +++ b/packages/faceted-search/CHANGELOG.md @@ -1,5 +1,12 @@ # Changelog +## 11.0.1 + +### Patch Changes + +- Updated dependencies [b36165add] + - @talend/design-tokens@2.8.0 + ## 11.0.0 ### Major Changes diff --git a/packages/faceted-search/package.json b/packages/faceted-search/package.json index 47d89a29567..ca38e8f7e5d 100644 --- a/packages/faceted-search/package.json +++ b/packages/faceted-search/package.json @@ -1,6 +1,6 @@ { "name": "@talend/react-faceted-search", - "version": "11.0.0", + "version": "11.0.1", "description": "Faceted search", "main": "lib/index.js", "mainSrc": "src/index.js", @@ -36,7 +36,7 @@ "@talend/daikon-tql-client": "^1.3.1", "@talend/utils": "^2.5.1", "@talend/react-bootstrap": "^1.35.2", - "@talend/design-tokens": "2.7.3", + "@talend/design-tokens": "2.8.0", "classnames": "^2.3.2", "date-fns": "^1.30.1", "invariant": "^2.2.4", @@ -51,7 +51,7 @@ "@talend/icons": "^6.58.1", "@talend/locales-tui-components": "^9.5.0", "@talend/locales-tui-faceted-search": "^8.1.0", - "@talend/react-components": "^11.0.0", + "@talend/react-components": "^11.1.3", "@talend/scripts-core": "^14.0.0", "@talend/scripts-config-react-webpack": "^15.4.1", "babel-plugin-angularjs-annotate": "^0.10.0", diff --git a/packages/theme/CHANGELOG.md b/packages/theme/CHANGELOG.md index 1933430ba00..d0da5e27371 100644 --- a/packages/theme/CHANGELOG.md +++ b/packages/theme/CHANGELOG.md @@ -1,5 +1,11 @@ # @talend/bootstrap-theme +## 8.0.1 + +### Patch Changes + +- ae4916894: Bootstrap Theme : Fix various button border issues using Design System tokens + ## 8.0.0 ### Major Changes diff --git a/packages/theme/package.json b/packages/theme/package.json index ffa9621f34e..05ea8c573f7 100644 --- a/packages/theme/package.json +++ b/packages/theme/package.json @@ -44,5 +44,5 @@ "publishConfig": { "access": "public" }, - "version": "8.0.0" + "version": "8.0.1" } diff --git a/packages/theme/src/theme/_buttons.scss b/packages/theme/src/theme/_buttons.scss index 2e76a38149b..a7be904cbd0 100644 --- a/packages/theme/src/theme/_buttons.scss +++ b/packages/theme/src/theme/_buttons.scss @@ -24,21 +24,13 @@ &, &:focus, &:hover { - color: currentColor; - background-color: transparent; border-color: transparent; } &:active, .open > &.dropdown-toggle { box-shadow: none; - - &, - &:hover { - color: var(--t-button-color); - background-color: var(--t-button-background-color); - border-color: var(--t-button-border-color); - } + border-color: transparent; } &, @@ -56,9 +48,6 @@ &:hover, &:focus, &.focus { - color: var(--t-button-color); - background-color: var(--t-button-background-color); - border-color: var(--t-button-border-color); opacity: 0.54; cursor: not-allowed; } @@ -99,16 +88,28 @@ background: tokens.$coral-color-accent-background-strong-active; color: tokens.$coral-color-accent-text-weak-active; } + + &.disabled, + &[disabled], + &[aria-disabled='true'], + &[aria-busy='true'] { + background: tokens.$coral-color-accent-background-strong; + color: tokens.$coral-color-accent-text-weak; + + &:hover { + background-color: tokens.$coral-color-accent-background-strong; + } + } } &-inverse { background-color: transparent; - border: tokens.$coral-border-s-solid tokens.$coral-color-accent-border; + border-color: tokens.$coral-color-accent-border; color: tokens.$coral-color-accent-text; &:hover { background: tokens.$coral-color-accent-background-weak-hover; - border: tokens.$coral-border-s-solid tokens.$coral-color-accent-border; + border-color: tokens.$coral-color-accent-border-hover; color: tokens.$coral-color-accent-text-strong-hover; } @@ -117,12 +118,13 @@ color: tokens.$coral-color-accent-text-strong-active; } - &:disabled, + &.disabled, + &[disabled], &[aria-disabled='true'], &[aria-busy='true'] { background: transparent; - border: tokens.$coral-border-s-solid tokens.$coral-color-neutral-border-disabled; - color: tokens.$coral-color-neutral-text-disabled; + border-color: tokens.$coral-color-accent-border; + color: tokens.$coral-color-accent-text; &:hover { background-color: transparent; @@ -132,12 +134,12 @@ &--secondary { background-color: transparent; - border-color: tokens.$coral-color-accent-text; + border-color: tokens.$coral-color-accent-border; color: tokens.$coral-color-accent-text; &:hover { background: tokens.$coral-color-accent-background-weak-hover; - border-color: tokens.$coral-color-accent-text; + border-color: tokens.$coral-color-accent-border-hover; color: tokens.$coral-color-accent-text-strong-hover; } @@ -146,12 +148,13 @@ color: tokens.$coral-color-accent-text-strong-active; } - &:disabled, + &.disabled, + &[disabled], &[aria-disabled='true'], &[aria-busy='true'] { background: transparent; - border: tokens.$coral-border-s-solid tokens.$coral-color-neutral-border-disabled; - color: tokens.$coral-color-neutral-text-disabled; + border-color: tokens.$coral-color-accent-border; + color: tokens.$coral-color-accent-text; &:hover { background-color: transparent; @@ -174,12 +177,12 @@ color: tokens.$coral-color-accent-text-strong-active; } - &:disabled, + &.disabled, + &[disabled], &[aria-disabled='true'], &[aria-busy='true'] { background: transparent; - border: tokens.$coral-border-s-solid tokens.$coral-color-neutral-border-disabled; - color: tokens.$coral-color-neutral-text-disabled; + color: tokens.$coral-color-accent-text; &:hover { background-color: transparent; @@ -198,22 +201,27 @@ color: tokens.$coral-color-accent-text-strong-active; } - &:disabled, + &.disabled, + &[disabled], &[aria-disabled='true'], &[aria-busy='true'] { - border: tokens.$coral-border-s-solid tokens.$coral-color-neutral-border-disabled; - color: tokens.$coral-color-neutral-text-disabled; + color: tokens.$coral-color-accent-text; + + &:hover { + color: tokens.$coral-color-accent-text; + } } } &.btn-danger, &.btn--destructive { background: tokens.$coral-color-danger-background-strong; - border: tokens.$coral-color-danger-background-strong; + border-color: tokens.$coral-color-danger-border; color: tokens.$coral-color-danger-text-weak; &:hover { background: tokens.$coral-color-danger-background-strong-hover; + border-color: tokens.$coral-color-danger-border-hover; color: tokens.$coral-color-danger-text-weak-hover; } @@ -222,10 +230,17 @@ color: tokens.$coral-color-danger-text-weak-active; } - &[disabled] &:hover, - .disabled &:hover { - background: tokens.$coral-color-neutral-background-disabled; - color: tokens.$coral-color-neutral-text-disabled; + &[disabled], + .disabled, + &[aria-disabled='true'], + &[aria-busy='true'] { + background: tokens.$coral-color-danger-background-strong; + border-color: tokens.$coral-color-danger-border; + color: tokens.$coral-color-danger-text-weak; + + &:hover { + background-color: tokens.$coral-color-danger-background-strong; + } } }