18F/e-QIP-prototype

View on GitHub
src/components/Form/Suggestions/Suggestions.scss

Summary

Maintainability
Test Coverage
.suggestions {
  width: 64rem;

  h3,
  p {
    padding-left: 0 !important;
  }

  h3 {
    margin-top: 0;
  }

  .suggestion-btn {
    width: 100%;

    i {
      margin-left: 1rem;
    }
  }

  .suggestion {
    padding: 2rem 0;

    h5 {
      margin-top: 0;
    }

    .value {
      display: inline-block;
      text-align: left;
      width: 50%;
      height: 10rem;
    }

    .action {
      display: inline-block;
      text-align: right;
      vertical-align: middle;
      width: 50%;
      height: 10rem;

      i {
        margin-left: 1rem;
        padding-top: 1rem;
        padding-bottom: 1rem;
      }
    }
  }

  .dismiss {
    border-top: 2px solid $eapp-grey;
    padding-top: 1rem;
    margin-top: 3rem;

    a {
      i {
        margin-left: 1rem;
      }
    }

    .right {
      float: right;
    }
  }

  .suggestion + .suggestion,
  .suggestion:not(:first-child) {
    border-top: 2px solid $eapp-grey;
  }
}

@media only screen and (max-width: 1000px) {
  .suggestions {
    width: 100%;

    .suggestion .value,
    .suggestion .action {
      display: block;
      width: 100%;
      height: auto;
    }

    .dismiss .right {
      float: none;
      display: block;
      margin-top: 3rem;
    }
  }
}