Hyper: Emoji push the line they're on down into the line below

[lee-dohm]

In this screenshot, the top two lines and the bottom two lines are evenly spaced. But the middle line with the emoji is pushed downward and collides with the line below it. You can even see it when the row is highlighted in the Inspector:

This is the output of Homebrew's brew upgrade command, if you want to try and replicate it.

[martinwolf]

I guess I have the same issue.

[varjmes]

I have the same issue. I tried increasing the padding on x-rows (each line in the terminal appears to be an x-row) but the same thing still happened.

[montogeek]

Duplicate of https://github.com/zeit/hyperterm/issues/31
Removing emojis fixes the issue :)

[varjmes]

I'm just wondering if there is a way to fix it to allow us to keep emojis.
1: Homebrew uses emojis, many people have Homebrew.
2: Lots of people use emoji in the terminals now.

I am of course happy to help fix this, I just don't know how yet :D

[montogeek]

I would be more than happy if we found a way to solve it, I miss my emojis 😭

[danjessen]

Same problem here. Running Wild Cherry Theme this is really a issue:

I tried bumping the line height to 2em. This just fucks up the cursor:

[Twipped]

I noticed this immediately when I launched Hyperterm the first time. I have my shell prompt set to export PS1="🏠 \w $ " and it causes the cursor to be misaligned. I also noticed that the $ in my prompt gets erased when I start typing.

[scottluptowski]

Reposting this from the closed #290 issue

My terminal is set up so that next to the folder name I always display three emojis.

This is how it looks in bash:

This is how it looks in HyperTerm:

And to prove this is emoji related, and not related to the length of the string, I replaced the emoji with text:

[shockey]

I'm seeing the same:

[andersryanc]

Just add x-row { line-height: 1em; } to your termCSS config setting.

before:

after:

[jnsdrtlf]

This only happens when you use unicode characters that are not included in the font you are using.

For Example: I use Monaco so "▲" is displayed properly but any other emojis are not. When I switch to another font such as Space Mono that does not support "▲" then the lines are moved

[daveaspinall]

Adding x-row { line-height: 1em; } for me didn't fix the issue. I can modify the line height to work, but the cursor still overlaps the text because the emoji must be slightly wider than a standard character.

Any ideas? Kind of rules Hyper.app out for me unless this can be resolved 😭

[m10l]

Same issue too. I use emoji cat faces to determine whether there are changes to commit on a Git repo. It's incredibly important that these are cat faces. Incredibly.

[pablopunk]

@m10l offtopic, what colors/plugins do u use to get that scheme? 😁

[andersryanc]

@pablopunk looks kinda like the Atom Dark theme: https://www.npmjs.com/package/hyperterm-atom-dark

[dotcypress]

Related PR

[Twipped]

Do we need to make a new issue for the problem of unicode characters being too wide and throwing off the cursor position, like in @m10l's screenshot?

[m10l]

@pablopunk @andersryanc I'm using hyper-dark-dracula and modified version of the crunch zsh theme. You can grab it here - https://gist.github.com/m10l/753940d27e44a6e6f9e0a0f27b8a9cfb

[AndrewHamm]

@ChiperSoft Have you opened a new issue? The line height fix does not fix the horizontal overlapping for me.

You can see in this photo that the cursor is to the right of where the characters appear. As I type the characters do not appear where expected.

[Twipped]

My issue got corrected with the 1.0 release, so I didn't bother.