Right border not showing

[martinmanzo]

Bug Report or Feature Request (mark with an x)

- [X] bug report -> please search issues before submitting
- [ ] feature request

Versions.

2.4.10

Repro steps.

• Create a switch with this options:
  <bSwitch
  [switch-base-class]="'bootstrap-switch'"
  [switch-wrapper-class]="'bootstrap-switch-wrapper'"
  [switch-off-text]="'Excluir'"
  [switch-on-text]="'Incluir'"
  [switch-size]="'small'"
  [switch-disabled]="false"
  [switch-readonly]="false"
  [switch-animate]="true"
  [switch-inverse]="false"
  [switch-handle-width]="60"
  [ngModel]="inc"
  (onChangeState)="modifyFilterInclusive($event, fld)">

and this is the result:

The log given by the failure.

None

Desired functionality.

Adding 2px to the width is enough to show the border, example:

Mention any other details that might be useful.

By looking at the source code the change should be made to this line:
https://github.com/JulioWar/jw-bootstrap-switch-ng2/blob/master/src/directive.ts#L32
<div class="{{ getWrapperClasses() }}" [style.width]=" (handleWidth + labelWidth ) +'px'">
and transform it into:
<div class="{{ getWrapperClasses() }}" [style.width]=" (handleWidth + labelWidth + 2) +'px'">

I could do a pull request if you need.

Thanks!

[JulioWar]

Hi @martinmanzo, I just wanna know why you are using the property switch-handle-width.

[martinmanzo]

Hi @JulioWar, thanks for the response. I had some Issues getting the switch to display correctly and turned into old issues to now if someone else had had the same problem and if there was a solution. I found this issue #2 and in an answer you state to try with that. I did it and the switch started to display correctly.

[JulioWar]

Ok, I understand. Can you please make the pull request I gonna take the time to test that on my side. Thanks

[martinmanzo]

Sure, I'll do it in the next days.
Thanks!

[hashmed]

This is still an issue. Fix that @martinmanzo suggested seems to work.
Why not upgrade it? This is by far the best switch toggle package out there (for Angular), and the missing right border is so...difficult to look at.

[JulioWar]

Hi @hashmed

This an issue that I can't reproduce and I don't know if I make this changes, others can be affected. people using this package that doesn't have this issue. That is the case for me.
I have a demo site for this package here: https://juliowar.github.io/jw-bootstrap-switch-ng2/

Can you tell me if you see the issue there ?

Because that demo is based on the same code and on my side I don't see the issue

Thanks in advance for using my package 👍

[hashmed]

@JulioWar
Oh, I didn't know that was the case. Applying the "fix" might do more damage then, for sure.

I do not see the issue on demo site, border is there. I'm now suspecting that some other css files might be interfering with it. I will let you know if I pinpoint the issue.

But your library is probably good as it is. :)