gitcoinco/code_fund_ads

View on GitHub
app/javascript/advertisements/square/theme.scss

Summary

Maintainability
Test Coverage
div#cf[data-template='square'] {
  max-width: 255px;
  margin: 0 auto;
  background-color: hsl(0, 0%, 98%);
  border-radius: 4px;
  box-shadow: 0 0 0 1px hsla(0, 0%, 0%, 0.1);
  display: block;
  line-height: 1.5;
  margin-bottom: 20px;
  overflow: hidden;
  text-align: center;

  a {
    box-shadow: none !important;
    text-decoration: none;
  }

  span.cf-wrapper {
    display: block;
    padding: 0;
    font-size: 14px;
    line-height: 1.4;
    text-align: left;
    font-family: Helvetica, Arial, sans-serif;
    font-weight: 350;
    margin-left: auto;
    margin-right: auto;

    span.cf-img-wrapper {
      display: block;
      line-height: 1;
      margin-bottom: 8px;
      border-bottom: 1px solid hsl(0, 0%, 98%);

      img {
        vertical-align: middle;
        border-style: none;
        width: 100%;
        position: relative;
      }
    }

    span.cf-text {
      display: block;
      padding: 0 1em 1em 1em;
      color: hsla(0, 0%, 0%, 0.8);

      span.cf-cta {
        color: #2c6ac7;
        text-decoration: underline;
      }
    }

    div.cf-footer {
      background-color: hsla(0, 0%, 0%, 0.05);
      text-align: center;
      display: block;
      font-size: 9px;
      font-weight: 400;
      letter-spacing: 0.5px;
      line-height: 2.2;
      padding: 10px auto;
      text-transform: uppercase;
      color: hsla(0, 0%, 0%, 0.8);

      a.cf-powered-by {
        color: hsla(0, 0%, 0%, 0.6);
        cursor: pointer;

        &:hover {
          color: #000;
        }
      }

      span.cf-close {
        color: hsla(0, 0%, 0%, 0.6);
        cursor: pointer;

        &:hover {
          color: #000;
        }
      }
    }
  }
}