Duplicate condition within rule


section.head-cta {
  height: >= ::window[height];

  @h |(& .overlay)| in(&);
  @v |(& .overlay)| in(&);

  @h  |-(&"area")-| in(&) gap($md) !require;
  @v  |-(&"area")-| in(&) gap($md) !require;

  @h |(& .bg)| in(&);
  @v |(& .bg)| in(&);

  @h |~-~(& .cta, & .play)~-~| in(&"area") gap(0);
  (& .cta)[center-x] == &"area"[center-x];
  (& .play)[center-x] == &"area"[center-x];

  .title, .subtitle {
    height: == &[intrinsic-height] !require;
  }

  .cta, .play {
    height: == &[intrinsic-height];
    line-height: == &[font-size] + $base;
  }

  .cta {
    .number {
      margin-left: == $base;
    }

    .odometer {
      margin-top: == -2;
      margin-left: == 1;
    }
  }

  &[sizer] == &[width];
  //&[sizer] <= &[height];

  video {
    ::[width] == ::[height] * (640/360) !require;
    ::[x] <= 0;
    ::[y] <= 0;
    ::[width] >= ::window[width];
    ::[height] >= ::window[height];
    ::[center-x] == ::window[center-x];
    ::[center-y] == ::window[center-y];
  }

  @if &[sizer] <= 600 {

    .logo {
      opacity: 0;
    }
    .subtitle {
      opacity: 0;
    }

    (& .title)[center] == &[center];

    @h |-18-(& .title)-18-| in(&);
    (& .title)[center-y] == &[center-y];

    .title {
      font-size: 40px;
      line-height: 48px;
    }

    @v  |
        -36-
        (& .play)
        ~18~
        (& .title)
        ~18~
        (& .cta)
        -36-
        |
      in(&);

    .cta, .play {
      font-size: == 14;
      padding: == $base;
    }
  }
  @else {

    @v  |
        (&"logo")
        ~$md~
        (& .subtitle)
        -18-
        (& .title)
        <&"area"[center-y]>
        -$[md-gap]-
        (& .cta)
        -$[md-gap]-
        (& .play)
      in(&"area") !require;

    @v (& .play)~$md~| in(&"area");

    .cta, .play {
      font-size: == 20;
      padding: == $base * 3;
      size: == &[intrinsic-size];
    }

    &"logo" {
      &[height] == $md == &[width];
    }
    &"logo"[center-x] == &"area"[center-x];

    .logo {
      &[height] == 46 == &[width];
    }
    (& .logo)[center] == &"logo"[center];

    @h  |(& .title)| in(&"area") {

          @if &[width] <= 600 {
            line-height: == $md / 2;
            font-size: == $md / 2;
          }
          @else {
            line-height: == $md;
            font-size: == $md;
          }
        }

    @h |(& .subtitle)| in(&"area") {
          @if &[width] <= 600 {
            line-height: == 24;
            font-size: == 16;
          }
          @else {
            line-height: == 36;
            font-size: == 24;
          }
        }
  }

}

Try this:

parsed = Parser.parse(failing_example)

// Same condition, two different trees
parsed[0][2][22]
parsed[0][2][23]

While we're there, can we make so else block doesnt wrap its command into [true, branch] and make it simply branch.

gss / parser

Duplicate condition within rule #33