Contents

.bullets {
  ///////////////////////////////////////////////////////////////////////////////////
  $base-line-height: 1.5em !default;
  $base-accent-color: #477DCA !default;
  $base-link-color: $base-accent-color !default;
  $dark-gray: #333 !default;
  $base-font-color: $dark-gray !default;
  
  padding: 0;

  h2 {
    margin: 0;
  }

  li {
    list-style: none;
  }

  p {
    color: $base-font-color;
    line-height: $base-line-height;
  }

  img {
    max-width: 100%;
  }
  //////////////////////////////////////////////////////////////////////////////////

  $icon-bullet-size: 3.5em;

  @include display(flex);
  @include flex-wrap(wrap);
  margin-bottom: $base-line-height;
  margin: 1em;
  overflow: auto;

  .bullet {
    @include flex-basis(20em);
    @include flex-grow(1);
  }

  .bullet-icon {
    background: $base-accent-color;
    border-radius: 50%;
    float: left;
    height: $icon-bullet-size;
    padding: $icon-bullet-size / 4;
    width: $icon-bullet-size;
  }

  .bullet-icon-1 {
    background: $base-accent-color;
  }

  .bullet-icon-2 {
    background: adjust-hue($base-accent-color, -50%);
  }

  .bullet-icon-3 {
    background: adjust-hue($base-accent-color, -140%);
  }

  .bullet-content {
    margin-left: $icon-bullet-size * 1.4;
    margin-bottom: 2em;
  }

  h2 {
    border-bottom: 1px solid transparentize($base-font-color, 0.8);
    display: inline-block;
    font-size: $icon-bullet-size / 2.5;
    margin-bottom: $icon-bullet-size / 6;
    padding-top: $icon-bullet-size / 7;
  }
}

Version data entries

1 entries across 1 versions & 1 rubygems

Version	Path
refills-0.1.0	source/stylesheets/refills/_icon-bullet-points.scss