improved visuals
This commit is contained in:
Marcel Gansfusz
@@ -20,10 +20,13 @@ function autocomplete(inp, type) {
|
||||
val = this.value;
|
||||
/*close any already open lists of autocompleted values*/
|
||||
closeAllLists();
|
||||
if (!val && type === "lva") {
|
||||
if (!val && type === "lva" && pid === null) {
|
||||
return false;
|
||||
}
|
||||
if (type === "prof" && lid !== null) {
|
||||
if (type === "lva" && pid !== null) {
|
||||
apirq =
|
||||
url + type + "?searchterm=" + val + "&pid=" + pid + "&searchlim=10";
|
||||
} else if (type === "prof" && lid !== null) {
|
||||
apirq =
|
||||
url + type + "?searchterm=" + val + "&lid=" + lid + "&searchlim=10";
|
||||
} else if (type === "subcat" && lid !== null && pid !== null) {
|
||||
|
||||
42
static/dynhide.js
Normal file
42
static/dynhide.js
Normal file
@@ -0,0 +1,42 @@
|
||||
var radiobuttons;
|
||||
var datediv;
|
||||
var subcatdiv;
|
||||
var rdbarr;
|
||||
var subcatcategories = [1, 2, 3];
|
||||
var datecategorires = [0, 1];
|
||||
function changevis() {
|
||||
for (let i = 0; i < rdbarr.length; i++) {
|
||||
if (rdbarr[i].checked) {
|
||||
if (subcatcategories.includes(i)) {
|
||||
subcatdiv.style.display = "block";
|
||||
} else {
|
||||
subcatdiv.style.display = "none";
|
||||
}
|
||||
if (datecategorires.includes(i)) {
|
||||
datediv.style.display = "block";
|
||||
} else {
|
||||
datediv.style.display = "none";
|
||||
}
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
function starthide() {
|
||||
radiobuttons = document.getElementsByName("stype");
|
||||
datediv = document.getElementById("datediv");
|
||||
subcatdiv = document.getElementById("subcatdiv");
|
||||
rdbarr = [
|
||||
document.getElementById("pruefung"),
|
||||
document.getElementById("klausur"),
|
||||
document.getElementById("uebung"),
|
||||
document.getElementById("labor"),
|
||||
document.getElementById("unterlagen"),
|
||||
document.getElementById("zusammenfassungen"),
|
||||
document.getElementById("multimedia"),
|
||||
];
|
||||
changevis();
|
||||
radiobuttons.forEach((rdb) => {
|
||||
rdb.addEventListener("change", changevis);
|
||||
});
|
||||
}
|
||||
window.addEventListener("load", starthide);
|
||||
10
static/filedrop.js
Normal file
10
static/filedrop.js
Normal file
@@ -0,0 +1,10 @@
|
||||
var fileinput;
|
||||
function dropHandler(eve) {
|
||||
eve.preventDefault();
|
||||
fileinput.files = eve.dataTransfer.files;
|
||||
}
|
||||
function init() {
|
||||
fileinput = document.getElementById("filepicker");
|
||||
document.getElementById("filepicker").addEventListener("drop", dropHandler);
|
||||
}
|
||||
window.addEventListener("load", init);
|
||||
128
static/style.css
128
static/style.css
@@ -6,7 +6,7 @@ body {
|
||||
|
||||
body {
|
||||
overflow: hidden;
|
||||
background-color: slategrey;
|
||||
background-color: #2f3957;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
}
|
||||
|
||||
@@ -15,11 +15,11 @@ body {
|
||||
margin: 0;
|
||||
width: 75vw;
|
||||
float: right;
|
||||
background-color: navy;
|
||||
/* background-color: navy; */
|
||||
}
|
||||
|
||||
.left {
|
||||
background-color: blueviolet;
|
||||
/* background-color: blueviolet; */
|
||||
height: 100%;
|
||||
float: left;
|
||||
}
|
||||
@@ -77,6 +77,16 @@ span {
|
||||
#submitdiv {
|
||||
/*position: relative;*/
|
||||
width: 500px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
label {
|
||||
/* color: white; */
|
||||
background-color: grey;
|
||||
border-radius: 5px;
|
||||
padding: 5px;
|
||||
/* margin: 10px; */
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
/*Things I've stolen from https://www.w3schools.com/howto/howto_js_autocomplete.asp*/
|
||||
@@ -84,29 +94,59 @@ span {
|
||||
/*the container must be positioned relative:*/
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 300px;
|
||||
/* width: 400px; */
|
||||
width: 100%;
|
||||
padding: none;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
#name {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
input {
|
||||
border: 1px solid transparent;
|
||||
background-color: #f1f1f1;
|
||||
border: 1px solid #818181;
|
||||
background-color: #a1a1a1;
|
||||
padding: 10px;
|
||||
font-size: 16px;
|
||||
/* height: 50px; */
|
||||
font-size: 12pt;
|
||||
border-radius: 20px;
|
||||
margin-top: 10px;
|
||||
/* margin-bottom: 10px; */
|
||||
}
|
||||
|
||||
input[type="text"] {
|
||||
background-color: #f1f1f1;
|
||||
width: 100%;
|
||||
background-color: #b1b1b1;
|
||||
/* width: 100%; */
|
||||
width: 478px;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
input[type="submit"] {
|
||||
background-color: DodgerBlue;
|
||||
color: #fff;
|
||||
/* input[type="text"]:focus { */
|
||||
/* border-bottom-right-radius: 0px; */
|
||||
/* border-bottom-left-radius: 0px; */
|
||||
/* outline: none; */
|
||||
/* } */
|
||||
|
||||
div>input[type="text"]:focus {
|
||||
border-bottom-right-radius: 0px;
|
||||
border-bottom-left-radius: 0px;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
button[type="submit"] {
|
||||
background-color: #0872a9;
|
||||
/* color: #fff; */
|
||||
border-radius: 20px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.autocomplete-items {
|
||||
position: absolute;
|
||||
border: 1px solid #d4d4d4;
|
||||
/* border: 1px solid #d4d4d4; */
|
||||
border: 1px solid #818181;
|
||||
background-color: #b1b1b1;
|
||||
/* background-color: #b1b1b1; */
|
||||
border-bottom: none;
|
||||
border-top: none;
|
||||
z-index: 99;
|
||||
@@ -114,22 +154,78 @@ input[type="submit"] {
|
||||
top: 100%;
|
||||
left: 0;
|
||||
right: 0;
|
||||
border-bottom-left-radius: 20px;
|
||||
border-bottom-right-radius: 20px;
|
||||
/* padding: 20px; */
|
||||
/* padding-top: 10px; */
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
.autocomplete-items div {
|
||||
padding: 10px;
|
||||
cursor: pointer;
|
||||
background-color: #fff;
|
||||
/* border-radius: 20px; */
|
||||
background-color: #b1b1b1;
|
||||
border-bottom: 1px solid #d4d4d4;
|
||||
}
|
||||
|
||||
.autocomplete-items div:hover {
|
||||
/*when hovering an item:*/
|
||||
background-color: #e9e9e9;
|
||||
background-color: #0872a9;
|
||||
}
|
||||
|
||||
.autocomplete-active {
|
||||
/*when navigating through the items using the arrow keys:*/
|
||||
background-color: DodgerBlue !important;
|
||||
background-color: #0872a9 !important;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
/* filedrop */
|
||||
input[type="file"] {
|
||||
/* flex: 1; */
|
||||
display: flex;
|
||||
background-color: #b1b1b1;
|
||||
border-radius: 20px;
|
||||
padding: 10px;
|
||||
width: 100%;
|
||||
margin-right: 10px;
|
||||
margin-top: 10px;
|
||||
margin-left: 10px;
|
||||
/* margin-bottom: auto; */
|
||||
}
|
||||
|
||||
input[type="file"]::file-selector-button {
|
||||
background-color: #d1d1d1;
|
||||
border-radius: 20px;
|
||||
border-color: #a1a1a1;
|
||||
}
|
||||
|
||||
#fileupload {
|
||||
/* display: inline-flex; */
|
||||
width: 500px;
|
||||
border-radius: 20px;
|
||||
background-color: #4f5977;
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.fileupload {
|
||||
margin-left: auto;
|
||||
margin-right: 10px;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
width: 25%;
|
||||
/* align-self: right; */
|
||||
/* float: right; */
|
||||
}
|
||||
|
||||
#uploadform {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.filetop {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
/* background-color: purple; */
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user