TypeStrong / atom-typescript

The only TypeScript package you will ever need
https://atom.io/packages/atom-typescript
MIT License
1.13k stars 205 forks source link

fix: Rename input is unusably small #1496

Closed Xapphire13 closed 5 years ago

Xapphire13 commented 5 years ago

Before

Screen Shot 2019-03-28 at 4 44 33 PM

After

Screen Shot 2019-04-03 at 12 07 17 PM
lierdakil commented 5 years ago

Uh. It shouldn't look like this. Why does it look like this?

Generally the "rename variable... etc" text should be above the input box. At least this was the case with all Atom versions up to 1.34 (as far as I can recall)

Are you using some kind of custom theme? Did this change in a recent Atom release? What's going on here?

lierdakil commented 5 years ago

Tested with Atom 1.35.1. Everything behaves as it should: rename variable dialog rendered as intended

It would appear something in your environment sets display: flex; flex-direction:row on the block css class. Pretty sure this is not Atom's default.

Xapphire13 commented 5 years ago

Interesting. Let me see if I can identify what is causing this, I dont use any custom themes, so it must be a bad package

Xapphire13 commented 5 years ago

I took a look and nothing is setting block to have flex-direction: row, in fact, nothing is setting the flex-direction style on it at all, so it's just defaulting to row.

Screen Shot 2019-04-03 at 11 56 45 AM

I could update my PR to include styling for this?

Xapphire13 commented 5 years ago

I have updated the PR with the styling required to get it looking exactly as you have it

lierdakil commented 5 years ago

nothing is setting block to have flex-direction: row

Why does it have display: flex; though? Where does that come from? Atom's default is display: block (edit: well, actually, Atom's default is no display property explicitly set at all, and for divs the default value is block)

Xapphire13 commented 5 years ago

Does it not make sense to have the style explicitly set for the input, as to avoid being messed up by other extensions?

lierdakil commented 5 years ago

The point is we don't have any control over "other extensions", and themes might include arbitrary overrides which we don't want to mess up. So with CSS the general rule I think should be "less is more". If you figure out which particular extension is messing up your stylesheets here, then we can discuss this further to resolve this particular conflict.

FWIW, div.block is a default Atom thing, which is supposed to have display:block I think, so whatever messes up your stylesheet breaks more than Atom-TypeScript.