angular-sly icon indicating copy to clipboard operation
angular-sly copied to clipboard

'slidee' element always set to width: 0px

Open sweatherall opened this issue 10 years ago • 3 comments

For some reason my .slidee element is always initialized to 'width: 0px'.

Here is my view code somewhat simplified (in jade):

#sliderbox-container
  .scrollbar#slyscrollbar
      .handle
        .mousearea
  .frame(sly-horizontal)
    ul.slidee
      li.daywithtimeslots(ng-repeat="day in dayswithappts()" sly-horizontal-repeat sly-options="{itemNav: 'centered', startAt: 1}")
        .dateheader
          h2.date {{ day.format('M') }}/{{ day.format('D') }}
          span.weekday {{ day.format('dddd') }}
        .timeslot-box
          ul.timeslots
            li timeslot

here is my style code (less):

#sliderbox-container {
        .frame {
          height: 500px;
          margin: 0px 0px;
          padding: 10px 0px; //(ver,hor)
          overflow: hidden;
          width: 100%;
        }
        .slidee {
          list-style: none;
          margin: 0;
          padding: 0;
          height: 100%;
        }
        .slidee li {
          float: left;
          height: 100%;
          margin: 0 5px 0 0;
          width: 175px;
          text-align: center;
          cursor: pointer;
        }
        .scrollbar {
          margin: 0 0 1em 0;
          height: 2px;
          background: #ccc;
          line-height: 0;
        }
        .scrollbar .handle {
          width: 100px;
          height: 100%;
          background: #292a33;
          cursor: pointer;
        }
        .scrollbar .handle .mousearea {
          position: absolute;
          top: -9px;
          left: 0;
          width: 100%;
          height: 20px;
        }

      }

when it loads, I can see that the 'dragged' class gets added when I do a drag action, and the translateX amount gets changed, but the ul.slidee is always width:0px and therefore when I drag it doesnt allow the move to 'stick'.. i.e. it gets dragged as long as I am doing the action but it just 'bounces' back to the start position, also only the first li element shows up since there is no width.

What is incorrect that is making it not calculate the slidee width initially?

** NOTE: this is in a directive with isolate scope, if that effects anything.

sweatherall avatar Sep 03 '15 16:09 sweatherall

Hey, I just saw this now, apologies.

I will take a look at it this week or so. Sorry, busy week.

gigerbytes avatar Sep 06 '15 17:09 gigerbytes

no worries, @gigerbytes. thanks for taking a look.

sweatherall avatar Sep 07 '15 04:09 sweatherall

Sorry, I haven't used jade before.

Just an idea, have you tried setting a 'min-width' to the slidee, just to see if it /might/ work?

gigerbytes avatar Sep 13 '15 11:09 gigerbytes