_block-list.css.scss 794 B

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. /*------------------------------------*\
  2. $BLOCK-LIST
  3. \*------------------------------------*/
  4. /**
  5. * Create big blocky lists of content, e.g.:
  6. *
  7. <ul class=block-list>
  8. <li>Foo</li>
  9. <li>Bar</li>
  10. <li>Baz</li>
  11. <li><a href=# class=block-list__link>Foo Bar Baz</a></li>
  12. </ul>
  13. *
  14. * Extend this object in your theme stylesheet.
  15. *
  16. * Demo: jsfiddle.net/inuitcss/hR57q
  17. *
  18. */
  19. .block-list{
  20. &,
  21. > li{
  22. border:0 solid $base-ui-color;
  23. }
  24. }
  25. .block-list{
  26. list-style:none;
  27. margin-left:0;
  28. border-top-width:1px;
  29. > li{
  30. border-bottom-width:1px;
  31. padding:$half-spacing-unit;
  32. }
  33. }
  34. .block-list__link{
  35. display:block;
  36. padding:$half-spacing-unit;
  37. margin:-$half-spacing-unit;
  38. }