| Copybara bot | be50d49 | 2023-11-30 00:16:42 +0100 | [diff] [blame^] | 1 | <!-- List with avatar and controls --> |
| 2 | <style> |
| 3 | .demo-list-control { |
| 4 | width: 300px; |
| 5 | } |
| 6 | |
| 7 | .demo-list-radio { |
| 8 | display: inline; |
| 9 | } |
| 10 | </style> |
| 11 | |
| 12 | <ul class="demo-list-control mdl-list"> |
| 13 | <li class="mdl-list__item"> |
| 14 | <span class="mdl-list__item-primary-content"> |
| 15 | <i class="material-icons mdl-list__item-avatar">person</i> |
| 16 | Bryan Cranston |
| 17 | </span> |
| 18 | <span class="mdl-list__item-secondary-action"> |
| 19 | <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect" for="list-checkbox-1"> |
| 20 | <input type="checkbox" id="list-checkbox-1" class="mdl-checkbox__input" checked /> |
| 21 | </label> |
| 22 | </span> |
| 23 | </li> |
| 24 | <li class="mdl-list__item"> |
| 25 | <span class="mdl-list__item-primary-content"> |
| 26 | <i class="material-icons mdl-list__item-avatar">person</i> |
| 27 | Aaron Paul |
| 28 | </span> |
| 29 | <span class="mdl-list__item-secondary-action"> |
| 30 | <label class="demo-list-radio mdl-radio mdl-js-radio mdl-js-ripple-effect" for="list-option-1"> |
| 31 | <input type="radio" id="list-option-1" class="mdl-radio__button" name="options" value="1" checked /> |
| 32 | </label> |
| 33 | </span> |
| 34 | </li> |
| 35 | <li class="mdl-list__item"> |
| 36 | <span class="mdl-list__item-primary-content"> |
| 37 | <i class="material-icons mdl-list__item-avatar">person</i> |
| 38 | Bob Odenkirk |
| 39 | </span> |
| 40 | <span class="mdl-list__item-secondary-action"> |
| 41 | <label class="mdl-switch mdl-js-switch mdl-js-ripple-effect" for="list-switch-1"> |
| 42 | <input type="checkbox" id="list-switch-1" class="mdl-switch__input" checked /> |
| 43 | </label> |
| 44 | </span> |
| 45 | </li> |
| 46 | </ul> |