{% extends "layouts/base.html" %}

{% block title %} {{ judul }} {% endblock %} 

<!-- Specific Page CSS goes HERE  -->
{% block stylesheets %}{% endblock stylesheets %}

{% block content %}
    <div class="content">
    <div class="page-inner">
			<div class="page-header">
				<h4 class="page-title">FAQ</h4>
				<ul class="breadcrumbs">
					<li class="nav-home">
						<a href="/home">
							<i class="flaticon-home"></i>
						</a>
					</li>
					<li class="separator">
						<i class="flaticon-right-arrow"></i>
					</li>
					<li class="nav-item">
						<a href="faq">List FAQ</a>
					</li>
					<li class="separator">
						<i class="flaticon-right-arrow"></i>
					</li>
					<li class="nav-item">
						<a href="#">Pilih Topik</a>
					</li>
				</ul>
			</div>

			<div class="row">
				<div class="col-md-12">
					<div class="card">
						<div class="card-header">
							<h4 class="card-title">Silakan Pilih Topik FAQ</h4>	
						</div>
						<div class="card-body">        
                        <!---Content-->
                            {% for category in categories %}
                                <h3><a href="{% url 'faq:category_detail' category.slug %}">{{category.name}}</a></h3>
                                {% if category.description %}
                                    <p>{{category.description}}</p>
                                {% endif %}
                            <hr>
                            {% endfor %}
                        <!---End Content-->
                        </div>
                    </div>
                </div>
            </div>            
    </div>
    </div>
{% endblock content %}

<!-- Specific Page JS goes HERE  -->
{% block javascripts %}

{% endblock javascripts %}

