fix(Link): Remove ripple part of Link by disabling Tappable hoverMode #7088
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Описание
Из-за того, что у компонентов Link всегда рендерится часть Tappable для ripple-эффекта, спозиционированная абсолютно, Link не прячется в Safari вместе с контентом если контент переполнил родительский элемент.
Это, конечно, странное поведение Safari, но и у нас довольно странно в DOM вставлять Ripple компонент, который для Link совсем не нужен.
Изменения
Руководствуясь условием в
Tappable
, по которому мы рендерим Ripple компонентVKUI/packages/vkui/src/components/Tappable/Tappable.tsx
Lines 74 to 76 in 92d8c08
мы убираем hoverMode="none" у
Link
.Это безопасно, потому что hoverMode="background" у
Tappable
есть по умолчанию и управляет он фоном, которого у Link нету. Так что на Link это никак не повлияет.VKUI/packages/vkui/src/components/Tappable/Tappable.module.css
Lines 64 to 67 in 92d8c08
VKUI/packages/vkui/src/components/Link/Link.module.css
Line 4 in 92d8c08
Изображения