<section class="blog-section clean-block pt-0">
	<div class="tag-block pt-3 pb-3">
		<div class="container">
			<div class="row">
				<div class="col-12 text-center">
				<?php
				for ($i = 0; $i < count($tags); $i++) {
					$idx = $i % 4;
				?>
				<a href="#"><span class="badge mt-1 mb-1" style="background-color: <?=$hashtagColors[$idx];?>">#<?=$tags[$i]['tag'];?></span></a>
				<?php
				}
				?>
				</div>
			</div>
		</div>
	</div>
	<div class="blog-block clean-block">
		<div class="container">
			<div class="row">
				<?php
				foreach ($blogs as $blog) {
				?>
				<div class="col-lg-4 col-md-6 blog-item d-flex align-items-stretch">
					<div class="card">
						<img src="<?=base_url('assets/img/uploads/blog/' . $blog['featured_picture'] . '?' . $hash);?>" class="card-featured-img img-fluid" />
						<div class="card-body d-flex flex-column blog-details">
							<h5 class="text-center"><a href="<?=base_url('blog/details/' . $blog['url']);?>"><?=$blog['title'];?></a></h5>
							<div style="margin-top: auto;" class="text-center">
								<p class="text-center publish-date"><?=$blog['publish_date'];?></p>
							</div>
							<div class="hashtag-block text-center">
							<?php
							foreach ($blog['hashtag'] as $tag) {
								if ($tag['color'] == '') {
									$color = '#fff;';
								}
								else {
									$color = '#' . $tag['color'];
								}
								?>
								<a class="hashtag-link" href="#"><span class="badge align-self-end">#<?=$tag['tag'];?></span></a>
								<?php
							}
							?>
							</div>
						</div>
					</div>
				</div>
				<?php
				}
				?>
			</div>
			<div class="row">
				<div class="col-12">
					<nav>
						<ul class="pagination justify-content-center">
							<li class="page-item"><a class="page-link" href="#"><i class="fas fa-chevron-double-left"></i></a></li>
							<li class="page-item"><a class="page-link" href="#"><i class="fas fa-chevron-left"></i></a></li>
							<li class="page-item"><span>頁數</span><input type="text" maxlength="3" value="1" style="text-align: center;"/><span>/ 2</span></li>
							<li class="page-item"><a class="page-link" href="#"><i class="fas fa-chevron-right"></i></a></li>
							<li class="page-item"><a class="page-link" href="#"><i class="fas fa-chevron-double-right"></i></a></li>
						</ul>
					</nav>
				</div>
			</div>
		</div>
	</div>
</section>
