Fix Style

Author: githajae

_layouts/latest-news.html

@@ -4,6 +4,31 @@
 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css"/>
 <script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
 
+<style>
+  /* --- Latest News Page Styles --- */
+.news-container { max-width: 900px; margin: 0 auto; padding: 4rem 2rem; }
+.news-header { text-align: center; margin-bottom: 3rem; }
+.news-header h1 { font-size: 3.5em; font-weight: 800; margin-bottom: 2rem; }
+
+.news-search-wrapper { position: relative; }
+.news-search-wrapper .fa-search { position: absolute; top: 50%; left: 1rem; transform: translateY(-50%); color: #aaa; }
+.news-search-input { width: 100%; padding: 0.8rem 1rem 0.8rem 3rem; font-size: 1em; border-radius: 12px; border: 1px solid #ddd; background-color: #f8f8fa; }
+
+.news-entry { padding-bottom: 2.5rem; margin-bottom: 2.5rem; border-bottom: 1px solid #e5e5e5; }
+.news-entry:last-child { border-bottom: none; margin-bottom: 0; }
+
+.news-date { font-size: 0.9em; font-weight: 600; color: #888; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 0.75rem; }
+.news-title { font-size: 2em; font-weight: 700; line-height: 1.3; margin: 0 0 1rem 0; }
+.news-content { font-size: 1.1em; line-height: 1.7; color: #333; }
+
+/* --- Image Slider Styles --- */
+.swiper { width: 100%; height: 500px; border-radius: 16px; margin-top: 2rem; box-shadow: 0 5px 25px rgba(0,0,0,0.1); }
+.swiper-slide { display: flex; justify-content: center; align-items: center; background: #eee; }
+.swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; }
+.swiper-button-next, .swiper-button-prev { color: #fff; filter: drop-shadow(0 2px 5px rgba(0,0,0,0.5)); }
+@media (max-width: 768px) { .swiper { height: 400px; } }
+</style>
+
 <div class="news-container">
   <header class="news-header">
     <h1>Latest News</h1>

_sass/custom/_latest-news.scss

@@ -15,5 +15,4 @@
 @import "custom/homepage";
 @import "custom/knowledge-base";
 @import "custom/kb-post";
-@import "custom/hobby-details";
-@import "custom/latest-news";
+@import "custom/hobby-details";