third_party/ot-br-posix/repo/third_party/mdl/repo/src/card/snippets/image.html

   1 <!-- Image card -->
   2 <style>
   3 .demo-card-image.mdl-card {
   4   width: 256px;
   5   height: 256px;
   6   background: url('../assets/demos/image_card.jpg') center / cover;
   7 }
   8 .demo-card-image > .mdl-card__actions {
   9   height: 52px;
  10   padding: 16px;
  11   background: rgba(0, 0, 0, 0.2);
  12 }
  13 .demo-card-image__filename {
  14   color: #fff;
  15   font-size: 14px;
  16   font-weight: 500;
  17 }
  18 </style>
  19
  20 <div class="demo-card-image mdl-card mdl-shadow--2dp">
  21   <div class="mdl-card__title mdl-card--expand"></div>
  22   <div class="mdl-card__actions">
  23     <span class="demo-card-image__filename">Image.jpg</span>
  24   </div>
  25 </div>