<h3 class="text-[11px] font-semibold uppercase tracking-wider text-slate-400 mb-2">Activity</h3>
{{if dashboard.RecentActivity}}
<div class="relative ml-2 border-l border-slate-100 pl-4 space-y-0">
    {{range $act := dashboard.RecentActivity}}
    <div class="relative flex items-center gap-2 py-1.5">
        <div class="absolute -left-[18.5px] w-2 h-2 rounded-full border-2 border-white
            {{if eq $act.Action "clone"}}bg-sky-400
            {{else if eq $act.Action "pull"}}bg-blue-400
            {{else if eq $act.Action "delete"}}bg-red-400
            {{else if eq $act.Action "init"}}bg-emerald-400
            {{else if eq $act.Action "deploy"}}bg-violet-400
            {{else if eq $act.Action "restart"}}bg-amber-400
            {{else if eq $act.Action "coder_restart"}}bg-orange-400
            {{else if eq $act.Action "domain_setup"}}bg-teal-400
            {{else}}bg-slate-300{{end}}"></div>
        <span class="text-[12px] text-slate-500 truncate flex-1">{{$act.Detail}}</span>
        <span class="text-[10px] text-slate-300 shrink-0 font-mono">{{$act.Ago}}</span>
    </div>
    {{end}}
</div>
{{else}}
<p class="text-[12px] text-slate-400 py-0.5">No activity yet</p>
{{end}}