some styling

This commit is contained in:
2024-04-30 11:06:49 +02:00
parent 8bb931b886
commit 5c3d9ddc1c
2 changed files with 87 additions and 54 deletions

View File

@@ -4,6 +4,7 @@
<meta charset="UTF-8">
<title>services</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script src="services.js"></script>
</head>
<body>
<h1>Services</h1>
@@ -11,53 +12,56 @@
<a href="#add" class="bookmark">Want to add a new line?</a>
<br>
<br>
<table>
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th colspan="2">Actions</th>
</tr>
</thead>
</table>
<h2 id="add">Add a new line</h2>
<table class="inputs">
<tr>
<th>ID</th>
<th><input type="text"></th>
</tr>
<tr>
<th>Maintainer</th>
<th><input type="text"></th>
</tr>
<tr>
<th>Name</th>
<th><input type="text"></th>
</tr>
<tr>
<th>Version</th>
<th><input type="text"></th>
</tr>
<tr>
<th>Account</th>
<th><input type="text"></th>
</tr>
<tr>
<th>Notes</th>
<th><input type="text"></th>
</tr>
<tr>
<th>Service domain</th>
<th><input type="text"></th>
</tr>
<tr>
<th>IP</th>
<th><input type="text"></th>
</tr>
<tr>
<th>Port</th>
<th><input type="text"></th>
</tr>
</table>
<table>
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th colspan="2">Actions</th>
</tr>
</thead>
<tbody id="resultarea">
</tbody>
</table>
<h2 id="add">Add a new line</h2>
<table class="inputs">
<tr>
<td>ID</td>
<td class="inputcell"><input type="text" id="in_id"></td>
</tr>
<tr>
<td>Maintainer</td>
<td class="inputcell"><input type="text" id="in_maintainer_id"></td>
</tr>
<tr>
<td>Name</td>
<td class="inputcell"><input type="text" id="in_name"></td>
</tr>
<tr>
<td>Version</td>
<td class="inputcell"><input type="text" id="in_version"></td>
</tr>
<tr>
<td>Account</td>
<td class="inputcell"><input type="text" id="in_account"></td>
</tr>
<tr>
<td>Notes</td>
<td class="inputcell"><input type="text" id="in_notes"></td>
</tr>
<tr>
<td>Service domain</td>
<td class="inputcell"><input type="text" id="in_domain"></td>
</tr>
<tr>
<td>IP</td>
<td class="inputcell"><input type="text" id="in_ip"></td>
</tr>
<tr>
<td>Port</td>
<td class="inputcell"><input type="text" id="in_port"></td>
</tr>
</table>
<div id="addresult"></div>
</body>
</html>

View File

@@ -1,7 +1,6 @@
body{
background-image: url("img/backround.jpg");
background-position: right top;
background-opacity: 0.8;
background-size: cover;
}
h1{
@@ -49,20 +48,50 @@ a.bookmark{
}
table.inputs{
text-align: left;
margin: 250px;
width: 50%;
text-align: right;
margin: 50px;
margin-left: auto;
margin-right: auto;
}
table
{
width: 100%;
width: 80%;
font-size: 20px;
color: white;
margin-left: auto;
margin-right: auto;
}
table th, table td
{
border: 1px solid white;
padding: 10px;
}
.inputcell
{
padding: 0;
margin: 0;
}
.inputcell input
{
color: white;
}
table td input
{
width: 100%;
height: 100%;
height: 30px;
box-sizing: border-box;
}
.list table, .list th, .list td
{
border: 1px solid white:
border: 1px solid white;
}
.list table
@@ -77,7 +106,7 @@ table
.list button
table button
{
width: 100%;
height: 30px;