christoph/lecture-professional-software-development
1
Fork 0
Code Activity

made ui look more consistent

Browse Source
This commit is contained in:
AndiBuls
2020-03-16 13:31:51 +01:00
parent f4ad729efd
commit eecfc0351f
3 changed files with 67 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
src/main/resources/templates/create.html
View File

@ -26,37 +26,41 @@
</nav> </nav>
</header> </header>
<main th:fragment="bodycontent"> <main th:fragment="bodycontent">
<h1>Gruppenerstellung</h1>
<div class="container-fluid"> <div class="container-fluid">
<form method="post" action="/gruppen2/createGroup"> <div class="row">
<div class="shadow p-2" style=" border: 10px solid aliceblue; background: aliceblue"> <div class="col-10">
<div class="form-group"> <h1>Gruppenerstellung</h1>
<label for="titel">Titel</label> <form method="post" action="/gruppen2/createGroup">
<input type="text" class="form-control" id="titel" th:name="title" required> <div class="shadow p-2" style=" border: 10px solid aliceblue; background: aliceblue">
</div> <div class="form-group">
<div class="form-group"> <label for="titel">Titel</label>
<label for="beschreibung">Beschreibung</label> <input type="text" class="form-control" id="titel" th:name="title" required>
<textarea th:name="beschreibung" class="form-control" id="beschreibung" rows="3" required></textarea> </div>
</div> <div class="form-group">
<div class="custom-control custom-checkbox"> <label for="beschreibung">Beschreibung</label>
<input type="checkbox" id="visibility" class="custom-control-input" th:name="visibility"> <textarea th:name="beschreibung" class="form-control" id="beschreibung" rows="3" required></textarea>
<label class="custom-control-label" for="visibility">Private Gruppe</label> </div>
</div> <div class="custom-control custom-checkbox">
<div class="form-group"> <input type="checkbox" id="visibility" class="custom-control-input" th:name="visibility">
<label for="sel1"></label> <label class="custom-control-label" for="visibility">Private Gruppe</label>
<select class="form-control" id="sel1"> </div>
<option selected="true" disabled>--Bitte Veranstaltung auswählen--</option> <div class="form-group">
<option>1</option> <label for="sel1"></label>
<option>2</option> <select class="form-control" id="sel1">
<option>3</option> <option selected="true" disabled>--Bitte Veranstaltung auswählen--</option>
<option>4</option> <option>1</option>
</select> <option>2</option>
</div> <option>3</option>
<div class="form-group pt-4"> <option>4</option>
<button class="btn btn-primary" type="submit" style="background: #52a1eb; border-style: none">Erstellen</button> </select>
</div> </div>
<div class="form-group pt-4">
<button class="btn btn-primary" type="submit" style="background: #52a1eb; border-style: none">Erstellen</button>
</div>
</div>
</form>
</div> </div>
</form> </div>
</div> </div>
</main> </main>
</body> </body>

6
src/main/resources/templates/index.html
View File

@ -26,12 +26,12 @@
</header> </header>
<main th:fragment="bodycontent"> <main th:fragment="bodycontent">
<div class="container-fluid"> <div class="container-fluid">
<div class="row" > <div class="row">
<div class="col-10"> <div class="col-10">
<h1>Meine Gruppen</h1> <h1>Meine Gruppen</h1>
<form action="/" method="get"> <form action="/" method="get">
<div th:each="gruppe: ${gruppen}"> <div th:each="gruppe: ${gruppen}">
<div style="border: 10px solid aliceblue; background: aliceblue"> <div class="shadow" style="border: 10px solid aliceblue; background: aliceblue">
<h3> <h3>
<a th:href="@{/gruppen2/details(id=${gruppe.getId()})}" style="color: dodgerblue; font-weight: bold" th:text="${gruppe.getTitle()}"></a> <a th:href="@{/gruppen2/details(id=${gruppe.getId()})}" style="color: dodgerblue; font-weight: bold" th:text="${gruppe.getTitle()}"></a>
</h3> </h3>
@ -41,7 +41,7 @@
</div> </div>
</form> </form>
</div> </div>
<div class="col-2" > <div class="col-2">
<div class="card" style="background: lightgrey"> <div class="card" style="background: lightgrey">
<div class="card-body"> <div class="card-body">
<h2 class="card-title" th:text="${user.getUser_id()}" style="text-align: center">user_id</h2> <h2 class="card-title" th:text="${user.getUser_id()}" style="text-align: center">user_id</h2>

62
src/main/resources/templates/search.html
View File

@ -27,38 +27,38 @@
<main th:fragment="bodycontent"> <main th:fragment="bodycontent">
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<h1>Gruppensuche</h1> <div class="col-10">
<div class="container-fluid"> <h1>Gruppensuche</h1>
<form action="/gruppen2/findGroup" method="get"> <form action="/gruppen2/findGroup" method="get">
<div style="border: 10px solid aliceblue; background: aliceblue"> <div class="shadow" style="border: 10px solid aliceblue; background: aliceblue">
<div class="form-group"> <div class="form-group">
<label for="suchleiste">Suchbegriff:</label> <label for="suchleiste">Suchbegriff:</label>
<input id="suchleiste" class="form-control" placeholder="z.B. Programmieren, Lerngruppe, ..." th:name="suchbegriff" type="text"> <input id="suchleiste" class="form-control" placeholder="z.B. Programmieren, Lerngruppe, ..." th:name="suchbegriff" type="text">
</div>
<button type="submit" class="btn btn-primary" style="background: #52a1eb; border-style: none">Suchen</button>
</div> </div>
</form> <button type="submit" class="btn btn-primary" style="background: #52a1eb; border-style: none">Suchen</button>
<br> </div>
<table class="table"> </form>
<!-- Erscheint dann, wenn man "Suchen" Button klickt und Ergebnisse angezeigt werden, aber so solls aussehen --> <br>
<thead th:if="${!gruppen.isEmpty()}"> <table class="table">
<tr> <!-- Erscheint dann, wenn man "Suchen" Button klickt und Ergebnisse angezeigt werden, aber so solls aussehen -->
<th scope="col">Gruppenname</th> <thead th:if="${!gruppen.isEmpty()}">
<th scope="col">Beschreibung</th> <tr>
<th scope="col">Öffentlich/Privat</th> <th scope="col">Gruppenname</th>
<th scope="col">Mitgliederanzahl</th> <th scope="col">Beschreibung</th>
</tr> <th scope="col">Öffentlich/Privat</th>
</thead> <th scope="col">Mitgliederanzahl</th>
<tbody th:each="gruppe : ${gruppen}"> </tr>
<tr> </thead>
<th scope="row" th:text="${gruppe.title}">Gruppenname</th> <tbody th:each="gruppe : ${gruppen}">
<td th:text="${gruppe.getDescription()}">Beschreibung</td> <tr>
<td th:text="${gruppe.getVisibility()}">Öffentlich</td> <th scope="row" th:text="${gruppe.title}">Gruppenname</th>
<td th:text="${gruppe.getMembers().size()}">Mitgliederanzahl</td> <td th:text="${gruppe.getDescription()}">Beschreibung</td>
</tr> <td th:text="${gruppe.getVisibility()}">Öffentlich</td>
</tbody> <td th:text="${gruppe.getMembers().size()}">Mitgliederanzahl</td>
</table> </tr>
</div> </tbody>
</table>
</div>
</div> </div>
</div> </div>
</main> </main>