Hugo repeater using modulo

hugo-repeater.html

{{ define "main" }}
{{ $.Scratch.Add "boxClasses" "dt flex center pt0 pb3 pv3-m pv3-ns" }}
{{ $.Scratch.Add "boxCopyClasses" "db dtc-ns v-mid w-100 w-75-ns" }}
{{ $.Scratch.Add "boxImageClasses" "db dtc-ns v-mid-ns w-25" }}
{{ $.Scratch.Add "ImageClasses" "w-100" }}

  <main class="cf pa3 pa4-m pa5-l mw9 w-60-l center">
    <h2>
      {{ .Title }}
    </h2>
    {{ .Content }}
    {{ if .Params.repeater }}

        <h1>
          Core Services
        </h1>
        {{ range .Params.repeater }}
          {{ $.Scratch.Add "i" 1 }}
          {{ $i := $.Scratch.Get "i" }}
          {{ if modBool $i 2 }}

            <div class="{{ $.Scratch.Get "boxClasses" }}">

              <div class="{{ $.Scratch.Get "boxImageClasses" }}">
                <img src="{{ .icon }}" alt="icon for {{ .Heading }}" class="w-100" />
              </div>

              <div class="{{ $.Scratch.Get "boxCopyClasses" }} pl3-ns">
                <h3>
                  {{ .heading }}
                </h3>
                <p class="lh-copy">
                  {{ .copy }}
                </p>
              </div>

            </div>

          {{ else }}

            <div class="{{ $.Scratch.Get "boxClasses" }}">

              <div class="{{ $.Scratch.Get "boxCopyClasses" }} pr3-ns">
                <h3>
                  {{ .heading }}
                </h3>
                <p class="lh-copy">
                  {{ .copy }}
                </p>
              </div>

              <div class="{{ $.Scratch.Get "boxImageClasses" }}">
                <img src="{{ .icon }}" alt="icon for {{ .Heading }}" class="w-100" />
              </div>

            </div>

          {{ end }}
        {{ end }}
      
      
    {{ end }}
  </main>
{{ end }}