Commit 14ca282e authored by Joe TS Dell's avatar Joe TS Dell
Browse files

update design

parent d6aa39c3
......@@ -25,7 +25,7 @@
{
"item": {
"title": "COVID-STA",
"project": "",
"project": "iCity Project",
"author": {
"firstName": "Joe",
"lastName": "T. Santhanavanich",
......@@ -36,8 +36,8 @@
"project_is_on_going": true,
"imageLink":"imgs/thumbnails/covidSta.jpg",
"keywords":["SensorThings API","COVID-19", "Urban Analytics"],
"description_en":"The OGC SensorThings API server for managing the COVID-19 case statistic data.",
"description_de":"Der OGC SensorThings API Server zur Verwaltung der COVID-19 Fallstatistikdaten."
"description_en":"The COVID-STA is the OGC SensorThings API data server which provides an open standard-based and geospatial-enabled framework to interconnect the COVID-19 statistics and applications over the web.",
"description_de":"Der COVID-STA ist der OGC SensorThings API-Datenserver, der ein auf offenen Standards basierendes und raumbezogenes Framework zur Verfügung stellt, um die COVID-19-Statistiken und Anwendungen über das Web miteinander zu verbinden."
},
"links": {
"demo": "https://covidsta.hft-stuttgart.de/server/",
......
......@@ -4,6 +4,7 @@
margin-bottom: 0;
background-color: #fff;
}
@media (min-width: 768px) {
.jumbotron {
padding-top: 6rem;
......@@ -15,8 +16,18 @@
font-family: 'Noto Sans JP', sans-serif;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Roboto', sans-serif;
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: 'Roboto', sans-serif;
}
.content-subtitle {
font-family: 'Noto Sans JP';
font-size: 0.85em;
}
.jumbotron p:last-child {
......@@ -40,8 +51,9 @@ footer p {
margin-bottom: 0.25rem;
}
body{
background-color: #cc3125;/* thistle; */
body {
background-color: #cc3125;
/* thistle; */
}
.bd-placeholder-img {
......@@ -65,56 +77,65 @@ a {
/* text-decoration: underline; */
background-color: transparent;
}
a:hover{
a:hover {
color: rgb(65, 57, 57);
}
a:visited {
/* color: black; */
/* color: black; */
}
.myBtn {
color: #fff;
background-color: tomato;
border-color: thistle; /*set the color you want here*/
width: 180px;
color: #fff;
background-color: tomato;
border-color: thistle;
/*set the color you want here*/
width: 180px;
}
.myBtn:hover, .myBtn:focus, .myBtn:active, .myBtn.active, .open>.dropdown-toggle.myBtn {
color: #fff;
background-color: thistle;
border-color: #285e8e; /*set the color you want here*/
.myBtn:hover,
.myBtn:focus,
.myBtn:active,
.myBtn.active,
.open>.dropdown-toggle.myBtn {
color: #fff;
background-color: thistle;
border-color: #285e8e;
/*set the color you want here*/
}
.thumbimg{
width: 100%;
height: 225px;
.thumbimg {
width: 100%;
height: 225px;
}
a.button {
-webkit-appearance: button;
-moz-appearance: button;
appearance: button;
-webkit-appearance: button;
-moz-appearance: button;
appearance: button;
text-decoration: none;
color: blue;
border: solid;
border: 4px;
text-decoration: none;
color: blue;
border: solid;
border: 4px;
}
.windSVG{
margin-right : 20px;
.windSVG {
margin-right: 20px;
}
.hftlogo{
.hftlogo {
/* margin-right : 20px; */
/* width: 100px; */
}
.hftlogo:hover{
.hftlogo:hover {
cursor: pointer;
}
.extension{
.extension {
padding: 20px 10px;
/* min-height: 445px; */
/* max-height: 445px; */
......@@ -122,25 +143,25 @@ a.button {
height: 610px;
}
.py-5{
padding: 1rem!important;
.py-5 {
padding: 1rem !important;
}
.card-body{
.card-body {
min-height: 90px;
padding: 0.5rem 0.5rem 0.2rem;
}
.card-text{
.card-text {
max-height: 85px;
overflow: auto;
/* overflow-y: auto; */
/* overflow-y: auto; */
/* padding-bottom: 10px; */
}
.btnGroupDiv{
.btnGroupDiv {
/* padding: 20px 00px 00px 20px; */
padding: 0.5rem;
}
......@@ -153,15 +174,17 @@ a.button {
color: #9e9e9e !important;
}
.z-depth-1, .chip:active {
-webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12) !important;
box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12) !important;
.z-depth-1,
.chip:active {
-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12) !important;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12) !important;
}
.hftBackground {
background-image: url(../imgs/avatar/Bibliothek_HFT_f.jpg);
background-size: cover;
}
/* .hftBackground::after {
content: '';
z-index: 0;
......@@ -171,9 +194,9 @@ a.button {
top: 0;
} */
main[role=main]{
background-color: #f8f9fa!important;
padding-bottom: 1rem!important;
main[role=main] {
background-color: #f8f9fa !important;
padding-bottom: 1rem !important;
}
a {
......@@ -191,30 +214,34 @@ a:hover {
background-color: #cccccc;
color: #0f0f0f;
margin-left:40%;
margin-left: 40%;
cursor: pointer;
border-radius: .2rem;
border: none;
border: 0px;
width: 6em;
height: 2em;
}
.previous:disabled,
.previous[disabled]{
.previous[disabled] {
cursor: not-allowed;
background-color: #f1f1f1;
color: #666666;
}
.next:disabled,
.next[disabled]{
.next[disabled] {
background-color: #0069d970;
color: #666666;
cursor: not-allowed;
}
#papercount{
#papercount {
text-align: center;
}
.next {
/* background-color: #2196f3 !important; */
color: white;
......@@ -228,7 +255,8 @@ a:hover {
height: 2em;
}
.next:hover{
.next:hover {
background-color: #005bbd !important;
border: none;
border: 0px;
......@@ -237,6 +265,7 @@ a:hover {
.round {
border-radius: 50%;
}
.publication_card{
overflow:hidden;
.publication_card {
overflow: hidden;
}
\ No newline at end of file
......@@ -68,7 +68,7 @@
<div class="container">
<img src="imgs/ugl.svg" class="windSVG" width="100px" alt="wind">
<h1 class="display-5 fw-bold" >Urban Geoinformatics Lab</h1>
<h3 class="text-muted"> @HFT Stuttgart </h3>
<h3 style="color:#cc3125"> @HFT Stuttgart </h3>
</div>
</section>
......@@ -420,7 +420,9 @@
<p class="float-right">
<a id="rgc_backtotop" href="#">Back to top</a>
</p>
<p>&copy; HFT Stuttgart, 2020 - <span id="current-year"></span>.</p>
<p>
<img src="imgs/ugl.svg" alt="" width="32px">
Urban Geoinformatics Lab @HFT Stuttgart, 2020 - <span id="current-year"></span>.</p>
<a href="https://www.hft-stuttgart.de/impressum" target="_blank">Impressum</a>
<a href="https://www.hft-stuttgart.de/datenschutz" target="_blank">Datenschutz</a>
</div>
......
......@@ -52,7 +52,7 @@ function addcontent(item) {
new_row.innerHTML = new_row.innerHTML + '<div class="col-lg-4">' +
'<div class="card mb-4 shadow-sm extension overflow-auto">' +
'<h5>' + item.item.title + ' <span class="lead text-muted"> ' + item.item.project + '</span></h5>' +
'<h5>' + item.item.title + ' <span class="content-subtitle text-muted"> ' + item.item.project + '</span></h5>' +
'<img class="thumbimg" src="' + item.item.imageLink + '" alt="">' +
'<div class="card-body">' +
'<p class="card-text-lg small">' +
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment