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

When editing, writing enough to require a scrollbar causes a slight rewrapping of all text #162

Open
OddBloke opened this issue Aug 8, 2019 · 3 comments

Comments

@OddBloke
Copy link

commented Aug 8, 2019

Describe the bug

When I write enough to need a scrollbar on the edit view, the content I'm writing gets rewrapped slightly. Not a big deal, but distracting when it happens.

Before:
writefreely-scrollbar-before

After:
writefreely-scrollbar-after

(There screenshots were created on a fairly narrow window, so that they weren't enormously wide, but the same issue occurs when the window is fullscreen on my 1920px wide screen and there is a gulf of empty space between the text and the scrollbar.)

Steps to reproduce (if necessary)

Steps to reproduce the behavior:

  1. Go to the edit view for a post
  2. Write a line of text that just doesn't wrap.
  3. Write many more lines of text, so a scrollbar appears

Expected behavior

The text area should have been unaffected by the scrollbar appearing.

Browser information

Google Chrome Version 76.0.3809.87 (Official Build) (64-bit) on Ubuntu 19.10

Application configuration

  • Single mode or Multi-user mode? Multi-user
  • Database? sqlite
  • Open registration? no
  • Federation enabled? yes

Version or last commit: 0.10

@thebaer thebaer added the design label Aug 9, 2019

@thebaer

This comment has been minimized.

Copy link
Member

commented Aug 9, 2019

Thanks for the input, @OddBloke. I think this is default Chrome (and probably other browsers) behavior -- hiding the scrollbar unless it's necessary.

Without any research, I'd assume we could add some custom-styled scrollbars to address this? Maybe that would force them to always show? If that's the solution, I'd just have concerns with accessibility and OSes (like macOS) that have system settings for hiding scrollbars.

@OddBloke

This comment has been minimized.

Copy link
Author

commented Aug 9, 2019

I'm not a front-end engineer at all, I'm afraid, so I won't have much useful input on a solution here.

To clarify, I do like the scrollbar only appearing once it's needed, I think that makes the experience much cleaner. It's the fact that its appearance causes text rewrapping that bugs me.

@robjloranger

This comment has been minimized.

Copy link
Member

commented Aug 18, 2019

I took a quick look and CSS alone won't save us AFAIK. But we could implement some javascript scroll bars that don't cause any reflow. Hiding the OS bars all the time, unless JS is disabled.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
3 participants
You can’t perform that action at this time.