{{- range .nodes.ByWeight -}}
  {{- if eq $.level 0 -}}
    <div class="flex flex-col">
      <a class="flex items-center {{ if .IsSection }}text-on-surface{{ else }}text-on-surface-variant{{ end }} hover:text-primary transition-colors py-1 text-left w-full group" href="{{ .RelPermalink }}">
        <span class="material-symbols-outlined text-[16px] mr-1 text-on-surface-variant group-hover:text-primary">{{ if .IsSection }}expand_more{{ else }}chevron_right{{ end }}</span>
        {{ .LinkTitle }}
      </a>
      {{- if .IsSection -}}
        {{- with .Pages.ByWeight -}}
          <div class="ml-6 flex flex-col gap-1 text-on-surface-variant text-label-sm tree-item mt-1 mb-2">
            {{ partial "explorer-tree.html" (dict "nodes" . "level" (add $.level 1)) }}
          </div>
        {{- end -}}
      {{- end -}}
    </div>
  {{- else -}}
    {{- if .IsSection -}}
      <div class="flex flex-col">
        <a class="flex items-center hover:text-on-surface transition-colors py-0.5" href="{{ .RelPermalink }}">
          <span class="material-symbols-outlined text-[14px] mr-1 text-on-surface-variant">expand_more</span>
          {{ .LinkTitle }}
        </a>
        {{- with .Pages.ByWeight -}}
          <div class="ml-5 flex flex-col gap-1 text-on-surface-variant text-label-sm tree-item mt-1 italic">
            {{ partial "explorer-tree.html" (dict "nodes" . "level" (add $.level 1)) }}
          </div>
        {{- end -}}
      </div>
    {{- else -}}
      <a class="hover:text-on-surface transition-colors py-0.5 italic" href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
    {{- end -}}
  {{- end -}}
{{- end -}}