{% extends "base.html" %}
{% from "_macros.html" import server_status %}
{% block title %}{{ vm.name }} · mgf-cloud-web{% endblock %}
{% block content %}
<header class="page-header">
  <div>
    <p class="eyebrow">instance</p>
    <h1>{{ vm.name }}</h1>
    <p class="muted mono" style="margin: var(--space-1) 0 0; font-size: 0.8rem">{{ vm.id }}</p>
  </div>
  <div class="page-header__actions">
    <form method="post" action="/vms/{{ vm.name }}/reboot"><button class="button button-secondary button-sm">reboot</button></form>
    <form method="post" action="/vms/{{ vm.name }}/delete"><button class="button button-danger button-sm">delete</button></form>
    <a class="button button-secondary button-sm" href="/vms">back</a>
  </div>
</header>
<div class="card">
  <table class="kv">
    <tbody>
      <tr><th>ID</th><td class="mono">{{ vm.id }}</td></tr>
      <tr><th>Status</th><td>{{ server_status(vm.status) }}</td></tr>
      <tr><th>Flavor</th><td>{{ vm.flavor }}</td></tr>
      <tr><th>Image</th><td>{{ vm.image }}</td></tr>
      <tr><th>Private IPs</th><td class="mono">{{ vm.private_ips|join(", ") or "—" }}</td></tr>
      <tr><th>Floating IPs</th><td class="mono">{{ vm.floating_ips|join(", ") or "—" }}</td></tr>
      <tr><th>Security groups</th><td>{{ vm.security_groups|join(", ") or "—" }}</td></tr>
      <tr><th>Key</th><td>{{ vm.key_name or "—" }}</td></tr>
      <tr><th>Created</th><td class="mono">{{ vm.created_at or "—" }}</td></tr>
    </tbody>
  </table>
</div>
{% endblock %}