timeline: fix vis-item-content width

[raphink]

In order to place content in bars, timeline pushes vis-item-content to the right with things like:

<div class="vis-item-content" style="left: 564.664px;"

When using large content, this leads to the content overflowing the div:

By adjusting the width, this can be fixed:

<div class="vis-item-content" style="left: 564.664px;width: calc(100% - 564.664px);"

[raphink]

I attached code to this issue, which fixes it in the most common case (align = auto, rtl = false)

[AlexDM0]

Hi, is this supported in all browsers? What happens if it's not?

Thanks for helping out!

[AlexDM0]

On a side note, we can only accept pulls to the dev branch. Could you resubmit it?

[raphink]

I haven't had issues with the browsers I tried.

I'm using this on http://raphink.info if you want to test.

I can definitely resubmit against the dev branch if necessary.

[AlexDM0]

It looks a little broken on a phone actually.. 100% is not that much there

[raphink]

@AlexDM0 oh? What phone are you using?

[AlexDM0]

iPhone 6s

http://www.avalondesigns.nl/dropbox/files/image.png

[raphink]

Ah, you mean the bars on the right. They've very small indeed. You can get info if you zoom on them (not sure if pinching works on iPhone though, it doesn't work on iPad). I don't know how to improve that. Maybe a zooming button on bars?

[AlexDM0]

I'm not sure I want to head in that direction... For your usecase it might
work but I'm not gonna add it to vis.. It's a bit unpredictable.

Regards

On Thu, May 19, 2016 at 11:03 AM, Raphaël Pinson notifications@github.com
wrote:

Ah, you mean the bars on the right. They've very small indeed. You can get
info if you zoom on them (not sure if pinching works on iPhone though, it
doesn't work on iPad). I don't know how to improve that. Maybe a zooming
button on bars?

—
You are receiving this because you were mentioned.
Reply to this email directly or view it on GitHub
#1853 (comment)

[raphink]

@AlexDM0 I'm not sure to understand your point. The screenshot you took would look exactly the same without the patch (because I've set end dates to be now). The difference is when you click on a bar, as there is a lot of content that is shown then, and would be hidden after the red vertical bar without the patch.

[AlexDM0]

I see now, sorry, I was under the impression that you were modifying the outer div.

If you can redo a pull to the develop branch I'll add it since I cant accept a pull to the master branch.