@import "./variables";
@import "~bootstrap-sass/assets/stylesheets/bootstrap/mixins";

@mixin bg-gradient {
  background: $ether-navy;
  background: linear-gradient(149deg, #132a45, #143a56, #21a4ce, #19b4ad);
}

@mixin reset-button {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  cursor: pointer;
}

@mixin clearfix {
  &:after {
    content: "";
    display: table;
    clear: both;
  }
}

@mixin mono {
  font-family: $font-family-monospace;
  font-weight: normal;
  letter-spacing: .02em;
}

@mixin ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

// Alpha agreement, noscript, bad browser, etc.
@mixin cover-message {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: auto;
  background: $brand-info;
  z-index: $zindex-top;

  &-content {
    max-width: 580px;
    padding: 20px;
    margin: 0 auto;
    color: #fff;
    text-shadow: 1px 1px 1px rgba(#000, 0.12);
    overflow: auto;

    h2 {
      font-size: 40px;
      margin-bottom: 20px;
    }

    p {
      font-size: 20px;
      margin-bottom: 15px;

      a {
        color: #fff;
        text-decoration: underline;
      }
    }
  }
}