Silias-Public
/
genderwatchprotocol
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Styling

This commit is contained in:
schrom01 2023-02-16 12:44:01 +01:00
parent 7ee78f7f5c
commit 1c22109df7
3 changed files with 116 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
css/custom.css
View File

@ -1,3 +1,59 @@
.active { .activeWatch {
background-color: lightgray; background-color: lightgray;
}
h2 {
margin-left: 10px;
margin-top: 25px !important;
}
.table-bordered {
width: 100%;
table-layout: fixed;
text-align: center;
/*border: 1px solid #0e0017 !important;*/
}
button {
/*background-color: lightgray;*/
/*border: none;*/
/*color: white;*/
padding: 1% 5%;
text-align: center;
text-decoration: none;
display: inline-block;
/*font-size: 16px;*/
border-radius: 20px;
}
button, .form-group{
margin: 5px !important;
}
input {
text-align: center;
}
.stopButton, .resetButton {
width: 98% !important;
}
.form-group {
width: 98%;
}
.tableHeader {
min-width: 100px;
}
footer {
position: absolute;
bottom: 0;
width: 100%;
height: 10.5rem; /* Footer height */
}
.footer {
vertical-align: top;
text-align: left;
} }

65
index.html
View File

@ -1,21 +1,42 @@
<html lang="de"> <html lang="de">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/custom.css"> <link rel="stylesheet" href="css/custom.css">
<link rel="stylesheet" href="css/bootstrap.css"> <link rel="stylesheet" href="css/bootstrap.css">
<title>Genderwatch-protocol</title> <title>Genderwatch-protocol</title>
</head> </head>
<body> <body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="index.html">Genderwatch-protocol&nbsp;</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="true" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button>
<div class="navbar-collapse collapse show" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active"> <a class="nav-link" href="index.html">Home</a> </li>
<li class="nav-item"> <a class="nav-link" href="beschreibung.php">Über uns</a> </li>
</ul>
<form class="form-inline my-2 my-lg-0">
</form>
</div>
</nav>
<section> <section>
<div class="container"> <div class="container">
<h1>Genderwatch-protocol</h1> <h1>Genderwatch-protocol</h1>
<a href="dataCollector/dataCollector.php">Alle Daten herunterladen (anonymisiert)</a> <a href="dataCollector/dataCollector.php">Alle Daten herunterladen (anonymisiert)</a>
<h2 style="margin-left: 10px;">Aktuelles Thema</h2> <h2>Aktuelles Thema</h2>
<table class="table-bordered"> <table class="table-bordered">
<tr> <tr>
<td colspan="2"> <td colspan="2">
<input class="form-control" type="text" id="topicInput" placeholder="Thema hier eingeben"> <div class="form-group">
<input class="form-control" type="text" id="topicInput" placeholder="Thema hier eingeben">
</div>
</td> </td>
<td> <td>
<button class="" onclick="closeTopic()"> <button class="" onclick="closeTopic()">
@ -70,12 +91,12 @@
</tr> </tr>
<tr> <tr>
<td colspan="3"> <td colspan="3">
<button class="" style="width: 98%;" onclick="stop()">Hört auf zu Reden, -> Stille</button> <button class="stopButton" onclick="stop()">Hört auf zu Reden, -> Stille</button>
</td> </td>
</tr> </tr>
<tr> <tr>
<td colspan="3"> <td colspan="3">
<button class="" style="width: 98%;" onclick="resetButton()">Reset</button> <button class="resetButton" onclick="resetButton()">Reset</button>
</td> </td>
</tr> </tr>
</table> </table>
@ -91,16 +112,16 @@
<table class="table-bordered"> <table class="table-bordered">
<thead> <thead>
<tr> <tr>
<th style="min-width: 100px;"> <th class="tableHeader">
Thema Thema
</th> </th>
<th style="min-width: 100px;"> <th class="tableHeader">
M M
</th> </th>
<th style="min-width: 100px;"> <th class="tableHeader">
W W
</th> </th>
<th style="min-width: 100px;"> <th class="tableHeader">
D D
</th> </th>
</tr> </tr>
@ -116,6 +137,34 @@
</div> </div>
</section> </section>
<footer class="text-center">
<div class="container footer">
<div class="row">
<table>
<tr>
<td class="footer">
<div class="col-12">
<p><span><b>Impressum</b></span><br>
Maurus Pfalzgraf<br>
<a href="mailto:info@genderwatchprotocol.com">info@genderwatchprotocol.com</a></p>
</div>
</td>
<td class="footer">
<div class="col-12">
<p><span><b>Erstellt durch</b></span><br>
Silias KLG<br>
Toggenburgstrasse 31<br>
8245 Feuerthalen<br>
<a href="https://www.silias.ch" target="_blank">www.silias.ch</a><br>
<a href="mailto:info@silias.ch">info@silias.ch</a></p>
</div>
</td>
</tr>
</table>
</div>
</div>
</footer>
<script src="js/functions.js"></script> <script src="js/functions.js"></script>
<script> <script>

4
js/functions.js
View File

@ -138,9 +138,9 @@ function refreshWatch(watchIndex) {
let timeCell = document.getElementById("time-" + watchIndex) let timeCell = document.getElementById("time-" + watchIndex)
timeCell.textContent = timeToISO(sumForWatch(actualTopic.watches[watchIndex])) timeCell.textContent = timeToISO(sumForWatch(actualTopic.watches[watchIndex]))
if(actualTopic.watches[watchIndex]["actions"].length !== 0 && actualTopic.watches[watchIndex]["actions"].slice(-1)[0]["type"] === "start"){ if(actualTopic.watches[watchIndex]["actions"].length !== 0 && actualTopic.watches[watchIndex]["actions"].slice(-1)[0]["type"] === "start"){
timeCell.classList.add("active") timeCell.classList.add("activeWatch")
} else { } else {
timeCell.classList.remove("active") timeCell.classList.remove("activeWatch")
} }
let countCell = document.getElementById("count-" + watchIndex) let countCell = document.getElementById("count-" + watchIndex)
countCell.textContent = countForWatch(actualTopic.watches[watchIndex]) + " Wortmeldungen" countCell.textContent = countForWatch(actualTopic.watches[watchIndex]) + " Wortmeldungen"