### Description - text input was changed because it renders an empty div as the right icon, but the margin and padding affect the layout - we have duplicated code on ExpandedWidthAnimationVariants.ts, because of an eslint rule that prevents more than one const definition, can we ignore the rule? - ### Demo <https://www.loom.com/share/17a37bf5549a4a23ba12343b6046ec6b?sid=4cf297f3-66db-44c9-9a9b-7bde89b90d02> ### Refs <https://github.com/twentyhq/twenty/issues/6146> --------- Co-authored-by: gitstart-twenty <gitstart-twenty@users.noreply.github.com> Co-authored-by: gitstart-twenty <140154534+gitstart-twenty@users.noreply.github.com> Co-authored-by: Marie Stoppa <marie.stoppa@essec.edu>
32 lines
895 B
TypeScript
32 lines
895 B
TypeScript
import { ADVANCED_SETTINGS_ANIMATION_DURATION } from '@/settings/constants/AdvancedSettingsAnimationDurations';
|
|
|
|
export const EXPANDED_WIDTH_ANIMATION_VARIANTS = {
|
|
initial: {
|
|
opacity: 0,
|
|
width: 0,
|
|
overflow: 'hidden',
|
|
transition: {
|
|
opacity: { duration: ADVANCED_SETTINGS_ANIMATION_DURATION.opacity },
|
|
width: { duration: ADVANCED_SETTINGS_ANIMATION_DURATION.size },
|
|
},
|
|
},
|
|
animate: {
|
|
opacity: 1,
|
|
width: '100%',
|
|
overflow: 'hidden',
|
|
transition: {
|
|
opacity: { duration: ADVANCED_SETTINGS_ANIMATION_DURATION.opacity },
|
|
width: { duration: ADVANCED_SETTINGS_ANIMATION_DURATION.size },
|
|
},
|
|
},
|
|
exit: {
|
|
opacity: 0,
|
|
width: 0,
|
|
overflow: 'hidden',
|
|
transition: {
|
|
opacity: { duration: ADVANCED_SETTINGS_ANIMATION_DURATION.opacity },
|
|
width: { duration: ADVANCED_SETTINGS_ANIMATION_DURATION.size },
|
|
},
|
|
},
|
|
};
|