Am I doing too much nesting in SCSS ?

&__secondary {
    &__link-list {
      display: inline-block;
      vertical-align: middle;
      line-height: 1em;

      @media screen and (min-width: $breakpoint-lg) {
        margin-top: 1rem;
        width: auto;
      }

      &__item {
        font-size: 0.875rem;
        line-height: 1.5;
        font-weight: bold;
        margin-right: 1em;

        @media screen and (min-width: $breakpoint-lg) {
          display: inline-block;
          margin-bottom: 0;
        }
      }
    }

    &__signature {
      text-align: left;

      @media screen and (min-width: $breakpoint-md) {
        float: right;
        width: auto;
        margin-left: 3em;
        margin-top: 1rem;
      }

      &__logo {
        float: right;
        display: inline-block;
        vertical-align: middle;
      }

      &__label {
        margin-left: 0;
        margin-right: 1em;
        font-size: 0.875rem;
        line-height: 1.5;
        font-weight: bold;

        @media screen and (min-width: $breakpoint-md) {
          margin-left: 0;
          margin-right: 1em;
        }
      }
    }
Was this page helpful?