test.scss

/* ==============================================================
   Text
   ============================================================== */


//---------------------------------------------------------------
// Base
//---------------------------------------------------------------


/*
Text

Generic styles for a block of text (such as a post)

Styleguide 3.3
*/

.pii--text {
  
  $common-selectors: p, ul, ol, a, h1, h2, h3;
  
  // Add Common Spacing

  #{$common-selectors} {
    @extend %pii--type-body;
    @include aa-type;

    @each $selector in $common-selectors {
      & + #{$selector} {
        margin-top: rem(20);
      }
    }
  }

  // Headings

  h1, h2, h3 {
    @extend %pii--type-aside-title;
    @extend %caps;
    @include aa-type-normal;
    color: color(ltnavy);
    margin-top: rem(40) !important;
  }

  ul, ol {
    padding-left: pem(45);
  }

  // Spacing for Images

  p:not(:first-child) img {
    margin-top: rem(35);
  }

  p:not(:last-child) img {
    margin-bottom: rem(23);
  }

  .wrap_githubgist {
    margin-top: rem(35);
    margin-bottom: rem(23);

    .gist-meta {
      font-size: pem(14, 17);
    }
  }
  
  // Images with Captions

  figure {
    width: 100% !important;
    margin-bottom: rem(40);
    
    img {
      margin-bottom: rem(20);
    }

    figcaption {
      @extend %pii--type-small;
      color: color(softgray);
    }
  }

  // Embed Content (e.g. videos)
  .entry-content-asset {
    margin: rem(35) 0;
  }
}