{{ define "repo/pipelines/fragments/logBlock" }}
<div id="lines" hx-swap-oob="beforeend">
  <details id="step-{{ .Id }}" {{if not .Collapsed}}open{{end}} class="group overflow-hidden rounded border border-gray-200 bg-white dark:border-gray-700 dark:bg-gray-800">
    <summary class="list-none cursor-pointer transition-colors hover:bg-gray-50 hover:text-gray-600 dark:hover:bg-gray-700/40 dark:hover:text-gray-300">
      <div class="flex items-center gap-2 px-3 py-3 group-open:hidden">
        {{ i "chevron-right" "size-4 shrink-0" }} {{ template "stepHeader" . }}
      </div>
      <div class="hidden items-center gap-2 px-3 py-3 group-open:flex">
        {{ i "chevron-down" "size-4 shrink-0" }} {{ template "stepHeader" . }}
      </div>
    </summary>
    <div class="overflow-x-auto border-t border-gray-200 bg-gray-50 px-3 py-3 font-mono text-sm leading-relaxed dark:border-gray-700 dark:bg-gray-800">
      {{ if .Command }}<div class="text-blue-600 dark:text-blue-300">{{ .Command }}</div>{{ end }}
      <div id="step-body-{{ .Id }}" class="text-gray-900 dark:text-gray-100"></div>
    </div>
  </details>
</div>
{{ end }}

{{ define "stepHeader" }}
  <span class="truncate text-base font-semibold text-gray-900 dark:text-gray-100">{{ .Name }}</span>
  <span class="ml-auto text-sm tabular-nums text-gray-500 dark:text-gray-400" data-timer="{{ .Id }}" data-start="{{ .StartTime.Unix }}"></span>
{{ end }}