Sha256: 5e0d445b91fcb7cd328cb751c3cad365d0521843b4df136a5a370defc8f4eaf9

Contents?: true

Size: 1.81 KB

Versions: 6

Compression:

Stored size: 1.81 KB

Contents

.icon-group{
  font-size: 1.75rem;
  line-height: 3rem;
  display: block;
  text-align: center;

  &__blue-icon{
    color: $brand-blue-light;
  }

  &__grey-icon{
    color: $smoke;
  }
}

.graph{
  width: 100%;
  height: 50px;
  position: relative;

  &__cap{
    border-radius: 100%;
    height: 100%;
    width: 50px;
    display: block;
    float: left;
    position: absolute;
    background-color: $stone;

    &--right{
      @extend .graph__cap;
      right: 0;
    }

    &--filled{
      background-color: $brand-blue-light;
    }
  }

  &__middle{
    height: 100%;
    width: calc(100% - 50px);
    background-color: $stone;
    display: block;
    float: left;
    margin-left: 27px;
    position: relative;

    &--filled{
      background-color: $brand-blue-light;
      min-width: 20%;
      height: 100%;
      position: absolute;
      left: 0;
      top: 0;
      z-index: 3;
      display: table;
    }

    &--filled-fourth{
      @extend .graph__middle--filled;
      width: 20%
    }

    &--filled-half{
      @extend .graph__middle--filled;
      width: 50%
    }

    &--filled-full{
      @extend .graph__middle--filled;
      width: 100%
    }
  }

  &__middle-text{
    color: $slate;
    position: absolute;
    right: 0;
    font-size: .85rem;
    display: table;
    z-index: 5;
    margin-top: 15px;
    margin-bottom: 15px;
    vertical-align: middle;

    &--half{
      @extend .graph__middle-text;
      width: 47%;
      margin-top: $base-margin;
      margin-bottom: $base-margin;
    }

    &--full{
      @extend .graph__middle-text;
      color: $white;
      width: 100%;
      text-align: center;
    }
  }

  &-label{
    text-align: center;
    color: $slate;
    margin-top: $base-margin;

    strong{
      font-size: 0.85rem;
    }

    p{
      @extend .small-text;
      line-height: 0.8rem;
    }
  }
}

Version data entries

6 entries across 6 versions & 1 rubygems

Version Path
ama_layout-3.2.2 app/assets/stylesheets/ama_layout/layout_components/graph.scss
ama_layout-3.2.1 app/assets/stylesheets/ama_layout/layout_components/graph.scss
ama_layout-3.2.0 app/assets/stylesheets/ama_layout/layout_components/graph.scss
ama_layout-3.1.3 app/assets/stylesheets/ama_layout/layout_components/graph.scss
ama_layout-3.1.1 app/assets/stylesheets/ama_layout/layout_components/graph.scss
ama_layout-3.1.0 app/assets/stylesheets/ama_layout/layout_components/graph.scss