{% extends "settings/index.html" %}

{% block header_text %}<h1><i class="fa-solid fa-pen"></i> Update Repository</h1>{% endblock %}

{% block main %}
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">
  <style>
    form {
      padding: 2rem;
      border-radius: 10px;
    }
    label { font-weight: bold; display: flex; align-items: center; gap: 0.5rem;}
    button {
      background: #0d6efd; color: #fff;
      border: none; border-radius: 5px; padding: 0.6rem 1rem;
      cursor: pointer;
      font-size: 1rem; display: inline-flex; align-items: center; gap: 0.4rem;
    }
    .cancel {
      background: #6c757d;
    }
      @media (max-width: 600px) {
      .container { max-width: 98vw; }
      form { padding: 1rem; }
    }
  </style>
  <div class="container">
    <form method="post">
      <!-- Assume hidden id for backend use -->
      <input type="hidden" name="id" value="{{ repository.id }}">
      <div>
        <label for="name"><i class="fa-solid fa-book"></i> Name</label>
        <input type="text" id="name" name="name" value="{{ repository.name }}" readonly>
      </div>
      <div>
        <label>
            <input type="checkbox" name="is_private" value="1" {% if repository.is_private %}checked{% endif %}>
            <i class="fa-solid fa-lock"></i> Private
        </label>
      </div>
      <button type="submit"><i class="fa-solid fa-pen"></i> Update</button>
      <button onclick="history.back()" class="cancel"><i class="fa-solid fa-arrow-left"></i>Cancel</button>
    </form>
  </div>
{% endblock %}