Selection highlight misaligned on line selection

[marfarma]

Place cursor at the far left edge of a line. Hold down Shift key and hit the down arrow. Selection highlight is misaligned.

Of note, there are no spaces infront of the variable github

[petetnt]

There's a fix pending in #12110 🚒

[toferj]

@petetnt I followed your link to issue #12110, but I'm not sure if there's something I can do right now to fix this, or if I just need to wait for the next release. There you said, "This PR compensates for that by pulling the editor back -4 pixels". I don't know what a PR is. Sorry. :(

This misalignment, while not causing a work stoppage for me, is super-annoying.

edit: It just dawned on me that "PR" is pull request. Duh. Still is there a way for me to fix this now, that I'm just not understanding?

Thanks

[toferj]

Never mind. I did manage to find .CodeMirror-lines in brackets.min.css and add the margin-left: -4px. I'm not sure if I was meant to do that by hand or if there was some clever way of getting that out of git, but at least the misalignment is gone.

If there was a better way to do this besides me manually updating the brackets.min.css file, I'd be glad to be told what it was.

Thanks again.

[petetnt]

@topherJ No need to be sorry! The quick way is to just edit the .css file manually.

Other (proper) way is to use an dev build of Brackets. How to Hack on Brackets is the basic guide, but just to add the patch steps are as follows:

1. Install the latest Brackets build
2. Clone your fork of the repo: git clone https://github.com/adobe/brackets
3. Fetch submodules: cd brackets and git submodule update --init
4. Run setup_for_hacking script under the tools/ folder.

When you launch Brackets, you should notice that you are running the dev build

Then, again in the brackets folder:

1. Add my fork of Brackets as an origin git remote add petetnt https://github.com/petetnt/brackets
2. Fetch my fix branch git fetch petetnt petetnt/indent-wrap-minor-fix
3. Merge it to your master branch git merge petetnt/petetnt/indent-wrap-minor-fix

and reload Brackets. You should now notice that the issue should be fixed

[toferj]

Thanks @petetnt! :)
Did you notice that the margin-left: -4px fix seems to also throw off the click target of the code folding arrows in the gutter? Clicking on the arrow no longer works, but clicking just to the right of the arrow (probably by about 4px) folds/unfolds the code block.

Will this be addressed in the real fix for this on the next Brackets update?

[petetnt]

@topherJ Which theme are you using? And which operating system are you on?

The fold arrows work correctly for me (and in correct position)... do you see a similar gutter between the content and other stuff like in #12110 (comment).

[toferj]

@petetnt I'm using the Brackets Dark theme, on Windows 7 Pro SP1 64-bit. I do see a similar gutter like in #12110 (see below)...

[petetnt]

@topherJ Super weird, as I just tried a fresh copy on a Mac and everything alright there too (as they are on my work PC which is a Windows 8 machine and the one I am writing this on is Win10).

Do you see the gutter if you launch without extensions (Debug -> Reload without Extensions)?

[toferj]

@petetnt I do get the same thing if I reload without extensions. Something I didn't really notice before is that I need to click exactly on that little space between the gutter and the line highlight in order to get code folding to work. Clicking on the arrow itself does nothing. Weird.

[ficristo]

Fixed by #12110
Will be in 1.8