Aktualizace vzhledu pro lepší zobrazení patičky

This commit is contained in:
archos 2024-06-14 10:32:18 +02:00
parent 5c9d74c65c
commit e5d0a50225
2 changed files with 33 additions and 17 deletions

View File

@ -9,17 +9,18 @@
<link href="styly.css" rel="stylesheet"> <link href="styly.css" rel="stylesheet">
</head> </head>
<body> <body>
<div class="container"> <div class="d-flex flex-column min-vh-100">
<header class="text-center"> <header class="text-center mb-3">
<h1>Přehled Financí Komunity</h1> <h1>Přehled Financí Komunity</h1>
<p>Tento projekt poskytuje transparentní přehled transakcí na našem <a href="https://transparentniucty.moneta.cz/264043266" target="_blank">transparentním účtu</a>.</p> <p>Tento projekt poskytuje transparentní přehled transakcí na našem <a href="https://transparentniucty.moneta.cz/264043266" target="_blank">transparentním účtu</a>.</p>
</header> </header>
<div class="account-balance text-center"> <div class="account-balance text-center mb-3">
Aktuální stav účtu: <span id="account-balance">Načítání...</span> Aktuální stav účtu: <span id="account-balance">Načítání...</span>
</div> </div>
<table id="finance-table" class="table table-striped"> <div class="container flex-grow-1">
<table id="finance-table" class="table table-striped mb-3">
<thead class="thead-dark"> <thead class="thead-dark">
<tr> <tr>
<th>Datum</th> <th>Datum</th>
@ -32,8 +33,9 @@
<tbody> <tbody>
</tbody> </tbody>
</table> </table>
</div>
<footer class="text-center"> <footer class="text-center mt-auto py-3">
<p>&copy; 2024 <a href="https://git.arch-linux.cz/Archos/prehlad-financi-komunity" target="_blank">Archos</a></p> <p>&copy; 2024 <a href="https://git.arch-linux.cz/Archos/prehlad-financi-komunity" target="_blank">Archos</a></p>
</footer> </footer>
</div> </div>

View File

@ -1,5 +1,9 @@
body { body {
padding: 20px; padding: 20px;
display: flex;
flex-direction: column;
min-height: 100vh;
margin: 0;
} }
h1 { h1 {
margin-bottom: 20px; margin-bottom: 20px;
@ -14,3 +18,13 @@ th, td {
font-size: 1.5em; font-size: 1.5em;
margin-bottom: 20px; margin-bottom: 20px;
} }
footer {
margin-top: 20px;
background-color: #f8f9fa;
padding: 20px;
border-top: 1px solid #e7e7e7;
flex-shrink: 0;
}
.container {
flex: 1 0 auto;
}