100 lines
4.4 KiB
HTML
100 lines
4.4 KiB
HTML
{% extends 'base.html' %}
|
|
|
|
{% load post_helpers %}
|
|
{% load static %}
|
|
|
|
{% block content %}
|
|
<!--Hero section-->
|
|
<section class="hero-image relative z-0 w-full h-56 sm:h-80 lg:h-96 bg-cover-image bg-cover bg-center bg-no-repeat flex-none">
|
|
<div class="absolute z-10 w-full h-full bg-blue-50 opacity-60"></div>
|
|
<div class="relative container px-4 mx-auto z-20 w-full h-full flex flex-wrap items-center gap-x-2">
|
|
<h1 class="w-3/5 flex-1 uppercase font-semibold text-xl sm:text-2xl lg:text-3xl text-center text-gray-900">
|
|
<span class="hidden">Willkommen bei der </span><span>Fachschaft</span><br>
|
|
<span class="text-proprietary-darker">Elektrotechnik</span>
|
|
</h1>
|
|
<div class="hidden sm:block flex-none w-2/5 lg:w-1/3 bg-white p-2 lg:p-4 rounded shadow-xl">
|
|
<h2 class="section-title sm:text-left"><i class="fas fa-comments text-gray-300 mr-2"></i>Events</h2>
|
|
<div class="-mb-2 text-gray-700 text-sm md:text-base">
|
|
|
|
{% if featured_event %}
|
|
{% with post=featured_event %}
|
|
{% include 'posts/partials/_meeting_row.html' %}
|
|
{% endwith %}
|
|
{% endif %}
|
|
{% for post in featured_meeting %}
|
|
{% include 'posts/partials/_meeting_row.html' %}
|
|
{% endfor %}
|
|
|
|
</div>
|
|
</div>
|
|
<!--<div class="w-full self-end flex justify-center mb-4">
|
|
<i class="fas fa-chevron-down animate-bounce text-proprietary text-2xl"></i>
|
|
</div>-->
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Main Content -->
|
|
<main class="container mx-auto w-full px-4 my-8 flex-1">
|
|
<section class="sm:hidden my-8">
|
|
<h2 class="section-title section-title-margins">Events</h2>
|
|
|
|
<div class="flex flex-col gap-4">
|
|
{% if featured_event %}
|
|
{% with post=featured_event %}
|
|
{% include 'posts/partials/_article_row.html' %}
|
|
{% endwith %}
|
|
{% endif %}
|
|
{% for post in featured_meeting %}
|
|
{% include 'posts/partials/_article_row.html' %}
|
|
{% endfor %}
|
|
</div>
|
|
</section>
|
|
|
|
<div class="sm:flex sm:flex-row-reverse justify-center my-8">
|
|
<aside class="calendar-preview sm:w-2/5 xl:w-1/4 sm:pl-4 my-8 sm:my-0">
|
|
<div>
|
|
<h2 class="section-title section-title-margins">Kalender</h2>
|
|
<div class="calendar-entries">
|
|
{% for post in events %}
|
|
{% include 'posts/partials/_date_box.html' %}
|
|
{% endfor %}
|
|
|
|
<a href="{% url 'posts:posts.calendar' %}" class="btn btn-secondary block w-full"><i class="fas fa-calendar-alt mr-2"></i>Kalender abonnieren</a>
|
|
</div>
|
|
</div>
|
|
</aside>
|
|
|
|
<section class="my-8 sm:my-0 sm:w-3/5 xl:w-2/5 flex flex-col gap-4">
|
|
<h2 class="section-title section-title-margins">Zuletzt veröffentlicht</h2>
|
|
|
|
{% if featured_post %}
|
|
{% with post=featured_event %}
|
|
{% include 'posts/partials/_posts_hero.html' %}
|
|
{% endwith %}
|
|
{% endif %}
|
|
|
|
{% for post in posts %}
|
|
{% include 'posts/partials/_posts_hero.html' %}
|
|
{% endfor %}
|
|
|
|
<a href="{% url 'posts:posts.index' %}" class="btn btn-primary block w-full"><i class="fas fa-plus-square mr-2"></i>Mehr anzeigen</a>
|
|
</section>
|
|
</div>
|
|
|
|
<div id="infoBox" class="sticky bottom-4 p-4 rounded-lg shadow-lg bg-gray-600 text-gray-200 flex gap-x-4 items-center leading-none">
|
|
<div class="flex-none relative">
|
|
<span class="absolute flex h-3 w-3 right-0 top-0">
|
|
<span class="animate-ping absolute inline-flex h-full w-full rounded-full bg-blue-500 opacity-80"></span>
|
|
<span class="relative inline-flex rounded-full h-3 w-3 bg-blue-500"></span>
|
|
</span>
|
|
<i class="fab fa-discord text-4xl"></i>
|
|
</div>
|
|
<a href="{% url 'discord' %}" class="flex-1">
|
|
FET Discord-Server<br>
|
|
<span class="hidden lg:inline text-sm text-gray-300">Du hast Fragen zum Studium oder möchtest dich einfach mich anderen Studierenden austauschen? </span><span class="text-sm text-gray-300">Klicke hier zum Beitreten <span class="hidden sm:inline"><i class="fa-solid fa-angle-right"></i></span></span>
|
|
</a>
|
|
<button id="infoBox-closeButton" class="flex-none self-stretch px-2 -mr-2" onclick="hideInfoBox()"><i class="fas fa-times text-gray-400"></i></button>
|
|
</div>
|
|
</main>
|
|
{% endblock %}
|