bkdotcom/PHPDebugConsole

View on GitHub
src/Debug/scss/_alerts.scss

Summary

Maintainability
Test Coverage
.alert,
.m_alert {
  padding: 0.66em;
  margin-bottom: 10px;
  border-radius: 4px;
  border: 1px solid transparent;
}
.m_alert {
  font-size: 125%;

  h3 {
    margin-bottom: 4px;
    &:last-child { margin-bottom: 0; }
  }

  &.error-summary {
    .filter-hidden + h3 {
      margin-top: 0;
    }
  }
  &.alert-dismissible {
    padding-right: 35px;
    .close {
      float: right;
      position: relative;
      top: -7px;
      right: -21px;
      border: 0;
      padding: 0;
      font-size: 21px;
      font-weight: 700;
      line-height: 1;
      background: none;
      color: #000;
      text-shadow: 0 1px 0 #fff;
      opacity: 0.2;
      cursor: pointer;
      &:hover {
        text-decoration: none;
        opacity: 0.5;
      }
    }
  }
  .alert-link {
    font-weight: bold;
  }
}

.alert-error {
  background-color: $error-bg;
  border-color: $error-fg;
  color: $error-fg;
  .alert-link {
    color: #843534;
  }
}
.alert-info {
  background-color: $info-bg;
  border-color: #bce8f1;
  color: $info-fg;
  .alert-link {
    color: #245269;
  }
}
.alert-success {
  background-color: $success-bg;
  border-color: #d6e9c6;
  color: $success-fg;
  .alert-link {
    color: #2b542c;
  }
}
.alert-warn {
  background-color: $warn-bg;
  border-color: #faebcc;
  color: $warn-fg;
  .alert-link {
    color: #66512c;
  }
}