bofh/fet2020
8
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

update members view

Browse Source
This commit is contained in:
Patrick Mayr
2020-10-27 21:46:19 +00:00
parent c20f295944
commit 95feb2b961
5 changed files with 82 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
fet2020/templates/members/index.html
View File

@@ -1,40 +1,41 @@
{% extends 'layout.html' %}
{% block content %}
<style>
.button {
background-color: green;
}
.memb {
background-color: blue;
}
.active {
background-color: red;
}
</style>
<div class="grid-container">
<div class="grid-x grid-padding-x padding-top-1">
<div class="cell large-2 medium-4 small-6"><a class="button active" style="width: 100%" href="/members/A">Fachschaft</a></div>
{% for job in pinned_job_groups %}
<div class="cell large-2 medium-4 small-6"><a class="button" style="width: 100%" href="/members/jobs/{{job.slug}}">{{job.name}}</a></div>
<div class="cell large-2 medium-4 small-6"><a class="button {% if job.slug in request.path %} active {% endif %}" style="width: 100%;" href="/members/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 {% if job.slug in request.path %} active {% endif %}" style="width: 100%;" href="/members/jobs/{{job.slug}}">{{job.name}}</a></div>
{% endfor %}
<div class="cell large-2 medium-4 small-6"><a class="button memb {% if '/members/' == request.path %} active {% endif %}" style="width: 100%;" href="/members">Alle Mitglieder</a></div>
<div class="cell large-2 medium-4 small-6"><a class="button memb {% if '/members/P' == request.path %} active {% endif %}" style="width: 100%;" href="/members/P">Pension Mitglieder</a></div>
</div>
<ul class="accordion" data-accordion data-allow-all-closed="true">
<li class="accordion-item" data-accordion-item>
<!-- Accordion tab title -->
<a class="accordion-title">weitere Gruppen</a>
<!-- Accordion tab content: it would start in the open state due to using the `is-active` state class. -->
<div class="accordion-content" data-tab-content>
<div class="grid-x grid-padding-x">
{% for job in unpinned_job_groups %}
<div class="cell large-2 medium-4 small-6"><a class="button" style="width: 100%" href="/members/jobs/{{job.slug}}">{{job.name}}</a></div>
{% endfor %}
<div class="cell large-2 medium-4 small-6"><a class="button" style="width: 100%" href="/members">Alle Mitglieder</a></div>
<div class="cell large-2 medium-4 small-6"><a class="button" style="width: 100%" href="/members/P">Pension Mitglieder</a></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>
</li>
</ul>
<div class="grid-x auto">
{% if description is not None %}
{{ description|safe }}
{% endif %}
</div>
{% endif %}
<!-- show details of a member -->
{% if member %}
@@ -45,6 +46,12 @@
<!-- 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>
@@ -65,7 +72,7 @@
{% for jm in jobmem.list %}
{% with member=jm.member %}
<div class="medium-3 large-2 small-6 cell">
<h2>{{jm.member.surname}}</h2>
<h2>{{member.firstname}} {{member.surname}}</h2>
{% include 'members/partials/_member.html' %}
{{jm.get_job_role_display}} ({{jm.job_start|date}} - {{jm.job_end|date}})
</div>
@@ -80,3 +87,28 @@
</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>