This repository has been archived on 2020-08-02. You can view files and clone it, but cannot push or open issues or pull requests.
e-commerce/prototype/src/main/resources/templates/fragments/header.html

67 lines
2.5 KiB
HTML
Raw Normal View History

<!DOCTYPE html>
<html lang="de" dir="ltr" xmlns:th="http://www.thymeleaf.org">
2020-02-06 19:44:51 +01:00
<head>
2020-04-27 09:48:24 +02:00
<meta charset="utf-8">
<title>eCommerce</title>
</head>
2020-02-06 19:44:51 +01:00
<body>
2020-04-27 09:48:24 +02:00
<nav class='hero header' th:fragment="header">
<div class='content-width bar-flex'>
<a class="button no-padding" href="/"><img class="logo" th:src="@{/img/ecom-logo-base.svg}"></a>
<form class='spacer input-icon secondary' th:action="@{/shop/search}" method="GET">
2020-05-14 15:43:16 +02:00
<input type="text" name="term" placeholder="Nach Produkten suchen..."/>
2020-02-06 19:44:51 +01:00
<button>Finden</button>
2020-04-27 09:48:24 +02:00
</form>
<a th:unless="${user}" class="button" th:href="@{/login}">Login</a>
<div th:if="${user}" class="dropdown">
2020-02-06 19:44:51 +01:00
<a class="dropdown-button button">Mein Konto</a>
<div class="dropdown-content">
2020-04-27 09:48:24 +02:00
<a class="black button" th:href="@{/user/notifications/}">Benachrichtigungen</a>
<a class="black button" th:href="@{/user/}">Einstellungen</a>
<a class="black button" th:href="@{/user/orders/}">Meine Bestellungen</a>
<form th:if="${user}" method="post" th:action="@{/logout}" class="no-margin">
<button class="bg-black no-margin full-width">Abmelden</button>
</form>
</div>
2020-04-27 09:48:24 +02:00
</div>
2020-05-05 17:24:25 +02:00
<a class="button" th:href="@{/shop/checkout}">Warenkorb (<span th:text="${shoppingCart.itemCount}"></span>)</a>
2020-04-27 09:48:24 +02:00
</div>
<div th:if="${error}" class="error" id="error-msg">
<div class="content-width bar-flex">
2020-02-06 19:44:51 +01:00
<div th:text="${error}" class="spacer error">
2020-04-27 09:48:24 +02:00
Error
2020-02-06 19:44:51 +01:00
</div>
<div class="">
2020-04-27 09:48:24 +02:00
<script>
2020-02-06 19:44:51 +01:00
function toggle(id) {
document.getElementById(id).classList.toggle("invisible");
}
2020-04-27 09:48:24 +02:00
</script>
<a class="secondary button error" href="javascript:void(0)" onclick="toggle('error-msg');">X</a>
2020-02-06 19:44:51 +01:00
</div>
2020-04-27 09:48:24 +02:00
</div>
</div>
<div th:if="${info}" class="info" id="info-msg">
<div class="content-width bar-flex">
2020-03-05 20:34:59 +01:00
<div th:text="${info}" class="spacer info">
2020-04-27 09:48:24 +02:00
Info
2020-03-05 20:34:59 +01:00
</div>
<div class="">
2020-04-27 09:48:24 +02:00
<script>
2020-03-05 20:34:59 +01:00
function toggle(id) {
document.getElementById(id).classList.toggle("invisible");
}
2020-04-27 09:48:24 +02:00
</script>
<a class="secondary button info" href="javascript:void(0)" onclick="toggle('info-msg');">X</a>
2020-03-05 20:34:59 +01:00
</div>
2020-04-27 09:48:24 +02:00
</div>
</div>
</nav>
</body>
2020-02-06 19:44:51 +01:00
</html>