126 lines
6.5 KiB
HTML
126 lines
6.5 KiB
HTML
{% extends 'base.html' %}
|
|
|
|
{% load static %}
|
|
|
|
{% block content %}
|
|
<!--Hero section-->
|
|
<section class="xl:h-[30rem] relative z-0 w-full h-56 sm:h-80 lg:h-96 bg-cover bg-center bg-no-repeat flex-none" style="background-image: url('{% static 'img/cover-image.jpeg' %}');">
|
|
<div class="absolute z-10 w-full h-full bg-blue-50 dark:bg-black 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 dark:text-gray-100">
|
|
<span class="hidden">Willkommen bei der </span><span>Fachschaft</span><br>
|
|
<span class="text-proprietary-darker dark:text-proprietary-lightest">Elektrotechnik</span>
|
|
</h1>
|
|
|
|
<div class="hidden sm:block flex-none w-2/5 lg:w-1/3 bg-white dark:bg-gray-800 p-2 lg:p-4 rounded shadow-xl dark:border-2 dark:border-gray-700">
|
|
<h2 class="section-title sm:text-left"><i class="fa-solid fa-comments text-gray-300 dark:text-gray-400 mr-2"></i>Events</h2>
|
|
<div class="-mb-2 text-gray-700 dark:text-gray-200 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 %}
|
|
{% if post %}
|
|
{% include 'posts/partials/_meeting_row.html' %}
|
|
{% endif %}
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Main Content -->
|
|
<main class="container mx-auto w-full px-4 my-8 flex-1">
|
|
{% if request.user.is_authenticated %}
|
|
<div data-dial-init class="fixed bottom-6 right-6 group">
|
|
<div id="speed-dial-menu-dropdown" class="flex hidden flex-col justify-end py-1 mb-4 space-y-2 bg-white rounded-lg border border-gray-100 shadow-sm dark:border-gray-600 dark:bg-gray-700">
|
|
<ul class="text-sm text-gray-500 dark:text-gray-300">
|
|
<li>
|
|
<a href="{% url 'posts:fetmeeting_create' %}" class="flex items-center py-2 px-5 hover:bg-gray-100 dark:hover:bg-gray-600 hover:text-gray-900 dark:hover:text-white">
|
|
<i class="fa-solid fa-plus mr-2"></i>
|
|
<span class="text-sm font-medium">Neue Fachschaftssitzung</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<button type="button" data-dial-toggle="speed-dial-menu-dropdown" aria-controls="speed-dial-menu-dropdown" aria-expanded="false" class="flex justify-center items-center ml-auto w-14 h-14 text-white bg-blue-700 rounded-full hover:bg-blue-800 dark:bg-blue-600 dark:hover:bg-blue-700 focus:ring-4 focus:ring-blue-300 focus:outline-none dark:focus:ring-blue-800">
|
|
<i class="fa-solid fa-pen-to-square"></i>
|
|
</button>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<section class="sm:hidden">
|
|
<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 %}
|
|
{% if post %}
|
|
{% include 'posts/partials/_article_row.html' %}
|
|
{% endif %}
|
|
{% endfor %}
|
|
</div>
|
|
</section>
|
|
|
|
<div class="sm:flex sm:flex-row-reverse justify-center">
|
|
<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:calendar' %}" class="btn btn-secondary block w-full"><i class="fa-solid fa-calendar-days 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_post %}
|
|
{% include 'posts/partials/_posts_pinned.html' %}
|
|
{% endwith %}
|
|
{% endif %}
|
|
{% for post in posts %}
|
|
{% include 'posts/partials/_posts_hero.html' %}
|
|
{% endfor %}
|
|
|
|
<a href="{% url 'posts:index' %}" class="btn btn-primary block w-full"><i class="fa-solid fa-plus-square mr-2"></i>Mehr anzeigen</a>
|
|
</section>
|
|
</div>
|
|
|
|
<!--
|
|
<div id="infoBox" class="sticky bottom-4 mt-8 p-4 rounded-lg shadow-lg bg-gray-600 dark:bg-gray-800 text-gray-200 dark:text-gray-300 flex gap-x-4 items-center leading-none dark:border-2 dark:border-gray-700"
|
|
x-data="infoBox"
|
|
x-show="consent"
|
|
x-transition:leave="transition ease-in-out duration-500"
|
|
x-transition:leave-start="transform origin-bottom opacity-100 scale-100 translate-y-0"
|
|
x-transition:leave-end="transform origin-bottom opacity-0 scale-100 translate-y-14"
|
|
>
|
|
<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-sky-600 dark:bg-proprietary opacity-80"></span>
|
|
<span class="relative inline-flex rounded-full h-3 w-3 bg-sky-600 dark:bg-proprietary"></span>
|
|
</span>
|
|
<i class="fa-brands 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 dark:text-gray-400">Du hast Fragen zum Studium oder möchtest dich einfach mich anderen Studierenden austauschen? </span><span class="text-sm text-gray-300 dark:text-gray-400">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('m', 1)"
|
|
@click="closeBox"
|
|
><i class="fa-solid fa-xmark text-gray-300 dark:text-gray-500"></i></button>
|
|
</div>
|
|
-->
|
|
</main>
|
|
{% endblock %}
|