Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Placement of user avatar off in Safari/Webkit #44

Closed
samplereality opened this issue Jun 19, 2023 · 1 comment
Closed

Placement of user avatar off in Safari/Webkit #44

samplereality opened this issue Jun 19, 2023 · 1 comment

Comments

@samplereality
Copy link

The "you" avatar/circle that should appear to the right of the user's text messages overlaps with the message itself on current Safari/webkit browsers. This effectively means it shows up incorrectly on any iOS device, regardless of the browser (because Apple requires all mobile browsers to use webkit). Example:

image

It appears to be a problem with the ::after pseudoelement. I don't know CSS well enough to know how how to fix this across all devices. But, adding this webkit-specific CSS seems to fix the problem on recent versions of iOS/Safari:

_::-webkit-full-page-media, _:future, :root .chat-passage-wrapper[data-speaker="you"]::after {
  /* Safari 10.1+ */
	margin-left: 5px;
}
@samplereality
Copy link
Author

The latest updates to Safari/webkit seems to have fixed this bug.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant