{% include 'ucp_header.html' %}

<div class="tab-pane active">
	<form id="ucp" method="post" action="{{ S_UCP_ACTION }}"{{ S_FORM_ENCTYPE }} class="iz-form">

		<section class="iz-card iz-card--ucp">
			<header class="iz-card__header">
				<h2 class="iz-card__title">{{ L_TITLE }}</h2>
			</header>

			<div class="iz-card__body">
				<p class="iz-prose">{{ L_BOOKMARKS_EXPLAIN }}</p>

				{% if S_NO_DISPLAY_BOOKMARKS %}
					<div class="iz-alert iz-alert--info" role="status">
						{{ L_BOOKMARKS_DISABLED }}
					</div>
				{% else %}

					{% if topicrow %}
						<section class="iz-card iz-card--nested">
							<header class="iz-card__header">
								<h3 class="iz-card__title">{{ L_BOOKMARKS }}</h3>
							</header>

							<div class="iz-card__body">
								<div class="iz-tablewrap" role="region" aria-label="{{ L_BOOKMARKS }}">
									<table class="iz-table iz-table--topics">
										<thead>
											<tr>
												<th scope="col">{{ L_TOPICS }}</th>
												<th scope="col" class="iz-only-desktop">{{ L_LAST_POST }}</th>
												<th scope="col" class="iz-table__check">{{ L_MARK }}</th>
											</tr>
										</thead>
										<tbody>
											{% set VAR = {{ L_VIEW_TOPIC_LOCKED }} %}

											{% for topicrow in topicrow %}
												<tr id="topic-{{ topicrow.TOPIC_ID }}">
													{% if topicrow.S_DELETED_TOPIC %}
														<td colspan="3">{{ L_DELETED_TOPIC }}</td>
													{% else %}
														<td>
															<div class="iz-topicrow">
																<div class="iz-topicrow__title">

																	{% if topicrow.S_UNREAD_TOPIC and not S_IS_BOT %}
																		<a class="iz-link" href="{{ topicrow.U_NEWEST_POST }}" title="{{ L_VIEW_FIRST_UNREAD }}">
																			{{ L_VIEW_FIRST_UNREAD }}
																		</a>
																		<span class="iz-sep">•</span>
																	{% endif %}

																	<a class="iz-link iz-topicrow__link" href="{{ topicrow.U_VIEW_TOPIC }}">
																		{{ topicrow.TOPIC_TITLE }}
																	</a>

																	{% if topicrow.S_TOPIC_UNAPPROVED or topicrow.S_POSTS_UNAPPROVED %}
																		<a class="iz-badge iz-badge--warning" href="{{ topicrow.U_MCP_QUEUE }}" title="{{ L_TOPICS_ROW_NOT_APPROVED }}">
																			{{ L_TOPICS_ROW_NOT_APPROVED }}
																		</a>
																	{% endif %}

																	{% if topicrow.S_TOPIC_REPORTED %}
																		<a class="iz-badge iz-badge--danger" href="{{ topicrow.U_MCP_REPORT }}" title="{{ L_TOPICS_ROW_REPORTED }}">
																			{{ L_TOPICS_ROW_REPORTED }}
																		</a>
																	{% endif %}

																	{% if topicrow.ATTACH_ICON_IMG %}
																		<span class="iz-badge iz-badge--muted" title="{{ L_ATTACH_FORUM }}">{{ L_ATTACHMENTS }}</span>
																	{% endif %}
																</div>

																<div class="iz-topicrow__meta">
																	{{ L_POST_BY_AUTHOR }}&nbsp;{{ topicrow.TOPIC_AUTHOR_FULL }}
																	<small>&nbsp;&#45;&nbsp;<time datetime="{{ topicrow.FIRST_POST_TIME_RFC3339 }}">{{ topicrow.FIRST_POST_TIME }}</time></small>
																</div>

																{% if topicrow.pagination %}
																	<nav class="iz-topicrow__pages iz-only-desktop" aria-label="{{ L_PAGINATION }}">
																		<ul class="iz-pagination__list iz-pagination__list--compact">
																			{% for pagination in pagination %}
																				{% if topicrow.pagination.S_IS_PREV %}
																				{% elseif topicrow.pagination.S_IS_CURRENT %}
																					<li class="iz-pagination__item is-current"><span class="iz-pagination__link">{{ topicrow.pagination.PAGE_NUMBER }}</span></li>
																				{% elseif topicrow.pagination.S_IS_ELLIPSIS %}
																					<li class="iz-pagination__item is-ellipsis"><span class="iz-pagination__link">{{ L_ELLIPSIS }}</span></li>
																				{% elseif topicrow.pagination.S_IS_NEXT %}
																				{% else %}
																					<li class="iz-pagination__item"><a class="iz-pagination__link" href="{{ topicrow.pagination.PAGE_URL }}">{{ topicrow.pagination.PAGE_NUMBER }}</a></li>
																				{% endif %}
																			{% endfor %}
																		</ul>
																	</nav>
																{% endif %}
															</div>
														</td>

														<td class="iz-only-desktop">
															<div class="iz-lastpost">
																<div>{{ L_POST_BY_AUTHOR }}&nbsp;{{ topicrow.LAST_POST_AUTHOR_FULL }}</div>
																<div>
																	{% if not S_IS_BOT %}
																		<a class="iz-link" title="{{ L_FORUMLIST_LASTPOST }}" href="{{ topicrow.U_LAST_POST }}">
																			{{ L_FORUMLIST_LASTPOST }}
																		</a>
																		<span class="iz-sep">•</span>
																	{% endif %}
																	<small><time datetime="{{ topicrow.LAST_POST_TIME_RFC3339 }}">{{ topicrow.LAST_POST_TIME }}</time></small>
																</div>
															</div>
														</td>

														<td class="iz-table__check">
															<div class="iz-choice iz-choice--check">
																<input type="checkbox" name="t[{{ topicrow.TOPIC_ID }}]" id="t{{ topicrow.TOPIC_ID }}">
																<label for="t{{ topicrow.TOPIC_ID }}">
																	<span class="iz-visually-hidden">{{ L_MARK }}</span>
																</label>
															</div>
														</td>
													{% endif %}
												</tr>
											{% endfor %}
										</tbody>
									</table>
								</div>
							</div>
						</section>

						<div class="iz-space iz-space--sm"></div>

						<div class="iz-toolbar iz-toolbar--ucp-actions" aria-label="{{ L_OPTIONS }}">
							<div class="iz-toolbar__left">
								<div class="iz-actions">
									<button type="button" class="iz-btn iz-btn--ghost iz-btn--sm" onclick="marklist('ucp', '', true); return false;">
										{{ L_MARK_ALL }}
									</button>
									<button type="button" class="iz-btn iz-btn--ghost iz-btn--sm" onclick="marklist('ucp', '', false); return false;">
										{{ L_UNMARK_ALL }}
									</button>
									<button class="iz-btn iz-btn--danger iz-btn--sm" type="submit" name="unbookmark" title="{{ L_REMOVE_BOOKMARK_MARKED }}">
										{{ L_REMOVE_BOOKMARK_MARKED }}
									</button>
								</div>

								{{ S_FORM_TOKEN }}
							</div>

							<div class="iz-toolbar__right">
								<div class="iz-paginationbar iz-only-desktop" aria-label="{{ L_PAGINATION }}">
									<span class="iz-badge">{{ TOTAL_TOPICS }}</span>
									<ul class="iz-pagination__list">
										{% if pagination %}
											{% include 'pagination.html' %}
										{% else %}
											<li class="iz-pagination__item is-current"><span class="iz-pagination__link">{{ PAGE_NUMBER }}</span></li>
										{% endif %}
									</ul>
								</div>

								<div class="iz-only-mobile" aria-label="{{ L_PAGINATION }}">
									<ul class="iz-pagination__list">
										{% if pagination %}
											{% include 'pagination_mobile.html' %}
										{% else %}
											<li class="iz-pagination__item is-current"><span class="iz-pagination__link">{{ PAGE_NUMBER }}</span></li>
										{% endif %}
									</ul>
								</div>
							</div>
						</div>

					{% else %}
						<div class="iz-alert iz-alert--info" role="status">
							{{ L_NO_BOOKMARKS }}
						</div>
					{% endif %}

				{% endif %}
			</div>
		</section>

	</form>
</div>

{% include 'ucp_footer.html' %}