ClaptrapBot/src/main/resources/templates/index.html

131 lines
5.1 KiB
HTML
Raw Normal View History

2017-12-22 19:20:26 +01:00
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0"/>
2018-12-04 15:52:42 +01:00
<meta name="description" content="Claptrap discord bot at your service! Add me to your discord server and my beautiful web interface will be there for you ! Music control, config, news, you can do anything with my web page!"/>
2018-05-14 09:29:55 +02:00
<title>Claptrap Bot</title>
<link rel="icon"
type="image/x-icon"
2018-02-16 14:18:28 +01:00
href="/favicon.png"/>
2017-12-22 19:20:26 +01:00
<!-- CSS -->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"/>
2018-04-26 16:58:01 +02:00
<link href="css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection"/>
<link href="css/style.css" type="text/css" rel="stylesheet" media="screen,projection"/>
2018-09-13 09:35:50 +02:00
<link rel="manifest" href="/manifest.json"/>
2018-12-02 15:00:14 +01:00
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/octicons/2.0.2/octicons.min.css"/>
<link rel="stylesheet" href="css/github-activity.css"/>
2018-09-13 09:47:10 +02:00
<meta name="theme-color" content="#263238"/>
2018-12-02 15:00:14 +01:00
<style>
@media only screen and (max-width: 992px) {
.row.valign-wrapper {
display: inherit;
}
}
</style>
2018-09-10 14:53:56 +02:00
2017-12-22 19:20:26 +01:00
</head>
2018-11-30 16:27:56 +01:00
<body class="blue-grey lighten-5">
<header>
2018-12-02 15:00:14 +01:00
<div th:replace="header :: header ('home',${guild_name}, ${isAdmin})">...</div>
2018-11-30 16:27:56 +01:00
</header>
<main>
2018-12-02 15:00:14 +01:00
2018-12-03 15:36:56 +01:00
<div class="row">
<div class="col offset-l4 l4 m6 offset-m3 s12">
</div>
</div>
<div class="section no-pad-bot container main" id="index-banner"><div th:if="${isLogged} == false">
2018-12-02 15:00:14 +01:00
<div class="row valign-wrapper">
2018-12-03 15:36:56 +01:00
<div class="col m6 offset-s2 s8 center">
2018-12-02 15:00:14 +01:00
<img src="/favicon.png" class="responsive-img"/>
2018-12-03 15:36:56 +01:00
<div class="card blue-grey">
<div class="card-content white-text center z-depth-5">
<span class="card-title">Add me to you'r server !</span>
<a class="btn green" th:href="${inviteLink}" target="_blank">Invite me !</a>
</div>
</div>
2018-12-02 15:00:14 +01:00
</div>
<div class="col m6 s12 center flow-text">
<h2>Hello you !</h2>
<h4>Please log in to have access to you'r server</h4>
<a class="btn green pulse" style="margin-top: 10px" href="/login">Log in / Register</a>
</div>
</div>
2018-11-30 16:27:56 +01:00
</div>
2018-12-02 15:00:14 +01:00
<div th:if="${isLogged} == true">
<div th:if="${noMutualGuilds} == true">
<div class="row valign-wrapper">
<div class="col m6 offset-s3 s6">
<img src="/favicon.png" class="responsive-img"/>
</div>
<div class="col m6 s12 center flow-text">
<h2>Oh no !</h2>
<h4>We don't have any mutual server !</h4>
<h5>You can change this by inviting me with this button !</h5>
2018-12-02 15:00:14 +01:00
<a th:href="${inviteLink}" class="btn blue pulse" style="margin-top: 10px" href="/login" target="_blank">Invite me !</a>
</div>
</div>
</div>
<div th:if="${noMutualGuilds} == false">
<div class="row">
2018-12-03 15:36:56 +01:00
<div class="col m6 offset-s2 s8 center">
2018-12-02 15:00:14 +01:00
<img src="/favicon.png" class="responsive-img"/>
<h2 class="flow-text">Home Page Comming soon!</h2>
2018-12-03 15:36:56 +01:00
<div class="card blue-grey">
<div class="card-content white-text center z-depth-4">
<span class="card-title">Add me to you'r server !</span>
<a class="btn green waves-effect" th:href="${inviteLink}" target="_blank">Invite me !</a>
</div>
</div>
2018-12-02 15:00:14 +01:00
</div>
<div class="col m6 s12">
2018-12-03 15:36:56 +01:00
<div class="z-depth-2" id="feed" style="height: 80vh"></div>
2018-12-02 15:00:14 +01:00
</div>
</div>
</div>
</div>
2018-02-16 14:18:28 +01:00
</div>
2018-11-30 16:27:56 +01:00
</main>
2018-02-16 14:18:28 +01:00
2018-11-30 16:27:56 +01:00
<footer class="page-footer" style="padding: 0">
<div th:replace="footer :: footer">...</div>
</footer>
2017-12-22 19:20:26 +01:00
<!-- Scripts-->
2018-04-30 16:51:09 +02:00
<script th:src="@{/js/jquery-3.3.1.min.js}"></script>
2018-02-16 14:18:28 +01:00
<script th:src="@{/js/materialize.js}"></script>
<script th:src="@{/js/navabar.js}"></script>
<script th:src="@{/js/js.cookie.js}"></script>
<script th:src="@{/js/fontawesome.js}"></script>
2018-09-13 09:35:50 +02:00
<script th:src="@{/js/workerRegister.js}"></script>
2018-12-02 15:00:14 +01:00
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/mustache.js/0.7.2/mustache.min.js"></script>
<script th:src="@{/js/github-activity.js}"></script>
<script>
GitHubActivity.feed({
username: "BrokenFire",
repository: "ClaptrapBot", // optional
selector: "#feed",
limit: 20 // optional
});
</script>
2018-09-10 14:53:56 +02:00
2017-12-22 19:20:26 +01:00
</body>
</html>