{% extends 'base.html' %}
{% load static %}

{% block content %}
{% include 'navbar.html' %}
<div class="container d-flex justify-content-center">
    <div class="row mt-4"><h1>{{id}}</h1></div>
</div>

<div class="container">
    <div class="d-flex justify-content-center mt-5">
        <h3>Dodaj nowe zagadnienie</h3>
    </div>
<div class="d-flex justify-content-center mt-3">
    <form role="form">
        <input type="text" class="form-control" placeholder="Nowe zagadnienie" name="przedmiot">
    </form>
    <button type="button" class="btn btn btn-primary ml-1">Dodaj</button>
</div>
<div class="d-flex justify-content-center mt-5">
        <h3>Lista zagadnień</h3>
</div>
<a class="row justify-content-center">Liczba dostępnych zagadnień: 3/15</a>
<ul class="list-group cProductsList mt-3"> 
        <li class="list-group-item d-sm-flex justify-content-between"><p class="p-0 m-0 flex-grow-1">1. Podstawy sztucznej inteligencji</p> 
            <button class="btn-success mr-1">Edytuj</button>  <button class="btn-danger">Usuń</button>
        </li>
        <li class="list-group-item d-sm-flex justify-content-between"><p class="p-0 m-0 flex-grow-1">2. Jak dziala regresja liniowa</p>  
            <button class="btn-success mr-1">Edytuj</button>  <button class="btn-danger">Usuń</button>
        </li> 
        <li class="list-group-item d-sm-flex justify-content-between"><p class="p-0 m-0 flex-grow-1">3. Regresja liniowa, a logistyczna</p>  
            <button class="btn-success mr-1">Edytuj</button>  <button class="btn-danger">Usuń</button>
        </li> 
</ul>
</div>

{% endblock %}