search

Hellowlol / HTPC-Manager

A fully responsive interface to manage all your favorite software on your Htpc.
MIT License
344 stars 48 forks source link

Bootstrap Switch height issue #524

Closed marsderp closed 7 years ago

marsderp commented 7 years ago

image

On Firefox and Chrome, cache-refreshed. I've had this problem since forever.

Hellowlol commented 7 years ago

Is this only the moonlight theme or all of them?

marsderp commented 7 years ago

It's on every theme.

Hellowlol commented 7 years ago

Can I have the version number of chrome and firedfox your using? Does this happen on only this switch box or all of them?

marsderp commented 7 years ago

Currently Firefox 50, Chrome 55.

All the switches have the same issue unfortunately. Here's on twilight theme:

image

marsderp commented 7 years ago

After a little investigation, it seems like the width of bootstrap-switch-container set at 109px is causing my issue. Increasing it by 1px fixes it, alternatively bootstrap-switch-label's width decreased by 1px fixes it too.

Hellowlol commented 7 years ago

What screen resolution do you use?

marsderp commented 7 years ago

1920x1080

Hellowlol commented 7 years ago

Ah, can you send a pr?

marsderp commented 7 years ago

Thing is I'm not sure where's the script that's setting this width.

default.js only has $("[type='checkbox']").bootstrapSwitch();

marsderp commented 7 years ago

I believe I have found the real cause of this issue.

The border-left and border-right rules in .bootstrap-switch .bootstrap-switch-label in xl.bootstrap.min.css within all the theme files is set to 1px while the default bootstrap-switch's style does not. Removing the borders should not affect the visuals.

How should we go about this?

Fma965 commented 7 years ago

Hi this happens to me at 4k when using Windows scaling are you using Windows scaling by any chance?

Hellowlol commented 7 years ago

@raysguy Dunno if you still using htpc manager, but we are still using your themes! Any chance you can take a look on this issue?