This commit is contained in:
2025-05-19 21:45:54 +02:00
parent 038aca7a63
commit f2227e4445
7 changed files with 274 additions and 0 deletions

76
static/css/main.css Normal file
View File

@@ -0,0 +1,76 @@
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body, html {
height: 100%;
width: 100%;
}
.container {
display: flex;
height: 100%;
width: 100%;
}
#bereich-a {
width: 72.5%;
display: flex;
flex-direction: column;
height: 100%;
}
#bereich-b {
width: 27.5%;
display: flex;
flex-direction: column;
height: 100%;
}
.top {
height: 80px;
display: grid;
grid-template-columns: 50% 5% 7.5% 10%;
}
.top > div {
background-color: #ccc; /* Beispiel für Formularfelder */
}
.bottom {
flex-grow: 1;
display: grid;
grid-template-columns: 27.5% 7.5% 7.5% 7.5% 5% 7.5% 10%;
}
.bottom > div {
background-color: #ddd; /* Beispiel für die Unterteile */
}
#bereich-b .top {
height: 80px;
display: grid;
grid-template-columns: 100%;
}
#bereich-b .top > div {
background-color: #bbb; /* Beispiel für Formularfelder */
}
#bereich-b .bottom {
flex-grow: 1;
background-color: #f5f5f5; /* Beispiel für unteren Bereich */
}
table {
width: 100%;
border-collapse: collapse; /* Für eine saubere Darstellung */
}
th, td {
border: 1px solid #ddd; /* Beispiel für einen Rahmen */
padding: 8px;
text-align: center; /* Beispiel für Textzentrierung */
}

Binary file not shown.

Binary file not shown.

BIN
static/img/favicon.ico Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

View File

@@ -0,0 +1,77 @@
{{ define "layout" }}
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta name="description" content="HiKoS">
<title>HiKoS</title>
<link rel="icon" type="image/vnd.icon" href="/static/img/favicon.ico">
<link rel="stylesheet" href="/static/css/main.css">
</head>
<body>
<div class="container">
<div id="bereich-a">
<div class="top">
<div>Formular 1</div> <!-- Entspricht der Breite der ersten 4 unteren Spalten -->
<div>Formular 2</div>
<div>Formular 3</div>
<div>Formular 4</div>
</div>
<div class="bottom">
<table>
<colgroup>
<col style="width: 27.5%">
<col style="width: 7.5%">
<col style="width: 7.5%">
<col style="width: 7.5%">
<col style="width: 5%">
<col style="width: 7.5%">
<col style="width: 10%">
</colgroup>
<thead>
<tr>
<th>Spalte 1</th>
<th>Spalte 2</th>
<th>Spalte 3</th>
<th>Spalte 4</th>
<th>Spalte 5</th>
<th>Spalte 6</th>
<th>Spalte 7</th>
</tr>
</thead>
<tbody>
<tr>
<td>Teil 1</td>
<td>Teil 2</td>
<td>Teil 3</td>
<td>Teil 4</td>
<td>Teil 5</td>
<td>Teil 6</td>
<td>Teil 7</td>
</tr>
<tr>
<td>Teil 8</td>
<td>Teil 9</td>
<td>Teil 10</td>
<td>Teil 11</td>
<td>Teil 12</td>
<td>Teil 13</td>
<td>Teil 14</td>
</tr>
</tbody>
</table>
</div>
</div>
<div id="bereich-b">
<div class="top">
<div>Formular 1</div>
</div>
<div class="bottom">
<div>Teil 1</div>
</div>
</div>
</div>
</body>
</html>
{{ end }}