Contents

//
// Pills
//

%rf-pill--neutral {
  border-color: $blue-bright;
  color: $blue-bright;
}

%rf-pill--minor {
  border-color: $stormy;
  color: $stormy;
}

.rf-pill {
  border-radius: 20px;
  border-style: solid;
  border-width: 2px;
  font-size: 10px;
  font-weight: 600;
  height: 18px;
  line-height: 14px;
  padding: 0 6px;
  text-transform: uppercase;
  white-space: nowrap;
}

.rf-pill--neutral {
  border-color: $blue-bright;
  color: $blue-bright;
}

.rf-pill--neutral--secondary {
  border-color: $periwinkle;
  color: $periwinkle;
}

.rf-pill--fail {
  border-color: $red;
  color: $red;
}

.rf-pill--success {
  border-color: $green;
  color: $green;
}

.rf-pill--warning {
  border-color: $gold;
  color: $gold;
}

.rf-pill--minor {
  border-color: $stormy;
  color: $stormy;
}

.rf-pill--met,
%rf-pill--met {
  @extend %rf-pill--neutral;

  &:before {
    content: "\e013";
    font-family: $font-icon-g;
    font-size: 8px;
    margin-right: 2px;
  }
}

.rf-pill--unmet,
%rf-pill--unmet {
  @extend %rf-pill--minor;

  &:before {
    content: "\e014";
    font-family: $font-icon-g;
    font-size: 8px;
    margin-right: 2px;
  }
}

// Solid pills

.rf-pill--solid {
  background-color: $prewhite;
  border-color: $prewhite;
}

Version data entries

3 entries across 3 versions & 1 rubygems

Version	Path
ethosstyles-0.1.19	app/assets/stylesheets/components/_pills.scss
ethosstyles-0.1.18	app/assets/stylesheets/components/_pills.scss
ethosstyles-0.1.14	app/assets/stylesheets/components/_pills.scss