gmiclotte / gear-optimizer

Gear optimizer for NGU Idle.
25 stars 19 forks source link

Add searchable field for optimization factors #108

Closed pandahaiku closed 3 months ago

pandahaiku commented 5 months ago

Added the ability to search in the dropdown field using react-select. Sometimes it was difficult to find the factor I wanted to optimize on, this should help in finding what you want faster. If someone has more experience with react styling, feel free to modify this as I kind of eyeballed it until it looked good. example-1 example-2

gmiclotte commented 3 months ago

Oh that seems useful indeed. This should now be live in NGU Idle Gear Optimizer v0.9.4. I have no idea about the styling, looks good enough to me.

Thanks a lot!

jshepler commented 3 months ago

Didn't account for dark mode. Drop down isn't rendered correctly.

jshepler commented 3 months ago

It also renders behind to two big bottom panels:

image

jshepler commented 3 months ago

Also, can't the -+ slots setting be on the right of the drop down? there's plenty of space and being on the next line makes it feel bulky to me.

gmiclotte commented 3 months ago

@jshepler thanks for the feedback, should be better in v0.9.6. Haven't touched the "-+ slots" positioning yet though.

jshepler commented 2 days ago

Been a few months and don't know if you forgot, couldn't figure stuff out, or just decided to not bother; but thought I'd ping ya...

I'm still bothered by this: image

I don't know if it only looks that bad on chrome, but I played a little in dev tools and got: image

Searched for where to make changes:

at https://github.com/gmiclotte/gear-optimizer/blob/master/src/components/FactorForm/FactorForm.js#L41 change alignItems to 'center', change flexDirection to 'row' (or just remove it since row is default), and delete marginTop

at https://github.com/gmiclotte/gear-optimizer/blob/master/src/components/FactorForm/FactorForm.js#L77 change width to 190 so that "infinity" doesn't wrap image

or maybe mark the text with no-wrap but not sure if it would then get clipped on the right, or worse - overflow.

Found the big block of space between the control and the slot buttons is left over from the transform: 'scale(0.8)' on the line after the width.

Also, I think it'd be nice if we could get rid of the ridiculous padding inside the control: image

Might even get 4 priorities to show, :P