formatting and styles

This commit is contained in:
starlord 2024-06-28 08:52:11 -07:00
parent 811cda558e
commit 95ec066e85

View file

@ -3,17 +3,46 @@
<head> <head>
<title>Crypto Portfolio</title> <title>Crypto Portfolio</title>
<style> <style>
table { table.crypto {
border-style: solid; font-family: "Lucida Console", Monaco, monospace;
border-width: 3px; border: 2px solid #4F7849;
} background-color: #EEEEEE;
width: 100%;
td, th {
border-style: solid;
border-width: 2px;
}
td {
text-align: right; text-align: right;
border-collapse: collapse;
}
table.crypto td, table.crypto th {
border: 1px solid #4F7849;
padding: 2px 2px;
}
table.crypto tbody td {
font-size: 16px;
font-weight: bold;
color: #4F7849;
}
table.crypto tr:nth-child(even) {
background: #CEE0CC;
}
table.crypto thead {
background: #4F7849;
}
table.crypto thead th {
font-size: 18px;
color: #FFFFFF;
text-align: center;
}
table.crypto tfoot {
font-size: 20px;
font-weight: bold;
color: #FFFFFF;
background: #4F7849;
background: -moz-linear-gradient(top, #7b9a76 0%, #60855b 66%, #4F7849 100%);
background: -webkit-linear-gradient(top, #7b9a76 0%, #60855b 66%, #4F7849 100%);
background: linear-gradient(to bottom, #7b9a76 0%, #60855b 66%, #4F7849 100%);
border-top: 4px solid #444444;
}
table.crypto tfoot td {
font-size: 20px;
} }
td.left { td.left {
text-align: left; text-align: left;
@ -21,14 +50,32 @@
</style> </style>
</head> </head>
<body> <body>
<table> <table class="crypto">
<thead>
<tr> <tr>
<th>Token</th><th>Balance</th><th>Price</th><th>Investment</th><th>Value</th><th>Margin</th><th>Movement</th> <th>Token</th>
<th>Balance</th>
<th>Price</th>
<th>Investment</th>
<th>Value</th>
<th>Margin</th>
<th>Movement</th>
</tr> </tr>
</thead>
<tbody>
%row% %row%
</tbody>
<tfoot>
<tr> <tr>
<td class="left"><b>Total</b></td><td></td><td></td><td><b>%inv%</b></td><td><b>%val%</b></td><td><b>%mar%</b></td><td><b>%mov%</b></td> <td class="left">Total</td>
<td></td>
<td></td>
<td>%inv%</td>
<td>%val%</td>
<td>%mar%</td>
<td>%mov%</td>
</tr> </tr>
</tfoot>
</table> </table>
<p><i>%dts%</i></p> <p><i>%dts%</i></p>
<button onclick="download_csv_file()"> Download CSV </button> <button onclick="download_csv_file()"> Download CSV </button>