{% extends 'base.html.twig' %}
{% block keywords %}{{item.keywords}}{% endblock %}
{% block title %}{{ item.title }}{% endblock %}

{% block des %}
	{{ item.intro }}
{% endblock %}

{% block body %}
	<style></style>
	<div class="container mt-3">
        <h1 class="text-primary fs-3">راهنمای استفاده از حسابیکس</h1>
		<div class="row">
			<div class="col-sm-12 col-md-4 mb-2">
				<div class="accordion rounded-3" id="accaccordion">
					{% for tree in trees %}
						<div class="accordion-item">
							<h2 class="accordion-header bg-body-tertiary">
								<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#colp{{ loop.index }}" aria-expanded="true" aria-controls="collapseOne">
									{{tree.label}}
								</button>
							</h2>
							<div id="colp{{ loop.index }}" class="accordion-collapse collapse" data-bs-parent="#accordion">
								<div class="accordion-body p-0">
									<ul class="list-group p-0 rounded-0">
										{% for post in tree.getPosts %}
											<li class="list-group-item">
												<a href="{{path('app_guide',{'url':post.url})}}" class="rul">{{ post.title }}</a>
											</li>
										{% endfor %}
									</ul>
								</div>
							</div>
						</div>
					{% endfor %}
				</div>
			</div>
			<div class="col-sm-12 col-md-8 mb-2">
				<div class="rounded-3 shadow p-3">
					<h1 class="text-primary fs-4">{{item.title}}</h1>
					<p>{{item.body | raw}}</p>
                    <p>{{item.plain | raw}}</p>
				</div>
			</div>
		</div>
	</div>
{% endblock %}