lz430
lz430

Reputation: 135

LESS Parse Error, but I can't find the issue

I need a 2nd pair of eyes. LESS keeps giving me a parse error, but I can't find it. I've broken the code down in sections and have removed/added things line-by-line with no luck. I've inherited this code from another teamj.

I suspect that they were using an older version of LESS, but they gave me no docs.

Any and all help is appreciated!

    .panel-cards {
      overflow-y: visible;
      overflow-x: hidden;
      .deck {
        display: flex;
        overflow: visible;
        overflow-x: scroll;
            //-webkit-overflow-scrolling: touch; //conflict with modal popups (and unnecessary?)  
        &:after {
          content: '';
          width: 1px;
          height: 100px;
          display: block;
          flex-shrink: 0;
        }
      }
      article {
        flex-shrink: 0;
        display: flex;
        flex-direction: column;
        width: unit(294/4.14,vw);
        margin: 0 unit(15/4.14,vw) unit(30/4.14,vw) unit(15/4.14,vw);
        .image {
          background-position: center center;
          background-size: cover;
          background-repeat: no-repeat;
          .box-sizing(border-box);
          padding-top: 71%;
          overflow: hidden;
          max-width: 100%;
          &.contain {
            background-size: contain;
          }
        }
        .copy {
          .box-sizing(border-box);
          .copy {
            span {
                 width: 100%;
                 float: left;
              p{
                margin: 0px 0px 8px 0px;
                  line-height: 120%;
                  font-family: 'Roboto', Helvetica, Arial, sans-serif;
                  font-weight: 600;
                  text-align: left;
                  vertical-align: baseline;
              } 
            }
          h3 + p {
            margin-top: 0;
          }
          p {
            margin: unit(18/4.14,vw) 0;
            font-weight: @medium;
            line-height: 117%;
          }
          a:not(.btn) {
            color: @green;
            font-weight: @bold;
            &:hover {
              color: @green;
            }
          }
        }
      }



      
    } //end panel-cards

Upvotes: 0

Views: 310

Answers (2)

Charan Kumar
Charan Kumar

Reputation: 573

Correct these: font-weight: @medium; color: @green; font-weight: @bold; color: @green; and also, "}" has a mismatch between open and closes.

Upvotes: 1

Parco
Parco

Reputation: 612

Is this what you're looking for?

.panel-cards {
  overflow-y: visible;
  overflow-x: hidden;
}
.panel-cards .deck {
  display: flex;
  overflow: visible;
  overflow-x: scroll;
}
.panel-cards .deck:after {
  content: '';
  width: 1px;
  height: 100px;
  display: block;
  flex-shrink: 0;
}
.panel-cards article {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  width: 71.01449275vw;
  margin: 0 3.62318841vw 7.24637681vw 3.62318841vw;
}
.panel-cards article .image {
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  box-sizing: border-box;
  padding-top: 71%;
  overflow: hidden;
  max-width: 100%;
}
.panel-cards article .image.contain {
  background-size: contain;
}
.panel-cards article .copy {
  box-sizing: border-box;
}
.panel-cards article .copy .copy span {
  width: 100%;
  float: left;
}
.panel-cards article .copy .copy span p {
  margin: 0px 0px 8px 0px;
  line-height: 120%;
  font-family: 'Roboto', Helvetica, Arial, sans-serif;
  font-weight: 600;
  text-align: left;
  vertical-align: baseline;
}
.panel-cards article .copy .copy h3 + p {
  margin-top: 0;
}
.panel-cards article .copy .copy p {
  margin: 4.34782609vw 0;
  font-weight: medium;
  line-height: 117%;
}
.panel-cards article .copy .copy a:not(.btn) {
  color: green;
  font-weight: bold;
}
.panel-cards article .copy .copy a:not(.btn):hover {
  color: green;
}

Upvotes: 0

Related Questions