@import "~monday-ui-style/dist/mixins";

$contributor-cell-min-width: $grid-auto-fit-cell-width-xl;
$contributor-grid-column-gap: var(--sb-spacing-large);
$contributor-grid-row-gap: 90px;
$contributor-grid-cell-array-calc: calc(33.3% - #{$contributor-grid-column-gap});

.monday-storybook-welcome-contributors {
  margin-top: 68px;

  @include grid-auto-fit(
    $grid-column-gap: $contributor-grid-column-gap,
    $grid-row-gap: $contributor-grid-row-gap,
    $grid-cell-min-width: $contributor-cell-min-width,
    $grid-cell-array-calc: $contributor-grid-cell-array-calc
  );

  &_contributor {
    &--bg-pattern-1 {
      background-image: url("../assets/BackgroundPattern1.png");
    }

    &--bg-pattern-2 {
      background-image: url("../assets/BackgroundPattern2.png");
    }

    &--bg-pattern-3 {
      background-image: url("../assets/BackgroundPattern3.png");
    }

    &--bg-pattern-4 {
      background-image: url("../assets/BackgroundPattern4.png");
    }

    &--bg-pattern-5 {
      background-image: url("../assets/BackgroundPattern5.png");
    }
  }
}