add table and message capabilities
for only 130 bytes extra! note: that number might not be 100% accurate
This commit is contained in:
parent
956f3ce41d
commit
f951bba63c
2 changed files with 87 additions and 0 deletions
46
beta.html
46
beta.html
|
@ -50,6 +50,52 @@
|
|||
|
||||
<hr class="mediumwidth">
|
||||
|
||||
<div class="mediumwidth">
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>#</th>
|
||||
<th>Widgets Sold</th>
|
||||
<th>Revenue (£)</th>
|
||||
<th>Profit (£)</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>5</td>
|
||||
<td>10</td>
|
||||
<td>2</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>10</td>
|
||||
<td>20</td>
|
||||
<td>4</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td>500</td>
|
||||
<td>1000</td>
|
||||
<td>200</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<hr class="mediumwidth">
|
||||
|
||||
<div class="mediumwidth">
|
||||
<message class="warning"><strong>Watch out!</strong> You don't have H9RBS.js installed.</message>
|
||||
|
||||
<br>
|
||||
|
||||
<message class="great"><strong>Great!</strong> You successfully frobjugated the minlingator's snorbdralob.</message>
|
||||
|
||||
<br>
|
||||
|
||||
<message><strong>Hey!</strong> You've got four thousand new grabjalognibs!</message>
|
||||
</div>
|
||||
<br><br>
|
||||
</body>
|
||||
</html>
|
||||
|
|
41
min.less
41
min.less
|
@ -184,3 +184,44 @@ textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[ty
|
|||
height: 7.5em;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
Tables
|
||||
*/
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
.table th, .table td {
|
||||
padding: 0.5em;
|
||||
line-height: 1.4em;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.table td {
|
||||
border-top: 1px solid #dddddd;
|
||||
}
|
||||
|
||||
tbody tr:nth-child(2n-1) {
|
||||
background: #E0E0E0;
|
||||
}
|
||||
|
||||
/*
|
||||
Messages
|
||||
*/
|
||||
|
||||
message {
|
||||
width: 100%;
|
||||
display: block;
|
||||
padding: 2em 0;
|
||||
background: #A7D3E4;
|
||||
&.warning {
|
||||
background: rgb(228, 167, 167);
|
||||
}
|
||||
&.great {
|
||||
background: #A7E4AE;
|
||||
}
|
||||
}
|
Loading…
Add table
Reference in a new issue