jjaybrown / ionic-material-design-lite

Material Design (Lite) style override for Ionic Framework
519 stars 129 forks source link

item-avatar is broken #65

Open JobaDiniz opened 9 years ago

JobaDiniz commented 9 years ago

capture

Code:

<ion-view view-title="Home">
  <ion-nav-title>
    <sos-header></sos-header>
  </ion-nav-title>

  <div class="bar bar-subheader">
    <h1 class="title">Agenda rápido</h1>
  </div>

  <ion-content class="padding has-subheader">
    <ion-list>
      <div ng-repeat="group in vm.groups">
        <div class="item item-divider">
          {{group.name}}
        </div>

        <div ng-if="group.loading" class="item">
          <ion-spinner></ion-spinner>
        </div>
        <div ng-if="group.error" class="item">
          {{group.error}}
        </div>

        <div ng-repeat="item in group.items" ng-if="!group.loading && !group.error">

          <a class="item item-avatar item-button-right" ui-sref="app.professional({id: item.id})">
            <img ng-src="{{item.avatar}}">
            <h2>{{item.name}}</h2>
            <p>{{item.services}}</p>

            <button class="button icon ion-calendar" ng-click="vm.openLightningSchedule()"></button>
          </a>

        </div>
      </div>
    </ion-list>
  </ion-content>
</ion-view>

Although there are ng-if there, I removed all dynamic data and added static html and still the list was rendered very wrong.

jjaybrown commented 9 years ago

I'll take a look at this now, I think there might be a class or piece of markup missing. I'll get back to you shortly.

joaogabriel commented 8 years ago

Any update about this?

jjaybrown commented 8 years ago

The HTML wasn't structured correctly, take a look at the examples in the repo. It demonstrates the correct HTML structure.