rpocklin / angular-timeline

An Angular.JS directive that generates a responsive, data-driven vertical timeline to tell a story, show history or describe a sequence of events.
Other
417 stars 108 forks source link

Full Page #25

Open steven10172 opened 8 years ago

steven10172 commented 8 years ago

When using side left or side right the timeline should use the full width that it has available

ronycohen commented 8 years ago

+1 Thank you so much for this lib !

rpocklin commented 8 years ago

Sounds like an easy fix, PR is welcome.

lewma commented 8 years ago

Take a look at #31 I commented on how I fixed the problem

suryasarafe1 commented 7 years ago

@lewma thanks for the solution..

but i add some css and make it easier to use .sae .timeline:before {left: 40px; } .sae .timeline timeline-panel {width: calc(100% - 85px)!important; width: -moz-calc(100% - 85px)!important; width: -webkit-calc(100% - 85px)!important; } .sae .timeline timeline-badge {left: 15px!important; margin-left: 0!important; top: 36px!important; } .sae .timeline timeline-panel {float: right!important; } .sae .timeline timeline-panel:before {border-left-width: 0!important; border-right-width: 15px!important; left: -15px!important; right: auto!important; top: 46px!important; } .sae .timeline timeline-panel:after {border-left-width: 0!important; border-right-width: 14px!important; left: -14px!important; right: auto!important; top: 47px!important; }

and i just use like <timeline class="sae"> // as the regular code </timeline>

and it make bigger of course, thanks anyway