dashboard eye candy
This commit is contained in:
parent
a3df68e4f7
commit
f49fb7edab
@ -18,7 +18,7 @@ apply plugin: 'war'
|
|||||||
apply plugin: 'application'
|
apply plugin: 'application'
|
||||||
|
|
||||||
group = 'de.jottyfan.camporganizer'
|
group = 'de.jottyfan.camporganizer'
|
||||||
version = '0.0.3'
|
version = '0.0.4'
|
||||||
sourceCompatibility = 17
|
sourceCompatibility = 17
|
||||||
mainClassName = "de.jottyfan.camporganizer.Main"
|
mainClassName = "de.jottyfan.camporganizer.Main"
|
||||||
|
|
||||||
|
@ -4,7 +4,8 @@ html {
|
|||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
background-image: linear-gradient(to bottom right, rgb(255, 190, 111), rgb(198, 70, 0));
|
background-image: linear-gradient(to bottom right, rgb(255, 190, 111),
|
||||||
|
rgb(198, 70, 0));
|
||||||
}
|
}
|
||||||
|
|
||||||
.mainpage {
|
.mainpage {
|
||||||
@ -12,7 +13,8 @@ body {
|
|||||||
padding: 8px;
|
padding: 8px;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: calc(100vh - 60px); /* 60 px is the current height of the headline; TODO: calculate it */
|
height: calc(100vh - 60px);
|
||||||
|
/* 60 px is the current height of the headline; TODO: calculate it */
|
||||||
}
|
}
|
||||||
|
|
||||||
.middlecenter {
|
.middlecenter {
|
||||||
@ -87,12 +89,24 @@ body {
|
|||||||
color: darkcyan;
|
color: darkcyan;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.btn-dropdown {
|
||||||
|
right: 2px;
|
||||||
|
top: 2px;
|
||||||
|
position: absolute;
|
||||||
|
border: 1px solid silver;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-dropdown:hover {
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
.badgetodo {
|
.badgetodo {
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
border: 1px solid black;
|
border: 1px solid black;
|
||||||
color: white;
|
color: white;
|
||||||
font-weight: bolder;
|
font-weight: bolder;
|
||||||
background-image: linear-gradient(to right bottom, rgb(153, 193, 241), rgb(26, 95, 180));
|
background-image: linear-gradient(to right bottom, rgb(153, 193, 241),
|
||||||
|
rgb(26, 95, 180));
|
||||||
padding: 2px 4px 2px 4px;
|
padding: 2px 4px 2px 4px;
|
||||||
margin: 0px 2px 0px 2px;
|
margin: 0px 2px 0px 2px;
|
||||||
}
|
}
|
||||||
@ -112,7 +126,8 @@ body {
|
|||||||
border: 1px solid black;
|
border: 1px solid black;
|
||||||
color: white;
|
color: white;
|
||||||
font-weight: bolder;
|
font-weight: bolder;
|
||||||
background-image: linear-gradient(to right bottom, rgb(143, 240, 164), rgb(38, 162, 105));
|
background-image: linear-gradient(to right bottom, rgb(143, 240, 164),
|
||||||
|
rgb(38, 162, 105));
|
||||||
padding: 2px 4px 2px 4px;
|
padding: 2px 4px 2px 4px;
|
||||||
margin: 0px 2px 0px 2px;
|
margin: 0px 2px 0px 2px;
|
||||||
}
|
}
|
||||||
@ -131,7 +146,7 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.usercard {
|
.usercard {
|
||||||
width: 480px;
|
width: 640px;
|
||||||
background-color: rgba(255, 255, 255, 0.8) !important;
|
background-color: rgba(255, 255, 255, 0.8) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -145,4 +160,4 @@ body {
|
|||||||
|
|
||||||
.mytoggle_btn:hover {
|
.mytoggle_btn:hover {
|
||||||
background-color: #abcdef;
|
background-color: #abcdef;
|
||||||
}
|
}
|
@ -16,7 +16,10 @@
|
|||||||
<div class="mainpage">
|
<div class="mainpage">
|
||||||
<div class="card usercard" th:each="b : ${mybookings}">
|
<div class="card usercard" th:each="b : ${mybookings}">
|
||||||
<div class="card-header">
|
<div class="card-header">
|
||||||
<span th:text="${b.campName + ' ' + #numbers.formatInteger(b.year, 4)}" style="font-weight: bolder"></span> in <a th:href="${b.url}" target="_blank" th:text="${b.locationName}"></a>
|
<span th:text="${b.forename + ' ' + b.surname + ' an ' + b.campName + ' ' + #numbers.formatInteger(b.year, 4)}" style="font-weight: bolder"></span> in <a th:href="${b.url}"
|
||||||
|
target="_blank" th:text="${b.locationName}"></a><button class="btn btn-dropdown" style="right: 2px; top: 2px; position: absolute" th:onclick="$('#body_' + [[${b.pk}]]).toggle()"><i class="fas fa-caret-down"></i></button>
|
||||||
|
</div>
|
||||||
|
<div th:id="${'body_' + b.pk}" class="card-body">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-sm-4">Zeit:</div>
|
<div class="col-sm-4">Zeit:</div>
|
||||||
@ -29,8 +32,7 @@
|
|||||||
<div class="col-sm-8" th:text="${b.countries}"></div>
|
<div class="col-sm-8" th:text="${b.countries}"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<hr />
|
||||||
<div class="card-body">
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-sm-4">Rolle:</div>
|
<div class="col-sm-4">Rolle:</div>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user