Fix CSS issue for mobile devices in twoslash module #21
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.
This pull request includes several changes to improve the handling and display of tooltips and popups in the
twoslash
package, particularly for mobile devices. The most important changes include fixing CSS issues, adjusting tooltip positioning, and modifying the width of popup elements.Improvements to tooltip handling:
packages/twoslash/src/module-code/popup.js
: Adjusted themaxWidth
property to ensure tooltips are properly sized on all screen types.packages/twoslash/src/module-code/popup.js
: Changed theleft
property to position tooltips more appropriately on mobile screens.CSS adjustments:
.changeset/friendly-brooms-tap.md
: Added a changeset entry to document the fix for a small CSS issue on mobile devices.packages/twoslash/src/styles.ts
: Modified the.twoslash-popup-code
class to set the width to100%
and removed themin-width
property for better layout consistency.packages/twoslash/src/styles.ts
: Added styles for the::-webkit-scrollbar-corner
pseudo-element to ensure a transparent background and zero dimensions.