// List
//
// List of items. You can use the `.with-lists` class to apply list styles to all `ol` and `ul`
// within a container, for example when styling Markdown content.
//
// .-compacted - Closely spaced list elements.
//
// Markup:
//   <p>An unordered list:</p>
//   <ul class="list {{modifier_class}}">
//     <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In non pretium risus. Sed ultrices dolor magna, in ultricies sapien ornare ac.</li>
//     <li>Curabitur sed odio aliquet, efficitur diam vel, laoreet ipsum. Curabitur faucibus tincidunt augue.</li>
//     <li>In non pretium risus. Sed ultrices dolor magna, in ultricies sapien ornare ac.</li>
//   </ul>
//   <p>And an ordered list:</p>
//   <ol class="list {{modifier_class}}">
//     <li>Know it.</li>
//     <li>Plan it.</li>
//     <li>???</li>
//     <li>Profit.</li>
//   </ol>
//
// Styleguide List
.list {
  padding-left: $base-spacing;

  li + li {
    margin-top: ($base-spacing / 2);
  }

  &.-compacted {
    li + li {
      margin-top: 0;
    }
  }
}

ul.list {
  list-style-type: square;
}

ol.list {
  list-style-type: decimal;
}

.with-lists {
  ul, ol {
    padding-left: $base-spacing;
  }

  ul {
    list-style-type: square;
  }

  ol {
    list-style-type: decimal;
  }

  li + li {
    margin-top: ($base-spacing / 2);
  }

  &.-compacted {
    li + li {
      margin-top: 0;
    }
  }

  &.-concatenated {
    ul + ul {
      margin-top: 0;
    }
  }
}