Event Archive added

archive-event.php

@@ -16,71 +16,73 @@ get_header();
 
 		<section id="all-events" class="container">
 
-			<h2>All News</h2>
+			<h2>All Events</h2>
 
 			<hr>
-
-			<?php if (have_posts()) : ?>
-				<?php while (have_posts()) : the_post(); ?>
-					<div class="parent-grid">
-
+			<div class="parent-grid">
+				<?php if (have_posts()) : ?>
+					<?php while (have_posts()) : the_post(); ?>
 
 
 						<div class="stub grid-sub-item">
+
 							<div class="stub-img-holder">
-								<img class="stub-img" src="<?php echo (get_template_directory_uri()) ?>/img/campus_05.jpg" alt="">
+								<img class="stub-img" src="<?php echo get_the_post_thumbnail_url() ?>" alt="">
 							</div>
-							<span class="events-date">January 1, 2023</span>
-
-							<a href="#">
-								<h3>Learning to make a museum more accessible</h3>
+							<a href="<?php echo get_permalink(); ?>">
+								<h3><?php echo get_the_title(); ?></h3>
 							</a>
-						</div>
-
+							<span class="events-date">Venue: <?php the_field('event_venue'); ?></span>
+							<span class="events-date"><?php the_field('event_date_start'); ?> --- <?php the_field('event_date_end'); ?></span>
 
+						</div>
 
-					</div>
-				<?php endwhile; ?>
+					<?php endwhile; ?>
 
-				<?php the_posts_navigation(); ?>
+					<?php the_posts_navigation(); ?>
 
-			<?php
-			else :
+				<?php
+				else :
 
-				get_template_part('template-parts/content', 'none');
+					get_template_part('template-parts/content', 'none');
 
-			endif;
-			?>
+				endif;
+				?>
+			</div>
 		</section>
 	</div>
 </main><!-- #main -->
 
 <style>
+	@import url("https://fonts.googleapis.com/css2?family=DM+Serif+Text&display=swap");
+	@import url("https://fonts.googleapis.com/css2?family=Open+Sans&display=swap");
+	@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css);
+
 	header {
 		height: 100px !important;
 	}
 
-	#all-news {
+	#all-events {
 		display: flex;
 		flex-direction: column;
 	}
 
-	#all-news h2 {
+	#all-events h2 {
 		color: #000 !important;
 		margin-top: 40px;
 		margin-bottom: 20px;
 	}
 
-	#all-news .stub {
+	#all-events .stub {
 		margin: 30px auto;
 	}
 
-	#all-news .stub-img-holder {
+	#all-events .stub-img-holder {
 		height: 200px;
 		overflow: hidden;
 	}
 
-	#all-news .stub-img-holder img {
+	#all-events .stub-img-holder img {
 		height: 100%;
 		width: 100%;
 		-o-object-fit: cover;
@@ -89,7 +91,7 @@ get_header();
 		object-position: center;
 	}
 
-	#all-news .news-date {
+	#all-events .events-date {
 		display: block;
 		color: #485680;
 		font-weight: 800;
@@ -97,7 +99,7 @@ get_header();
 		margin: 10px 0px !important;
 	}
 
-	#all-news h3 {
+	#all-events h3 {
 		height: 50px;
 		font-size: 18px;
 		line-height: 22px;
@@ -106,7 +108,7 @@ get_header();
 		margin: 20px auto;
 	}
 
-	/*# sourceMappingURL=archive-news.css.map */
+	/*# sourceMappingURL=archive-events.css.map */
 </style>
 <?php
 get_footer();

archive-news.php

@@ -18,9 +18,10 @@ get_header();
 
 			<h2>All News</h2>
 			<hr>
-			<?php if (have_posts()) : ?>
-				<?php while (have_posts()) : the_post(); ?>
-					<div class="parent-grid">
+			<div class="parent-grid">
+				<?php if (have_posts()) : ?>
+					<?php while (have_posts()) : the_post(); ?>
+
 
 						<div class="stub grid-sub-item">
 							<div class="stub-img-holder">
@@ -33,14 +34,15 @@ get_header();
 							</a>
 						</div>
 
-					</div>
-				<?php endwhile; ?>
-				<?php the_posts_navigation(); ?>
-			<?php
-			else :
-				get_template_part('template-parts/content', 'none');
-			endif;
-			?>
+
+					<?php endwhile; ?>
+					<?php the_posts_navigation(); ?>
+				<?php
+				else :
+					get_template_part('template-parts/content', 'none');
+				endif;
+				?>
+			</div>
 		</section>
 	</div>
 </main><!-- #main -->

css/theme-styles.css

@@ -1678,6 +1678,9 @@ body.archive aside#secondary{
     width: 80%;
 }
 
+#all-events h3 {
+    height: unset !important;
+}
 @media screen and (max-width: 991px){
   .parent-grid {
     justify-content: space-around;