Files
fet2020/fet2020/templates/members/index.html
2020-12-03 11:02:08 +00:00

105 lines
3.8 KiB
HTML

{% extends 'layout.html' %}
{% block content %}
{% load softhyphen_tags %}
<style>
.button {
background-color: gray;
}
.button:hover {
background-color: black;
}
.memb {
background-color: darkgray;
}
.active {
background-color: black;
}
</style>
<div class="grid-container">
<div class="grid-x grid-padding-x padding-top-1">
{% for job in pinned_job_groups %}
<div class="cell large-2 medium-4 small-6">
<a class="button expanded {% if job.slug in request.path %} active {% endif %}" href="{% url 'jobs' job.slug %}">
{{job.name}}
</a>
</div>
{% endfor %}
{% for job in unpinned_job_groups %}
<div class="cell large-2 medium-4 small-6">
<a class="button expanded {% if job.slug in request.path %} active {% endif %}" href="{% url 'jobs' job.slug %}">
{{ job.name|softhyphen|safe }}
</a>
</div>
{% endfor %}
<div class="cell large-2 medium-4 small-6"><a class="button memb expanded {% if '/members/P' == request.path %} active {% endif %}" href="/members/P">Pension</a></div>
<div class="cell large-2 medium-4 small-6"><a class="button memb expanded {% if '/members/' == request.path %} active {% endif %}" href="/members">Alle Mitglieder</a></div>
</div>
{% if description %}
<div class="grid-x">
<div class="cell padding-left-1 padding-bottom-1 padding-right-1" style="text-align: justify;">
{{ description|safe }}
</div>
</div>
{% endif %}
<!-- show details of a member -->
{% if member %}
<div class="padding-top-1 padding-left-1 padding-bottom-1 padding-right-1" style="background-color: white;">
{% include 'members/partials/_member_details.html' %}
</div>
{% endif %}
<!-- show all, active or pension members -->
{% if members %}
<div class="grid-x">
<div class="cell padding-left-1 padding-bottom-1 padding-right-1" style="text-align: justify;">
Die Fachschaft Elektrotechnik (kurz: FET), ist die offizielle Vertretung aller Studierenden auf der Fakultät für Elektrotechnik und Informationstechnik. Ehrenamtliche engagierte Studierende unterstützen dich in Anliegen und Fragen zum und rund ums Studium. Wir vertreten eure Interessen in den offiziellen Gremien der Universität und arbeiten an Studienplänen mit. Außerdem bieten wir ein Rahmenprogramm zum Studium in Form von Veranstaltungen und Festln. Wir freuen uns über Feedback und Anregungen, insbesondere von jenen, die gleich Nägel mit Köpfen machen und unser Team verstärken wollen oder ihre Themen und Meinungen in eine unserer Sitzungen einbringen möchten.
</div>
</div>
<div class="padding-top-1 padding-left-1 padding-right-1" style="background-color: white;">
{% include 'members/members_list.html' %}
</div>
{% endif %}
<!-- show job lists in a job group -->
{% include 'members/jobs_list.html' %}
</div>
{% endblock %}
<script>
// Get the container element
var btnContainer = document.getElementById("grid-container");
// Get all buttons with class="btn" inside the container
var grid = btnContainer.getElementsByClassName("grid-x");
var cell = grid.getElementsByClassName("cell");
var btns = cell.getElementsByClassName("button");
// Loop through the buttons and add the active class to the current/clicked button
for (var i = 0; i < btns.length; i++) {
btns[i].addEventListener("click", function() {
var current = document.getElementsByClassName("active");
// If there's no active class
if (current.length > 0) {
current[0].className = current[0].className.replace(" active", "");
}
// Add the active class to the current/clicked button
this.className += " active";
});
}
</script>