posts.html

---
layout: default
title: 공지사항
permalink: /posts/
---
<section class="bg-gradient-to-br from-bacchus-600 to-bacchus-800 py-16 md:py-24">
    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
        <h1 class="text-4xl md:text-5xl font-bold text-white mb-4">공지사항</h1>
        <p class="text-bacchus-100 text-lg max-w-2xl mx-auto">바쿠스의 최신 소식과 공지</p>
    </div>
</section>

<section class="py-16 md:py-24">
    <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
        {% assign posts_by_year = site.posts | group_by_exp: "post", "post.date | date: '%Y'" %}
        {% for year in posts_by_year %}
        <div class="mb-12">
            <h2 class="text-2xl font-bold text-gray-900 mb-6 flex items-center">
                <span class="{% if forloop.first %}bg-bacchus-600{% else %}bg-gray-700{% endif %} text-white px-3 py-1 rounded-lg mr-3">{{ year.name }}</span>
            </h2>
            <div class="space-y-4">
                {% for post in year.items %}
                <a href="{{ post.url | relative_url }}" class="block bg-white border border-gray-200 rounded-2xl p-6 hover:shadow-lg transition">
                    <div class="flex flex-wrap items-center gap-3 mb-2">
                        {% if post.categories contains 'announcement' %}
                        <span class="px-3 py-1 bg-bacchus-100 text-bacchus-700 text-sm font-medium rounded-full">공지</span>
                        {% elsif post.categories contains 'maintenance' or post.categories contains 'maintainance' %}
                        <span class="px-3 py-1 bg-yellow-100 text-yellow-700 text-sm font-medium rounded-full">점검</span>
                        {% elsif post.categories contains 'etc' %}
                        <span class="px-3 py-1 bg-gray-100 text-gray-700 text-sm font-medium rounded-full">기타</span>
                        {% else %}
                        <span class="px-3 py-1 bg-gray-100 text-gray-700 text-sm font-medium rounded-full">공지</span>
                        {% endif %}
                        <span class="text-sm text-gray-500">{{ post.date | date: "%Y-%m-%d" }}</span>
                    </div>
                    <h3 class="text-lg font-bold text-gray-900">{{ post.title }}</h3>
                </a>
                {% endfor %}
            </div>
        </div>
        {% endfor %}
    </div>
</section>