article.less

// Name:            Article
// Description:     Define style for article
//
// Component:       `am-article`
//
// Sub-objects:     `am-article-title`
//                  `am-article-meta`
//                  `am-article-lead`
//                  `am-article-divider`
//
// ========================================================================

/* ========================================================================
   Component: Article
 ========================================================================== */

.am-article {
  .clearfix();

  & > :last-child {
    margin-bottom: 0; // Remove margin from last-child
  }

  & + .am-article {
    margin-top: @article-margin-top;
  }
}



/* Sub-object `am-article-title` */

.am-article-title {
  font-size: @article-title-font-size;
  line-height: @article-title-line-height;
  font-weight: @article-title-font-weight;

  a {
    color: inherit;
    text-decoration: none;
  }

  .hook-article-title;
}


/* Sub-object `am-article-meta` */

.am-article-meta {
  font-size: @article-meta-font-size;
  line-height: @article-meta-line-height;
  color: @article-meta-color;
  .hook-article-meta;
}


/* Sub-object `am-article-lead` */

.am-article-lead {
  color: @article-lead-color;
  font-size: @article-lead-font-size;
  line-height: @article-lead-line-height;
  border: 1px solid #dedede;
  border-radius: 2px;
  background: #f9f9f9;
  padding: 10px;
  .hook-article-lead;
}


/* Sub-object `am-article-divider` */

.am-article-divider {
  margin-bottom: @article-divider-margin;
  border-color: @article-divider-border;
  .hook-article-divider;
  * + & {
    margin-top: @article-divider-margin;
  }
}


.am-article-bd {
  blockquote {
    font-family: @font-family-kai;
  }

}


// Hooks

.hook-article-title() {}
.hook-article-meta() {}
.hook-article-lead() {}
.hook-article-divider() {}