dschick/git_bsmd
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

simples Stylesheet hinzugefügt

Browse Source
This commit is contained in:
Daniel Schick 2022-10-18 09:48:22 +02:00
parent 7654748a9d
commit de721220b2
2 changed files with 147 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
AIS/bsmd.AIS2Service/index.html
View File

@ -1,28 +1,31 @@
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="style.css">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>AIS List</title>
<script type="text/javascript" src="update.js"></script>
</head>
<body onload="startup()">
<table id="aisTable">
<thead>
<tr>
<th>MMSI</th>
<th>Name</th>
<th>Timestamp</th>
<th>Latitude</th>
<th>Longitude</th>
<th>IMO</th>
<th>Class B</th>
</tr>
</thead>
<tbody id="aisTableBody">
<body onload="startup()">
<div class="table-wrapper">
<table id="aisTable" class="fl-table">
<thead>
<tr>
<th>MMSI</th>
<th>Name</th>
<th>Timestamp</th>
<th>Latitude</th>
<th>Longitude</th>
<th>IMO</th>
<th>Class B</th>
</tr>
</thead>
<tbody id="aisTableBody">
</tbody>
</table>
</tbody>
</table>
</div>
</body>
</html>

128
AIS/bsmd.AIS2Service/style.css Normal file
View File

@ -0,0 +1,128 @@
*{
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}
body{
font-family: Helvetica;
-webkit-font-smoothing: antialiased;
background: rgba( 71, 147, 227, 1);
}
h2{
text-align: center;
font-size: 18px;
text-transform: uppercase;
letter-spacing: 1px;
color: white;
padding: 30px 0;
}
/* Table Styles */
.table-wrapper{
margin: 10px 70px 70px;
box-shadow: 0px 35px 50px rgba( 0, 0, 0, 0.2 );
}
.fl-table {
border-radius: 5px;
font-size: 12px;
font-weight: normal;
border: none;
border-collapse: collapse;
width: 100%;
max-width: 100%;
white-space: nowrap;
background-color: white;
}
.fl-table td, .fl-table th {
text-align: center;
padding: 8px;
}
.fl-table td {
border-right: 1px solid #f8f8f8;
font-size: 12px;
}
.fl-table thead th {
color: #ffffff;
background: #4FC3A1;
}
.fl-table thead th:nth-child(odd) {
color: #ffffff;
background: #324960;
}
.fl-table tr:nth-child(even) {
background: #F8F8F8;
}
/* Responsive */
@media (max-width: 767px) {
.fl-table {
display: block;
width: 100%;
}
.table-wrapper:before{
content: "Scroll horizontally >";
display: block;
text-align: right;
font-size: 11px;
color: white;
padding: 0 0 10px;
}
.fl-table thead, .fl-table tbody, .fl-table thead th {
display: block;
}
.fl-table thead th:last-child{
border-bottom: none;
}
.fl-table thead {
float: left;
}
.fl-table tbody {
width: auto;
position: relative;
overflow-x: auto;
}
.fl-table td, .fl-table th {
padding: 20px .625em .625em .625em;
height: 60px;
vertical-align: middle;
box-sizing: border-box;
overflow-x: hidden;
overflow-y: auto;
width: 120px;
font-size: 13px;
text-overflow: ellipsis;
}
.fl-table thead th {
text-align: left;
border-bottom: 1px solid #f7f7f9;
}
.fl-table tbody tr {
display: table-cell;
}
.fl-table tbody tr:nth-child(odd) {
background: none;
}
.fl-table tr:nth-child(even) {
background: transparent;
}
.fl-table tr td:nth-child(odd) {
background: #F8F8F8;
border-right: 1px solid #E6E4E4;
}
.fl-table tr td:nth-child(even) {
border-right: 1px solid #E6E4E4;
}
.fl-table tbody td {
display: block;
text-align: center;
}
}