Skip to content

Commit

Permalink
fix(Tooltip): use Eufemia cubic-bezier for animations
Browse files Browse the repository at this point in the history
  • Loading branch information
@tujoworker
tujoworker committed Sep 6, 2022
1 parent ac28883 commit c54c1d8
Show file tree
Hide file tree
Showing 21 changed files with 148 additions and 147 deletions.
14 changes: 7 additions & 7 deletions ...dnb-eufemia/src/components/autocomplete/__tests__/__snapshots__/Autocomplete.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1460,29 +1460,29 @@ exports[`Autocomplete scss have to match snapshot 1`] = `
padding: 0 1rem;
opacity: 0;
visibility: hidden;
transition: opacity 200ms ease-out; }
transition: opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--large {
padding: 0.25rem 1rem; }
.dnb-tooltip--animate_position {
transition: all 300ms ease-in-out, opacity 200ms ease-out; }
transition: all 200ms cubic-bezier(0.42, 0, 0, 1), opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--active {
visibility: visible;
/*
because of the first \\"show\\" we also use animation
also, use forwards because of the usage of visibility
*/
animation: show-tooltip 200ms ease-out forwards; }
animation: show-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
html[data-visual-test] .dnb-tooltip--active, .dnb-tooltip--active.dnb-tooltip--no-animation {
animation: show-tooltip 1ms ease-out forwards; }
animation: show-tooltip 1ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide {
visibility: visible;
animation: hide-tooltip 200ms ease-in-out forwards; }
animation: hide-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide.dnb-tooltip--no-animation {
animation: hide-tooltip 1ms ease-out forwards; }
animation: hide-tooltip 1ms linear forwards; }
.dnb-tooltip--fixed {
position: fixed; }
html[data-visual-test] .dnb-tooltip--hide {
animation: hide-tooltip 1ms ease-out 1s forwards; }
animation: hide-tooltip 1ms linear 1s forwards; }
.dnb-tooltip__portal {
position: absolute;
top: 0;
Expand Down
14 changes: 7 additions & 7 deletions packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/Button.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1559,29 +1559,29 @@ exports[`Button scss have to match snapshot 1`] = `
padding: 0 1rem;
opacity: 0;
visibility: hidden;
transition: opacity 200ms ease-out; }
transition: opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--large {
padding: 0.25rem 1rem; }
.dnb-tooltip--animate_position {
transition: all 300ms ease-in-out, opacity 200ms ease-out; }
transition: all 200ms cubic-bezier(0.42, 0, 0, 1), opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--active {
visibility: visible;
/*
because of the first \\"show\\" we also use animation
also, use forwards because of the usage of visibility
*/
animation: show-tooltip 200ms ease-out forwards; }
animation: show-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
html[data-visual-test] .dnb-tooltip--active, .dnb-tooltip--active.dnb-tooltip--no-animation {
animation: show-tooltip 1ms ease-out forwards; }
animation: show-tooltip 1ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide {
visibility: visible;
animation: hide-tooltip 200ms ease-in-out forwards; }
animation: hide-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide.dnb-tooltip--no-animation {
animation: hide-tooltip 1ms ease-out forwards; }
animation: hide-tooltip 1ms linear forwards; }
.dnb-tooltip--fixed {
position: fixed; }
html[data-visual-test] .dnb-tooltip--hide {
animation: hide-tooltip 1ms ease-out 1s forwards; }
animation: hide-tooltip 1ms linear 1s forwards; }
.dnb-tooltip__portal {
position: absolute;
top: 0;
Expand Down
14 changes: 7 additions & 7 deletions ...es/dnb-eufemia/src/components/date-picker/__tests__/__snapshots__/DatePicker.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2002,29 +2002,29 @@ exports[`DatePicker scss have to match snapshot 1`] = `
padding: 0 1rem;
opacity: 0;
visibility: hidden;
transition: opacity 200ms ease-out; }
transition: opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--large {
padding: 0.25rem 1rem; }
.dnb-tooltip--animate_position {
transition: all 300ms ease-in-out, opacity 200ms ease-out; }
transition: all 200ms cubic-bezier(0.42, 0, 0, 1), opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--active {
visibility: visible;
/*
because of the first \\"show\\" we also use animation
also, use forwards because of the usage of visibility
*/
animation: show-tooltip 200ms ease-out forwards; }
animation: show-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
html[data-visual-test] .dnb-tooltip--active, .dnb-tooltip--active.dnb-tooltip--no-animation {
animation: show-tooltip 1ms ease-out forwards; }
animation: show-tooltip 1ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide {
visibility: visible;
animation: hide-tooltip 200ms ease-in-out forwards; }
animation: hide-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide.dnb-tooltip--no-animation {
animation: hide-tooltip 1ms ease-out forwards; }
animation: hide-tooltip 1ms linear forwards; }
.dnb-tooltip--fixed {
position: fixed; }
html[data-visual-test] .dnb-tooltip--hide {
animation: hide-tooltip 1ms ease-out 1s forwards; }
animation: hide-tooltip 1ms linear 1s forwards; }
.dnb-tooltip__portal {
position: absolute;
top: 0;
Expand Down
14 changes: 7 additions & 7 deletions packages/dnb-eufemia/src/components/dialog/__tests__/__snapshots__/Dialog.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1392,29 +1392,29 @@ exports[`Dialog scss have to match snapshot 1`] = `
padding: 0 1rem;
opacity: 0;
visibility: hidden;
transition: opacity 200ms ease-out; }
transition: opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--large {
padding: 0.25rem 1rem; }
.dnb-tooltip--animate_position {
transition: all 300ms ease-in-out, opacity 200ms ease-out; }
transition: all 200ms cubic-bezier(0.42, 0, 0, 1), opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--active {
visibility: visible;
/*
because of the first \\"show\\" we also use animation
also, use forwards because of the usage of visibility
*/
animation: show-tooltip 200ms ease-out forwards; }
animation: show-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
html[data-visual-test] .dnb-tooltip--active, .dnb-tooltip--active.dnb-tooltip--no-animation {
animation: show-tooltip 1ms ease-out forwards; }
animation: show-tooltip 1ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide {
visibility: visible;
animation: hide-tooltip 200ms ease-in-out forwards; }
animation: hide-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide.dnb-tooltip--no-animation {
animation: hide-tooltip 1ms ease-out forwards; }
animation: hide-tooltip 1ms linear forwards; }
.dnb-tooltip--fixed {
position: fixed; }
html[data-visual-test] .dnb-tooltip--hide {
animation: hide-tooltip 1ms ease-out 1s forwards; }
animation: hide-tooltip 1ms linear 1s forwards; }
.dnb-tooltip__portal {
position: absolute;
top: 0;
Expand Down
14 changes: 7 additions & 7 deletions packages/dnb-eufemia/src/components/drawer/__tests__/__snapshots__/Drawer.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1406,29 +1406,29 @@ exports[`Drawer scss have to match snapshot 1`] = `
padding: 0 1rem;
opacity: 0;
visibility: hidden;
transition: opacity 200ms ease-out; }
transition: opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--large {
padding: 0.25rem 1rem; }
.dnb-tooltip--animate_position {
transition: all 300ms ease-in-out, opacity 200ms ease-out; }
transition: all 200ms cubic-bezier(0.42, 0, 0, 1), opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--active {
visibility: visible;
/*
because of the first \\"show\\" we also use animation
also, use forwards because of the usage of visibility
*/
animation: show-tooltip 200ms ease-out forwards; }
animation: show-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
html[data-visual-test] .dnb-tooltip--active, .dnb-tooltip--active.dnb-tooltip--no-animation {
animation: show-tooltip 1ms ease-out forwards; }
animation: show-tooltip 1ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide {
visibility: visible;
animation: hide-tooltip 200ms ease-in-out forwards; }
animation: hide-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide.dnb-tooltip--no-animation {
animation: hide-tooltip 1ms ease-out forwards; }
animation: hide-tooltip 1ms linear forwards; }
.dnb-tooltip--fixed {
position: fixed; }
html[data-visual-test] .dnb-tooltip--hide {
animation: hide-tooltip 1ms ease-out 1s forwards; }
animation: hide-tooltip 1ms linear 1s forwards; }
.dnb-tooltip__portal {
position: absolute;
top: 0;
Expand Down
14 changes: 7 additions & 7 deletions packages/dnb-eufemia/src/components/dropdown/__tests__/__snapshots__/Dropdown.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1558,29 +1558,29 @@ exports[`Dropdown scss have to match snapshot 1`] = `
padding: 0 1rem;
opacity: 0;
visibility: hidden;
transition: opacity 200ms ease-out; }
transition: opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--large {
padding: 0.25rem 1rem; }
.dnb-tooltip--animate_position {
transition: all 300ms ease-in-out, opacity 200ms ease-out; }
transition: all 200ms cubic-bezier(0.42, 0, 0, 1), opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--active {
visibility: visible;
/*
because of the first \\"show\\" we also use animation
also, use forwards because of the usage of visibility
*/
animation: show-tooltip 200ms ease-out forwards; }
animation: show-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
html[data-visual-test] .dnb-tooltip--active, .dnb-tooltip--active.dnb-tooltip--no-animation {
animation: show-tooltip 1ms ease-out forwards; }
animation: show-tooltip 1ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide {
visibility: visible;
animation: hide-tooltip 200ms ease-in-out forwards; }
animation: hide-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide.dnb-tooltip--no-animation {
animation: hide-tooltip 1ms ease-out forwards; }
animation: hide-tooltip 1ms linear forwards; }
.dnb-tooltip--fixed {
position: fixed; }
html[data-visual-test] .dnb-tooltip--hide {
animation: hide-tooltip 1ms ease-out 1s forwards; }
animation: hide-tooltip 1ms linear 1s forwards; }
.dnb-tooltip__portal {
position: absolute;
top: 0;
Expand Down
14 changes: 7 additions & 7 deletions .../dnb-eufemia/src/components/global-error/__tests__/__snapshots__/GlobalError.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -161,29 +161,29 @@ exports[`GlobalError scss have to match snapshot 1`] = `
padding: 0 1rem;
opacity: 0;
visibility: hidden;
transition: opacity 200ms ease-out; }
transition: opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--large {
padding: 0.25rem 1rem; }
.dnb-tooltip--animate_position {
transition: all 300ms ease-in-out, opacity 200ms ease-out; }
transition: all 200ms cubic-bezier(0.42, 0, 0, 1), opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--active {
visibility: visible;
/*
because of the first \\"show\\" we also use animation
also, use forwards because of the usage of visibility
*/
animation: show-tooltip 200ms ease-out forwards; }
animation: show-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
html[data-visual-test] .dnb-tooltip--active, .dnb-tooltip--active.dnb-tooltip--no-animation {
animation: show-tooltip 1ms ease-out forwards; }
animation: show-tooltip 1ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide {
visibility: visible;
animation: hide-tooltip 200ms ease-in-out forwards; }
animation: hide-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide.dnb-tooltip--no-animation {
animation: hide-tooltip 1ms ease-out forwards; }
animation: hide-tooltip 1ms linear forwards; }
.dnb-tooltip--fixed {
position: fixed; }
html[data-visual-test] .dnb-tooltip--hide {
animation: hide-tooltip 1ms ease-out 1s forwards; }
animation: hide-tooltip 1ms linear 1s forwards; }
.dnb-tooltip__portal {
position: absolute;
top: 0;
Expand Down
14 changes: 7 additions & 7 deletions ...nb-eufemia/src/components/global-status/__tests__/__snapshots__/GlobalStatus.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -186,29 +186,29 @@ exports[`GlobalStatus scss have to match snapshot 1`] = `
padding: 0 1rem;
opacity: 0;
visibility: hidden;
transition: opacity 200ms ease-out; }
transition: opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--large {
padding: 0.25rem 1rem; }
.dnb-tooltip--animate_position {
transition: all 300ms ease-in-out, opacity 200ms ease-out; }
transition: all 200ms cubic-bezier(0.42, 0, 0, 1), opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--active {
visibility: visible;
/*
because of the first \\"show\\" we also use animation
also, use forwards because of the usage of visibility
*/
animation: show-tooltip 200ms ease-out forwards; }
animation: show-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
html[data-visual-test] .dnb-tooltip--active, .dnb-tooltip--active.dnb-tooltip--no-animation {
animation: show-tooltip 1ms ease-out forwards; }
animation: show-tooltip 1ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide {
visibility: visible;
animation: hide-tooltip 200ms ease-in-out forwards; }
animation: hide-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide.dnb-tooltip--no-animation {
animation: hide-tooltip 1ms ease-out forwards; }
animation: hide-tooltip 1ms linear forwards; }
.dnb-tooltip--fixed {
position: fixed; }
html[data-visual-test] .dnb-tooltip--hide {
animation: hide-tooltip 1ms ease-out 1s forwards; }
animation: hide-tooltip 1ms linear 1s forwards; }
.dnb-tooltip__portal {
position: absolute;
top: 0;
Expand Down
14 changes: 7 additions & 7 deletions ...es/dnb-eufemia/src/components/help-button/__tests__/__snapshots__/HelpButton.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -338,29 +338,29 @@ exports[`HelpButton scss have to match snapshot 1`] = `
padding: 0 1rem;
opacity: 0;
visibility: hidden;
transition: opacity 200ms ease-out; }
transition: opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--large {
padding: 0.25rem 1rem; }
.dnb-tooltip--animate_position {
transition: all 300ms ease-in-out, opacity 200ms ease-out; }
transition: all 200ms cubic-bezier(0.42, 0, 0, 1), opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--active {
visibility: visible;
/*
because of the first \\"show\\" we also use animation
also, use forwards because of the usage of visibility
*/
animation: show-tooltip 200ms ease-out forwards; }
animation: show-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
html[data-visual-test] .dnb-tooltip--active, .dnb-tooltip--active.dnb-tooltip--no-animation {
animation: show-tooltip 1ms ease-out forwards; }
animation: show-tooltip 1ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide {
visibility: visible;
animation: hide-tooltip 200ms ease-in-out forwards; }
animation: hide-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide.dnb-tooltip--no-animation {
animation: hide-tooltip 1ms ease-out forwards; }
animation: hide-tooltip 1ms linear forwards; }
.dnb-tooltip--fixed {
position: fixed; }
html[data-visual-test] .dnb-tooltip--hide {
animation: hide-tooltip 1ms ease-out 1s forwards; }
animation: hide-tooltip 1ms linear 1s forwards; }
.dnb-tooltip__portal {
position: absolute;
top: 0;
Expand Down
14 changes: 7 additions & 7 deletions .../dnb-eufemia/src/components/input-masked/__tests__/__snapshots__/InputMasked.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -397,29 +397,29 @@ exports[`InputMasked scss have to match snapshot 1`] = `
padding: 0 1rem;
opacity: 0;
visibility: hidden;
transition: opacity 200ms ease-out; }
transition: opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--large {
padding: 0.25rem 1rem; }
.dnb-tooltip--animate_position {
transition: all 300ms ease-in-out, opacity 200ms ease-out; }
transition: all 200ms cubic-bezier(0.42, 0, 0, 1), opacity 200ms cubic-bezier(0.42, 0, 0, 1); }
.dnb-tooltip--active {
visibility: visible;
/*
because of the first \\"show\\" we also use animation
also, use forwards because of the usage of visibility
*/
animation: show-tooltip 200ms ease-out forwards; }
animation: show-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
html[data-visual-test] .dnb-tooltip--active, .dnb-tooltip--active.dnb-tooltip--no-animation {
animation: show-tooltip 1ms ease-out forwards; }
animation: show-tooltip 1ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide {
visibility: visible;
animation: hide-tooltip 200ms ease-in-out forwards; }
animation: hide-tooltip 200ms cubic-bezier(0.42, 0, 0, 1) forwards; }
.dnb-tooltip--hide.dnb-tooltip--no-animation {
animation: hide-tooltip 1ms ease-out forwards; }
animation: hide-tooltip 1ms linear forwards; }
.dnb-tooltip--fixed {
position: fixed; }
html[data-visual-test] .dnb-tooltip--hide {
animation: hide-tooltip 1ms ease-out 1s forwards; }
animation: hide-tooltip 1ms linear 1s forwards; }
.dnb-tooltip__portal {
position: absolute;
top: 0;
Expand Down
Loading

0 comments on commit c54c1d8

Please sign in to comment.