unepwcmc/SAPI

View on GitHub
app/assets/stylesheets/species/species_listings.scss

Summary

Maintainability
Test Coverage
.cms_appendix {
  height: 26px;
  width: 26px;

  color: #fff;

  .a_I &, &.a_I {
    background: image-url('species/cms-appendix.png');
    background-position: 0px 0px;
    span {
      line-height: 2em;
      margin-left: 10px;
    }
  }

  .a_II &, &.a_II {
    background: image-url('species/cms-appendix.png');
    background-position: 0px 52px;
    span {
      line-height: 2em;
      margin-left: 9px;
    }
  }

  .a_nc &, .inactive &, &.a_nc, &.inactive {
    background: image-url('species/cms-appendix.png');
    background-position: 0px 26px;
  }

}

.cites_appendix {
  height: 26px;
  width: 26px;
  color: #fff;

  .a_I &, &.a_I {
    background: image-url('species/cites-appendix.png');
    background-position: 0px 0px;
    span {
    line-height: 1.95em;
    margin-left: 11px;
    }
  }

  .x_I &, &.x_I {
    background: image-url('species/cites-appendix.png');
    background-position: 0px 156px;
    width: 44px;
    span {
      line-height: 1.95em;
      margin-left: 11px;
    }
    span.subscript{
      text-transform: uppercase;
      display: block;
      font-size: 11px;
      margin: -24px 0 0 30px;
    }
  }

  .r_I &, &.r_I {
    background: image-url('species/cites-appendix.png');
    background-position: 0px 78px;
    width: 44px;
    span {
      line-height: 1.95em;
      margin-left: 11px;
    }
    span.subscript{
      text-transform: uppercase;
      display: block;
      font-size: 11px;
      margin: -25px 0 0 30px;
    }
  }

  .w_I &, &.w_I {
    background: image-url('species/cites-appendix.png');
    background-position: 0px 78px;
    width: 44px;
    span {
      line-height: 1.95em;
      margin-left: 11px;
    }
    span.subscript{
      text-transform: uppercase;
      display: block;
      font-size: 11px;
      margin: -25px 0 0 29px;
    }
  }

  .a_II &, &.a_II {
    background: image-url('species/cites-appendix.png');
    background-position: 0px 234px;
    span {
      line-height: 2em;
      margin-left: 9px;
    }
  }

  .x_II &, &.x_II {
    background: image-url('species/cites-appendix.png');
    background-position: 0px 130px;
    width: 44px;
    span {
      line-height: 2em;
      margin-left: 9px;
    }
    span.subscript{
      text-transform: uppercase;
      display: block;
      font-size: 11px;
      margin: -24px 0 0 30px;
    }
  }

  .r_II &, &.r_II {
    background: image-url('species/cites-appendix.png');
    background-position: 0px 52px;
    width: 44px;
    span {
      line-height: 2em;
      margin-left: 9px;
    }
    span.subscript{
      text-transform: uppercase;
      display: block;
      font-size: 11px;
      margin: -26px 0 0 31px;
    }
  }


  .w_II &, &.w_II {
    background: image-url('species/cites-appendix.png');
    background-position: 0px 52px;
    width: 44px;
    span {
      line-height: 2em;
      margin-left: 9px;
    }
    span.subscript{
      text-transform: uppercase;
      display: block;
      font-size: 11px;
      margin: -25px 0 0 29px;
    }
  }

  .a_III &, &.a_III {
    background: image-url('species/cites-appendix.png');
    background-position: 0px 208px;
    span {
      line-height: 2em;
      margin-left: 7.5px;
    }
  }

  .x_III &, &.x_III {
    background: image-url('species/cites-appendix.png');
    background-position: 0px 104px;
    width: 44px;
    span {
      line-height: 2em;
      margin-left: 7.5px;
    }
    span.subscript{
      text-transform: uppercase;
      display: block;
      font-size: 11px;
      margin: -24px 0 0 30px;
    }
  }

  .r_III &, &.r_III {
    background: image-url('species/cites-appendix.png');
    background-position: 0px 26px;
    width: 44px;
    span {
      line-height: 2em;
      margin-left: 7.5px;
    }
    span.subscript{
      text-transform: uppercase;
      display: block;
      font-size: 11px;
      margin: -26px 0 0 31px;
    }
  }

  .w_III &, &.w_III {
    background: image-url('species/cites-appendix.png');
    background-position: 0px 26px;
    width: 44px;
    span {
      line-height: 2em;
      margin-left: 7.5px;
    }
    span.subscript{
      text-transform: uppercase;
      display: block;
      font-size: 11px;
      margin: -25px 0 0 29px;
    }
  }

  .nc &, .inactive &, &.nc, &.inactive {
    background: image-url('species/cites-appendix.png');
    background-position: 0px 182px;
  }
}

.eu_appendix {
  height: 26px;
  width: 26px;

  color: #fff;

  span {
    line-height: 1.9em;
    margin-left: 9px;
  }

  .a_A &, &.a_A {
    background: image-url('species/eu-annex.png');
    background-position: 0px 0px;
    &.deletion {
      background-position: 0px -104px;
      width: 44px;
    }
  }

  .a_B &, &.a_B {
    background: image-url('species/eu-annex.png');
    background-position: 0px -26px;
    &.deletion {
      background-position: 0px -130px;
      width: 44px;
    }
  }

  .a_C &, &.a_C {
    background: image-url('species/eu-annex.png');
    background-position: 0px 182px;
    &.deletion {
      background-position: 0px 78px;
      width: 44px;
    }
  }

  .a_D &, &.a_D {
    background: image-url('species/eu-annex.png');
    background-position: 0px 156px;
    &.deletion {
      background-position: 0px 52px;
      width: 44px;
    }
  }

  .nc &, .inactive &, &.nc, &.inactive {
    background: image-url('species/cites-appendix.png');
    background-position: 0px 182px;
  }
}