1

smaller padding on small screens

This commit is contained in:
Christoph
2020-04-18 13:33:44 +02:00
parent baafa806ad
commit 83ba5480d5
11 changed files with 411 additions and 429 deletions

View File

@ -108,7 +108,7 @@ public class GroupDetailsController {
model.addAttribute("events",
eventStoreService.findGroupEvents(UUID.fromString(groupId)));
return "history";
return "log";
}
@RolesAllowed({"ROLE_orga", "ROLE_studentin"})

View File

@ -1,19 +1,16 @@
/*Grouplist Hover Effect*/
.content {
padding-right: 20px;
background: #e6f4ff;
box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);
}
.content:hover {
padding-right: 10px;
background: #d4ecff;
box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .25);
}
.content:hover .content-heading {
padding-bottom: 10px;
padding-left: 10px;
}
.content-text-in {

View File

@ -76,11 +76,9 @@ h1, h3 {
/*Button*/
.btn {
max-width: 250px;
}
.btn-spacer {
max-width: 250px;
}
/*Badges*/
@ -107,6 +105,10 @@ h1, h3 {
}
/*Input*/
.input-group {
width: auto;
}
.input-group-append {
max-width: 50%;
overflow: hidden;

View File

@ -9,38 +9,35 @@
<body>
<main th:fragment="bodycontent">
<div class="container">
<h1>Neue Gruppe</h1>
<h1>Neue Gruppe</h1>
<form enctype="multipart/form-data" method="post" th:action="@{/gruppen2/create}">
<div class="content px-1 px-sm-3 mx-n2 mx-sm-0">
<h3>Eigenschaften:</h3>
<form enctype="multipart/form-data" method="post" th:action="@{/gruppen2/create}">
<div class="content">
<h3>Eigenschaften:</h3>
<!--Titel + Beschreibung-->
<div class="content-text" th:insert="~{fragments/forms :: meta}"></div>
<!--Titel + Beschreibung-->
<div class="content-text" th:insert="~{fragments/forms :: meta}"></div>
<!--TODO: Enter AsciiDoc Description-->
<!--TODO: Enter AsciiDoc Description-->
<div class="content-text-in">
<!--Gruppentyp-->
<div th:insert="~{fragments/forms :: grouptype}"></div>
<div class="content-text-in">
<!--Gruppentyp-->
<div th:insert="~{fragments/forms :: grouptype}"></div>
<!--Benutzerlimit-->
<div class="mt-2" th:insert="~{fragments/forms :: userlimit}"></div>
</div>
<!--CSV Import-->
<div class="content-text mb-0" th:insert="~{fragments/forms :: csvimport}"></div>
<!--Benutzerlimit-->
<div class="mt-2" th:insert="~{fragments/forms :: userlimit}"></div>
</div>
<div class="content d-flex flex-row flex-wrap">
<!--Submit-->
<button class="btn btn-primary btn-block ml-auto" type="submit">Gruppe Erstellen
</button>
</div>
</form>
</div>
<!--CSV Import-->
<div class="content-text mb-0" th:insert="~{fragments/forms :: csvimport}"></div>
</div>
<div class="content d-flex flex-row flex-wrap px-1 px-sm-3">
<!--Submit-->
<button class="btn btn-primary btn-block ml-auto" type="submit">Gruppe Erstellen
</button>
</div>
</form>
</main>
</body>

View File

@ -9,199 +9,197 @@
<body>
<main th:fragment="bodycontent">
<div class="container-fluid">
<h1 th:text="${group.getTitle()}"></h1>
<h1 th:text="${group.getTitle()}"></h1>
<div class="d-flex flex-row flex-wrap mr-n4 mt-n2">
<!--Gruppendetails-->
<div class="flex-grow-1 mr-4 mt-2" style="flex-basis: 65%;">
<div class="d-flex flex-row flex-wrap mr-n4 mt-n2">
<!--Gruppendetails-->
<div class="flex-grow-1 mr-4 mt-2" style="flex-basis: 65%;">
<div class="content" th:insert="~{fragments/groups :: groupcontent}"></div>
<div class="content py-2 px-1 px-sm-3 mx-n2 mx-sm-0"
th:insert="~{fragments/groups :: groupcontent}"></div>
<!--Dummy Integrationen, der Inhalt kommt natürlich aus der Gruppe bzw. von anderen Systemen-->
<div class="d-flex flex-row flex-wrap mr-n2 mt-n2">
<!--Materialsammlung-->
<div th:if="${group.hasMaterial()}" class="content flex-grow-1 mr-2 mt-2">
<div class="content-heading">
<span>Gruppenmaterialien</span>
</div>
<div class="content-text-in">
<h3>Neue Materialien:</h3>
<ul>
<li><a href="/">Blatt 3.pdf</a></li>
<li><a href="/">Vorlesung 5.pdf</a></li>
<li><a href="/">Wikipedia.de/blabla</a></li>
</ul>
<h3>Angepinnt:</h3>
<ul>
<li><a href="/">Sicherheitsregeln.pdf</a></li>
<li><a href="/">Bewertungskriterien.pdf</a></li>
</ul>
</div>
<div class="content-text d-flex flex-row flex-wrap mt-n2 mr-n2">
<a class="btn btn-success flex-grow-1 mt-2 mr-2" href="/">Neuer
Upload.</a>
<a class="btn btn-info ml-auto flex-grow-1 mt-2 mr-2" href="/">
Zur Materialsammlung.</a>
</div>
<!--Dummy Integrationen, der Inhalt kommt natürlich aus der Gruppe bzw. von anderen Systemen-->
<div class="d-flex flex-row flex-wrap mr-n2 mt-n2">
<!--Materialsammlung-->
<div th:if="${group.hasMaterial()}" class="content flex-grow-1 mr-2 mt-2 py-2 px-1 px-sm-3">
<div class="content-heading">
<span>Gruppenmaterialien</span>
</div>
<!--Foren-->
<div th:if="${group.hasForums()}" class="content flex-grow-1 mr-2 mt-2">
<div class="content-heading">
<span>Forum</span>
</div>
<div class="content-text-in">
<h3>Letzte Aktivität:</h3>
<ul>
<li><a href="/">"Re: Ey schick lösung"</a></li>
<li><a href="/">"Re: Aufgabe 2"</a></li>
<li><a href="/">"Neu: Ankündigung"</a></li>
</ul>
</div>
<div class="content-text d-flex flex-row flex-wrap mt-n2 mr-n2">
<a class="btn btn-success flex-grow-1 mt-2 mr-2" href="/">
Frage stellen.</a>
<a class="btn btn-info flex-grow-1 ml-auto mt-2 mr-2" href="/">
Zum Forum.</a>
</div>
<div class="content-text-in">
<h3>Neue Materialien:</h3>
<ul>
<li><a href="/">Blatt 3.pdf</a></li>
<li><a href="/">Vorlesung 5.pdf</a></li>
<li><a href="/">Wikipedia.de/blabla</a></li>
</ul>
<h3>Angepinnt:</h3>
<ul>
<li><a href="/">Sicherheitsregeln.pdf</a></li>
<li><a href="/">Bewertungskriterien.pdf</a></li>
</ul>
</div>
<!--Termine-->
<div th:if="${group.hasCalendar()}" class="content flex-grow-1 mr-2 mt-2">
<div class="content-heading">
<span>Gruppentermine</span>
</div>
<div class="content-text-in">
<h3>Nächste Fristen:</h3>
<ul>
<li><a href="/">"Abgabe Übungsblatt 3"</a></li>
<li><a href="/">"Feedback VL 5"</a></li>
<li><a href="/">"Übungsgruppe belegen"</a></li>
</ul>
</div>
<div class="content-text d-flex flex-row flex-wrap mt-n2 mr-n2">
<a class="btn btn-success flex-grow-1 mt-2 mr-2" href="/">
Abstimmung starten.</a>
<a class="btn btn-info flex-grow-1 ml-auto mt-2 mr-2" href="/">
Zur Terminfindung.</a>
</div>
</div>
<!--Portfolios-->
<div th:if="${group.hasPortfolios()}" class="content flex-grow-1 mr-2 mt-2">
<div class="content-heading">
<span>Gruppenportfolio</span>
</div>
<div class="content-text-in">
<h3>Neueste Einträge:</h3>
<ul>
<li><a href="/">"Praktikum Tag 5"</a></li>
<li><a href="/">"Praktikum Tag 4"</a></li>
<li><a href="/">"Nacharbeit Tag 3"</a></li>
</ul>
</div>
<div class="content-text d-flex flex-row flex-wrap mt-n2 mr-n2">
<a class="btn btn-success flex-grow-1 mt-2 mr-2" href="/">
Neue Seite.</a>
<a class="btn btn-info flex-grow-1 ml-auto mt-2 mr-2" href="/">
Zum Portfolio.</a>
</div>
</div>
<!--Modulhandbuch-->
<div th:if="${group.hasModules()}" class="content flex-grow-1 mr-2 mt-2">
<div class="content-heading">
<span>Modulhandbuch</span>
</div>
<div class="content-text-in">
<h3>Veranstaltungsinfo:</h3>
<p>
Dieses Modul vermittelt grundlegende Programmierkenntnisse in einer
objektorientierten Programmiersprache.
Darüber hinaus werden einführend Aspekte von Algorithmen und
Datenstrukturen behandelt.
Es wird keine Programmiererfahrung vorausgesetzt.
</p>
<ul>
<li>Grundlegende Begriffe der Informatik</li>
<li>Primitive Datentypen und Variablen</li>
<li>Kontrollstrukturen</li>
<li>Eigene Datentypen (Klassen) und Arrays</li>
<li>Programmstrukturen im Speicher (Heap, Stack)</li>
<li>Konzepte der Objektorientierung (Polymorphie, Schnittstellen)
</li>
<li>Rekursion</li>
<li>Fehlerbehandlung</li>
<li>Dynamische Datenstrukturen (Listen, Binärbäume, Hashing)</li>
<li>Suchen und Sortieren (ausgewählte Algorithmen, u.a. binäre
Suche, BubbleSort, QuickSort)
</li>
<li>Datenströme (Standard-Eingabe und -Ausgabe, einfache 2D-Grafik,
Dateien)
</li>
</ul>
</div>
<div class="content-text d-flex flex-row flex-wrap mt-n2 mr-n2">
<a class="btn btn-info flex-grow-1 ml-auto mt-2 mr-2" href="/">
Zum Modulhandbuch.</a>
</div>
<div class="content-text d-flex flex-row flex-wrap mt-n2 mr-n2">
<a class="btn btn-success flex-grow-1 mt-2 mr-2" href="/">Neuer
Upload.</a>
<a class="btn btn-info ml-auto flex-grow-1 mt-2 mr-2" href="/">
Zur Materialsammlung.</a>
</div>
</div>
<div class="content overflow-hidden">
<!--Button-Bar-->
<div class="d-flex flex-row flex-wrap mr-n2 mt-n2">
<a class="btn btn-primary flex-grow-1 mr-2 mt-2" href="/gruppen2">Fertig</a>
<!--Foren-->
<div th:if="${group.hasForums()}" class="content flex-grow-1 mr-2 mt-2 py-2 px-1 px-sm-3">
<div class="content-heading">
<span>Forum</span>
</div>
<div class="ml-auto mr-2 mt-2 flex-grow-1 btn-spacer ml-auto">
<form method="post" th:action="@{/gruppen2/details/{id}/leave(id=${group.getId()})}">
<button class="btn btn-danger w-100" type="submit">
Gruppe verlassen
</button>
</form>
</div>
<div class="content-text-in">
<h3>Letzte Aktivität:</h3>
<ul>
<li><a href="/">"Re: Ey schick lösung"</a></li>
<li><a href="/">"Re: Aufgabe 2"</a></li>
<li><a href="/">"Neu: Ankündigung"</a></li>
</ul>
</div>
<div class="content-text d-flex flex-row flex-wrap mt-n2 mr-n2">
<a class="btn btn-success flex-grow-1 mt-2 mr-2" href="/">
Frage stellen.</a>
<a class="btn btn-info flex-grow-1 ml-auto mt-2 mr-2" href="/">
Zum Forum.</a>
</div>
</div>
<!--Termine-->
<div th:if="${group.hasCalendar()}" class="content flex-grow-1 mr-2 mt-2 py-2 px-1 px-sm-3">
<div class="content-heading">
<span>Gruppentermine</span>
</div>
<div class="content-text-in">
<h3>Nächste Fristen:</h3>
<ul>
<li><a href="/">"Abgabe Übungsblatt 3"</a></li>
<li><a href="/">"Feedback VL 5"</a></li>
<li><a href="/">"Übungsgruppe belegen"</a></li>
</ul>
</div>
<div class="content-text d-flex flex-row flex-wrap mt-n2 mr-n2">
<a class="btn btn-success flex-grow-1 mt-2 mr-2" href="/">
Abstimmung starten.</a>
<a class="btn btn-info flex-grow-1 ml-auto mt-2 mr-2" href="/">
Zur Terminfindung.</a>
</div>
</div>
<!--Portfolios-->
<div th:if="${group.hasPortfolios()}" class="content flex-grow-1 mr-2 mt-2 py-2 px-1 px-sm-3">
<div class="content-heading">
<span>Gruppenportfolio</span>
</div>
<div class="content-text-in">
<h3>Neueste Einträge:</h3>
<ul>
<li><a href="/">"Praktikum Tag 5"</a></li>
<li><a href="/">"Praktikum Tag 4"</a></li>
<li><a href="/">"Nacharbeit Tag 3"</a></li>
</ul>
</div>
<div class="content-text d-flex flex-row flex-wrap mt-n2 mr-n2">
<a class="btn btn-success flex-grow-1 mt-2 mr-2" href="/">
Neue Seite.</a>
<a class="btn btn-info flex-grow-1 ml-auto mt-2 mr-2" href="/">
Zum Portfolio.</a>
</div>
</div>
<!--Modulhandbuch-->
<div th:if="${group.hasModules()}" class="content flex-grow-1 mr-2 mt-2 py-2 px-1 px-sm-3">
<div class="content-heading">
<span>Modulhandbuch</span>
</div>
<div class="content-text-in">
<h3>Veranstaltungsinfo:</h3>
<p>
Dieses Modul vermittelt grundlegende Programmierkenntnisse in einer
objektorientierten Programmiersprache.
Darüber hinaus werden einführend Aspekte von Algorithmen und
Datenstrukturen behandelt.
Es wird keine Programmiererfahrung vorausgesetzt.
</p>
<ul>
<li>Grundlegende Begriffe der Informatik</li>
<li>Primitive Datentypen und Variablen</li>
<li>Kontrollstrukturen</li>
<li>Eigene Datentypen (Klassen) und Arrays</li>
<li>Programmstrukturen im Speicher (Heap, Stack)</li>
<li>Konzepte der Objektorientierung (Polymorphie, Schnittstellen)
</li>
<li>Rekursion</li>
<li>Fehlerbehandlung</li>
<li>Dynamische Datenstrukturen (Listen, Binärbäume, Hashing)</li>
<li>Suchen und Sortieren (ausgewählte Algorithmen, u.a. binäre
Suche, BubbleSort, QuickSort)
</li>
<li>Datenströme (Standard-Eingabe und -Ausgabe, einfache 2D-Grafik,
Dateien)
</li>
</ul>
</div>
<div class="content-text d-flex flex-row flex-wrap mt-n2 mr-n2">
<a class="btn btn-info flex-grow-1 ml-auto mt-2 mr-2" href="/">
Zum Modulhandbuch.</a>
</div>
</div>
</div>
<!--Teilnehmerliste-->
<div class="def-cursor flex-grow-1 mr-4 mt-2 mw-100 overflow-hidden">
<!--Anzahl Text-->
<div class="mb-2">
<span>Teilnehmer: </span>
<span th:text="${group.size() + ' von ' + group.getLimit()}"></span>
</div>
<div class="content py-2 px-1 px-sm-3">
<!--Button-Bar-->
<div class="d-flex flex-row flex-wrap mr-n2 mt-n2">
<a class="btn btn-primary flex-grow-1 mr-2 mt-2" href="/gruppen2">Fertig</a>
<!--Bearbeiten-Button-->
<div class="mb-2" th:if="${group.isAdmin(principal.getId())}">
<form method="get"
th:action="@{/gruppen2/details/{id}/edit(id=${group.getId()})}">
<button class="btn btn-secondary btn-block">Gruppe verwalten</button>
</form>
<div class="ml-auto mr-2 mt-2 flex-grow-1 btn-spacer ml-auto">
<form method="post" th:action="@{/gruppen2/details/{id}/leave(id=${group.getId()})}">
<button class="btn btn-danger w-100" type="submit">
Gruppe verlassen
</button>
</form>
</div>
</div>
</div>
</div>
<!--Liste-->
<div class="members">
<ul class="list-group">
<li class="list-group-item d-flex justify-content-between"
th:each="member : ${group.getMembers()}">
<span th:text="${member.format()}"></span>
<span th:replace="~{fragments/groups :: userbadges}"></span>
</li>
</ul>
</div>
<!--Teilnehmerliste-->
<div class="def-cursor flex-grow-1 mr-4 mt-2 mw-100 overflow-hidden py-2 px-1 px-sm-3">
<!--Anzahl Text-->
<div class="mb-2">
<span>Teilnehmer: </span>
<span th:text="${group.size() + ' von ' + group.getLimit()}"></span>
</div>
<!--Bearbeiten-Button-->
<div class="mb-2" th:if="${group.isAdmin(principal.getId())}">
<form method="get"
th:action="@{/gruppen2/details/{id}/edit(id=${group.getId()})}">
<button class="btn btn-secondary btn-block">Gruppe verwalten</button>
</form>
</div>
<!--Liste-->
<div class="members">
<ul class="list-group">
<li class="list-group-item d-flex justify-content-between"
th:each="member : ${group.getMembers()}">
<span th:text="${member.format()}"></span>
<span th:replace="~{fragments/groups :: userbadges}"></span>
</li>
</ul>
</div>
</div>
</div>

View File

@ -9,150 +9,148 @@
<body>
<main th:fragment="bodycontent">
<div class="container-fluid">
<h1 th:text="${group.getTitle()}"></h1>
<h1 th:text="${group.getTitle()}"></h1>
<!--Fertig oder löschen-->
<div class="content">
<div class="d-flex flex-row flex-wrap mt-n2 mr-n2">
<a class="btn btn-primary flex-grow-1 mt-2 mr-2" style="max-width: 250px;"
th:href="@{/gruppen2/details/{id}(id=${group.getId()})}">Fertig</a>
<!--Fertig oder löschen-->
<div class="content py-2 px-1 px-sm-3 mx-n2 mx-sm-0">
<div class="d-flex flex-row flex-wrap mt-n2 mr-n2">
<a class="btn btn-primary flex-grow-1 mt-2 mr-2" style="max-width: 250px;"
th:href="@{/gruppen2/details/{id}(id=${group.getId()})}">Fertig</a>
<div class="mt-2 mr-2 flex-grow-1 ml-auto btn-spacer">
<form method="post" th:action="@{/gruppen2/details/{id}/edit/destroy(id=${group.getId()})}">
<button class="btn btn-danger w-100" type="submit">Gruppe löschen
</button>
</form>
</div>
</div>
</div>
<!--Invite Link-->
<div class="content input-group">
<div class="input-group-prepend">
<span class="input-group-text">Einladungslink:</span>
</div>
<input class="form-control" id="linkview" readonly th:value="${link}" type="text">
<div class="input-group-append">
<button type="button" class="btn btn-secondary" onclick="copyLink()">Link kopieren
</button>
</div>
</div>
<!--Meta-->
<div class="content">
<div class="content-heading">
<span>Eigenschaften</span>
</div>
<!--Beschreibung + Titel-->
<div class="content-text">
<form th:action="@{/gruppen2/details/{id}/edit/meta(id=${group.getId()})}"
method="post">
<div th:replace="~{fragments/forms :: meta}"></div>
<div class="d-flex flex-row flex-wrap">
<button type="submit" class="btn btn-secondary mt-2 ml-auto">Speichern
</button>
</div>
<div class="mt-2 mr-2 flex-grow-1 ml-auto btn-spacer">
<form method="post" th:action="@{/gruppen2/details/{id}/edit/destroy(id=${group.getId()})}">
<button class="btn btn-danger w-100" type="submit">Gruppe löschen
</button>
</form>
</div>
<!--Userlimit-->
<div class="content-text-in">
<form th:action="@{/gruppen2/details/{id}/edit/userlimit(id=${group.getId()})}"
method="post">
<div th:replace="~{fragments/forms :: userlimit}"></div>
<div class="d-flex flex-row flex-wrap">
<button type="submit" class="btn btn-secondary mt-2 ml-auto">Speichern
</button>
</div>
</form>
</div>
<!--CSV Import-->
<div class="content-text mb-0">
<form th:action="@{/gruppen2/details/{id}/edit/csv(id=${group.getId()})}"
th:if="${account.getRoles().contains('orga')}"
enctype="multipart/form-data" method="post">
<div th:replace="~{fragments/forms :: csvimport}"></div>
<div class="d-flex flex-row flex-wrap">
<button type="submit" class="btn btn-secondary mt-2 ml-auto">Speichern
</button>
</div>
</form>
</div>
</div>
<!--Export + Log-->
<div class="content">
<div class="content-heading">
<span>Event-Historie</span>
</div>
<div class="d-flex flex-row flex-wrap mt-n2 mr-n2">
<a class="btn btn-primary mt-2 mr-2 flex-grow-1"
th:href="@{/gruppen2/details/{id}/history(id=${group.getId()})}">Event-Log</a>
<a class="btn btn-info flex-grow-1 mt-2 mr-2 ml-auto"
th:href="@{/gruppen2/details/{id}/export/history/plain(id=${group.getId()})}"
title="Exportiert die gesamte Event-Historie dieser Gruppe. Kann beim erstellen importiert werden.">
Event-Log exportieren (TXT)
</a>
<a class="btn btn-info flex-grow-1 mt-2 mr-2"
th:href="@{/gruppen2/details/{id}/export/history/sql(id=${group.getId()})}"
title="Exportiert die gesamte Event-Historie dieser Gruppe. Kann als data.sql verwendet werden.">
Event-Log exportieren (SQL)
</a>
<a class="btn btn-info flex-grow-1 mt-2 mr-2"
th:href="@{/gruppen2/details/{id}/export/members(id=${group.getId()})}"
title="Exportiert die Teilnehmerliste. Kann beim erstellen (oder nachträglich) importiert werden.">
Teilnehmer exportieren
</a>
</div>
</div>
<!--Teilnehmerliste-->
<div class="content members">
<div class="content-heading">
<span>Teilnehmer</span>
</div>
<ul class="list-group">
<li class="list-group-item d-flex flex-row flex-wrap" th:each="member : ${group.getMembers()}">
<div class="overflow-hidden ml-n2" style="max-width: 50%; text-overflow: ellipsis;">
<span class="overflow-hidden ml-2" th:text="${member.format()}"></span>
<span th:replace="~{fragments/groups :: userbadges}"></span>
</div>
<div class="d-flex flex-row flex-wrap mt-n2 mr-n2 ml-auto" style="max-width: 50%;">
<div class="flex-grow-1 mt-2 mr-2"
th:unless="${member.getId() == account.getName()}">
<form th:action="@{/gruppen2/details/{id}/edit/delete/{userid}(id=${group.getId()}, userid=${member.getId()})}"
method="post">
<button type="submit" class="btn btn-danger w-100">
Entfernen
</button>
</form>
</div>
<div class="flex-grow-1 mt-2 mr-2">
<form th:action="@{/gruppen2/details/{id}/edit/role/{userid}(id=${group.getId()}, userid=${member.getId()})}"
method="post">
<button type="submit" class="btn btn-warning w-100">
Rolle ändern
</button>
</form>
</div>
</div>
</li>
</ul>
</div>
</div>
<!--Invite Link-->
<div class="content input-group py-2 px-1 px-sm-3 mx-n2 mx-sm-0">
<div class="input-group-prepend">
<span class="input-group-text">Einladungslink:</span>
</div>
<input class="form-control" id="linkview" readonly th:value="${link}" type="text">
<div class="input-group-append">
<button type="button" class="btn btn-secondary" onclick="copyLink()">Link kopieren
</button>
</div>
</div>
<!--Meta-->
<div class="content py-2 px-1 px-sm-3 mx-n2 mx-sm-0">
<div class="content-heading">
<span>Eigenschaften</span>
</div>
<!--Beschreibung + Titel-->
<div class="content-text">
<form th:action="@{/gruppen2/details/{id}/edit/meta(id=${group.getId()})}"
method="post">
<div th:replace="~{fragments/forms :: meta}"></div>
<div class="d-flex flex-row flex-wrap">
<button type="submit" class="btn btn-secondary mt-2 ml-auto">Speichern
</button>
</div>
</form>
</div>
<!--Userlimit-->
<div class="content-text-in px-1 px-sm-3">
<form th:action="@{/gruppen2/details/{id}/edit/userlimit(id=${group.getId()})}"
method="post">
<div th:replace="~{fragments/forms :: userlimit}"></div>
<div class="d-flex flex-row flex-wrap">
<button type="submit" class="btn btn-secondary mt-2 ml-auto">Speichern
</button>
</div>
</form>
</div>
<!--CSV Import-->
<div class="content-text mb-0">
<form th:action="@{/gruppen2/details/{id}/edit/csv(id=${group.getId()})}"
th:if="${account.getRoles().contains('orga')}"
enctype="multipart/form-data" method="post">
<div th:replace="~{fragments/forms :: csvimport}"></div>
<div class="d-flex flex-row flex-wrap">
<button type="submit" class="btn btn-secondary mt-2 ml-auto">Speichern
</button>
</div>
</form>
</div>
</div>
<!--Export + Log-->
<div class="content py-2 px-1 px-sm-3 mx-n2 mx-sm-0">
<div class="content-heading">
<span>Event-Historie</span>
</div>
<div class="d-flex flex-row flex-wrap mt-n2 mr-n2">
<a class="btn btn-primary mt-2 mr-2 flex-grow-1"
th:href="@{/gruppen2/details/{id}/history(id=${group.getId()})}">Event-Log</a>
<a class="btn btn-info flex-grow-1 mt-2 mr-2 ml-auto"
th:href="@{/gruppen2/details/{id}/export/history/plain(id=${group.getId()})}"
title="Exportiert die gesamte Event-Historie dieser Gruppe. Kann beim erstellen importiert werden.">
Event-Log exportieren (TXT)
</a>
<a class="btn btn-info flex-grow-1 mt-2 mr-2"
th:href="@{/gruppen2/details/{id}/export/history/sql(id=${group.getId()})}"
title="Exportiert die gesamte Event-Historie dieser Gruppe. Kann als data.sql verwendet werden.">
Event-Log exportieren (SQL)
</a>
<a class="btn btn-info flex-grow-1 mt-2 mr-2"
th:href="@{/gruppen2/details/{id}/export/members(id=${group.getId()})}"
title="Exportiert die Teilnehmerliste. Kann beim erstellen (oder nachträglich) importiert werden.">
Teilnehmer exportieren
</a>
</div>
</div>
<!--Teilnehmerliste-->
<div class="content members py-2 px-1 px-sm-3 mx-n2 mx-sm-0">
<div class="content-heading">
<span>Teilnehmer</span>
</div>
<ul class="list-group">
<li class="list-group-item d-flex flex-row flex-wrap" th:each="member : ${group.getMembers()}">
<div class="overflow-hidden ml-n2" style="max-width: 50%; text-overflow: ellipsis;">
<span class="overflow-hidden ml-2" th:text="${member.format()}"></span>
<span th:replace="~{fragments/groups :: userbadges}"></span>
</div>
<div class="d-flex flex-row flex-wrap mt-n2 mr-n2 ml-auto" style="max-width: 50%;">
<div class="flex-grow-1 mt-2 mr-2"
th:unless="${member.getId() == account.getName()}">
<form th:action="@{/gruppen2/details/{id}/edit/delete/{userid}(id=${group.getId()}, userid=${member.getId()})}"
method="post">
<button type="submit" class="btn btn-danger w-100">
Entfernen
</button>
</form>
</div>
<div class="flex-grow-1 mt-2 mr-2">
<form th:action="@{/gruppen2/details/{id}/edit/role/{userid}(id=${group.getId()}, userid=${member.getId()})}"
method="post">
<button type="submit" class="btn btn-warning w-100">
Rolle ändern
</button>
</form>
</div>
</div>
</li>
</ul>
</div>
</main>

View File

@ -66,7 +66,7 @@
<!--Userlimit-->
<th:block th:fragment="userlimit">
<label for="userlimit">Teilnehmeranzahl:</label>
<div class="btn-toolbar mt-n2 mr-n2 d-flex flex-row flex-wrap" id="userlimit">
<div class="btn-toolbar mt-n2 mr-n2 d-flex flex-row flex-wrap flex-grow-1" id="userlimit">
<input type="hidden" name="limit" id="limit" value="999999"
th:disabled="${group != null && group.getLimit() < 999999} ? 'disabled' : 'false'">
<div class="btn-group btn-group-toggle flex-grow-1 mt-2 mr-2" style="flex-basis: 10%;" data-toggle="buttons">

View File

@ -1,35 +0,0 @@
<!DOCTYPE html>
<html lang="de" xmlns:th="http://www.thymeleaf.org" th:replace="~{mopslayout :: html(
name='Gruppenfindung',
title='Event-Log',
headcontent=~{fragments/general :: headcontent('none')},
navigation=~{fragments/general :: nav('none')},
bodycontent=~{:: bodycontent})}">
<body>
<main th:fragment="bodycontent">
<div class="container-fluid">
<h1 class="def-cursor">Event-Log</h1>
<div class="content" th:each="event : ${events}">
<div class="content-heading d-flex flex-row flex-wrap">
<span th:text="${event.type()}"></span>
<span class="ml-auto">Datum: </span>
<span th:text="${event.getDate()}"></span>
</div>
<div class="content-text-in">
<span th:text="${'User:' + event.getExec()}"></span>
<span th:text="${'>>>' + event.format()}"></span>
</div>
</div>
</div>
</main>
</body>
</html>

View File

@ -9,29 +9,26 @@
<body>
<main th:fragment="bodycontent">
<div class="container-fluid">
<h1>Meine Gruppen</h1>
<h1>Meine Gruppen</h1>
<!--Gruppenliste belegte Gruppen-->
<div class="mx-n2 mx-sm-0" th:unless="${lectures.isEmpty()}">
<h3>Veranstaltungen</h3>
<!--Gruppenliste belegte Gruppen-->
<div th:unless="${lectures.isEmpty()}">
<h3>Veranstaltungen</h3>
<div class="content px-1 px-sm-3" th:each="group: ${lectures}"
th:insert="fragments/groups :: groupcontentlink"></div>
</div>
<div class="content" th:each="group: ${lectures}"
th:insert="fragments/groups :: groupcontentlink"></div>
</div>
<div class="mx-n2 mx-sm-0" th:unless="${publics.isEmpty()}">
<h3>Öffentliche Gruppen</h3>
<div class="content px-1 px-sm-3" th:each="group: ${publics}"
th:insert="fragments/groups :: groupcontentlink"></div>
</div>
<div th:unless="${publics.isEmpty()}">
<h3>Öffentliche Gruppen</h3>
<div class="content" th:each="group: ${publics}"
th:insert="fragments/groups :: groupcontentlink"></div>
</div>
<div th:unless="${privates.isEmpty()}">
<h3>Private Gruppen</h3>
<div class="content" th:each="group: ${privates}"
th:insert="fragments/groups :: groupcontentlink"></div>
</div>
<div class="mx-n2 mx-sm-0" th:unless="${privates.isEmpty()}">
<h3>Private Gruppen</h3>
<div class="content px-1 px-sm-3" th:each="group: ${privates}"
th:insert="fragments/groups :: groupcontentlink"></div>
</div>
</main>

View File

@ -0,0 +1,31 @@
<!DOCTYPE html>
<html lang="de" xmlns:th="http://www.thymeleaf.org" th:replace="~{mopslayout :: html(
name='Gruppenfindung',
title='Event-Log',
headcontent=~{fragments/general :: headcontent('none')},
navigation=~{fragments/general :: nav('none')},
bodycontent=~{:: bodycontent})}">
<body>
<main th:fragment="bodycontent">
<h1>Event-Log</h1>
<div class="content py-2 px-1 px-sm-3 mx-n2 mx-sm-0" th:each="event : ${events}">
<div class="content-heading d-flex flex-row flex-wrap">
<span th:text="${event.type()}"></span>
<span class="ml-auto">Datum: </span>
<span th:text="${event.getDate()}"></span>
</div>
<div class="content-text-in px-1 px-sm-3">
<span th:text="${'User:' + event.getExec()}"></span>
<span th:text="${'>>>' + event.format()}"></span>
</div>
</div>
</main>
</body>
</html>

View File

@ -12,43 +12,40 @@
<!--/*@thymesVar id="PUBLIC" type="mops.gruppen2.domain.model.group.Type"*/-->
<main th:fragment="bodycontent">
<div class="container-fluid">
<h1>Suchen</h1>
<h1 class="def-cursor overflow-hidden" style="text-overflow: ellipsis;">Suchen</h1>
<!--Suchfilter-->
<div class="content top overflow-hidden">
<form method="post" th:action="@{/gruppen2/search/string}">
<div class="d-flex flex-row flex-wrap mr-n2 mt-n2">
<div class="input-group mr-2 mt-2 flex-grow-1" style="flex-basis: 75%;">
<div class="input-group-prepend" style="max-width: 50%;">
<!--Suchfilter-->
<div class="content py-2 px-1 px-sm-3 mx-n2 mx-sm-0">
<form method="post" th:action="@{/gruppen2/search/string}">
<div class="d-flex flex-row flex-wrap mr-n2 mt-n2">
<div class="input-group mr-2 mt-2 flex-grow-1" style="flex-basis: 75%;">
<div class="input-group-prepend" style="max-width: 50%;">
<span class="input-group-text text-monospace overflow-hidden"
style="text-overflow: ellipsis">Suchbegriff:</span>
</div>
<input class="form-control" required minlength="1" name="string" type="text">
</div>
<button class="btn btn-primary btn-block mr-2 mt-2 flex-grow-1" type="submit">
Suchen
</button>
<input class="form-control" required minlength="1" name="string" type="text">
</div>
</form>
<div class="d-flex flex-row flex-wrap mt-1 mr-n2">
<a class="btn btn-info mt-2 mr-2 flex-grow-1"
th:href="@{/gruppen2/search/all}">Alle Anzeigen</a>
<a class="btn btn-info mt-2 mr-2 flex-grow-1 ml-auto"
th:href="@{/gruppen2/search/type/{type}(type=${LECTURE})}">Vorlesungen</a>
<a class="btn btn-info mt-2 mr-2 flex-grow-1"
th:href="@{/gruppen2/search/type/{type}(type=${PUBLIC})}">Öffentliche Gruppen</a>
<button class="btn btn-primary btn-block mr-2 mt-2 flex-grow-1" type="submit">
Suchen
</button>
</div>
</div>
</form>
<!--Ergebnisliste-->
<div class="content" th:each="group: ${groups}"
th:insert="fragments/groups :: groupcontentlink"></div>
<div class="d-flex flex-row flex-wrap mt-1 mr-n2">
<a class="btn btn-info mt-2 mr-2 flex-grow-1"
th:href="@{/gruppen2/search/all}">Alle Anzeigen</a>
<a class="btn btn-info mt-2 mr-2 flex-grow-1 ml-auto"
th:href="@{/gruppen2/search/type/{type}(type=${LECTURE})}">Vorlesungen</a>
<a class="btn btn-info mt-2 mr-2 flex-grow-1"
th:href="@{/gruppen2/search/type/{type}(type=${PUBLIC})}">Öffentliche Gruppen</a>
</div>
</div>
<!--Ergebnisliste-->
<div class="content py-2 px-1 px-sm-3 mx-n2 mx-sm-0" th:each="group: ${groups}"
th:insert="fragments/groups :: groupcontentlink"></div>
</main>
</body>