@dabapps/roe/src/less/content-box.less

A Collection of React Components for Project Development

.content-box {
  .clearfix();
  border-radius: @border-radius-base;
  border: @border-base;
  padding-left: @gutter-width / 2;
  padding-right: @gutter-width / 2;
  box-shadow: @shadow-subtle;
  background-color: @content-box-background;
  margin-top: @margin-large;
  margin-bottom: @margin-large;
}

.content-box-header {
  .clearfix();
  margin: 0 -@gutter-width / 2;
  padding: 0 @gutter-width / 2;
  border-top-left-radius: @border-radius-base;
  border-top-right-radius: @border-radius-base;
  background-color: @content-box-header-background;
  border-bottom: @content-box-header-border;
}

.content-box-footer {
  .content-box-header();
  background-color: @content-box-footer-background;
  border-top: @content-box-footer-border;
  border-bottom: @border-none;
  text-align: right;
  border-radius: 0;
  border-bottom-left-radius: @border-radius-base;
  border-bottom-right-radius: @border-radius-base;
}