<!DOCTYPE html>
<html lang="en" data-theme="light">
	<head>
		<meta charset="utf-8" />
        <link rel="stylesheet" href="/static/pico.2.0.6.min.css">
        <link rel="stylesheet" type="text/css" href="/static/main.css?v=0.0.17">
		<meta name="viewport" content="width=device-width, initial-scale=1" />
	</head>
	<body>
      <header class="is-fixed-above-lg is-fixed">
        {{ block "header" . }}{{ end }}
      </header>
      <main class="container-fluid page-index">
          <aside id="menu-nav">
            <nav id="menu" class="is-sticky-above-lg">
                <ul>
                  <li><a href="/" class="{{ if (eq .CurrentPage "all") }}primary{{ end }}">All</a></li>
                  <li><a href="/installed" class="{{ if (eq .CurrentPage "installed") }}primary{{ end }}">Installed</a></li>
                  <li><a href="/not-installed" class="{{ if (eq .CurrentPage "not-installed") }}primary{{ end }}">Not Installed</a></li>
                  <hr>
                  <li><a href="/clusters" class="{{ if (eq .CurrentPage "clusters") }}primary{{ end }}">Clusters</a></li>
				  <hr>
                  {{ block "extra_menu" . }}{{ end }}
                </ul>
            </nav>
          </aside>
		  <div id="content">
			  {{ block "content" . }}{{ end }}
		  </div>
      </main>
    <script src="/static/main.js?v=0.0.11"></script>
	</body>
</html>

{{ define "task" }}
{{ range . }}
<li aria-busy="{{ eq .Status 1 }}">
	{{ if eq .Status 3 }}<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="black" d="M21 7L9 19l-5.5-5.5l1.41-1.41L9 16.17L19.59 5.59z"/></svg>{{ end }}{{ .Title }}{{ if .Err }} - {{ .Err.Error }} {{ end }}
	{{ if .Subtasks }}
	<ul>
   		{{ template "task" .Subtasks }}
	</ul>
	{{ end }}
</li>
{{ end }}
{{ end }}
