lars/Billy-Styling
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

initial commit

Browse Source
This commit is contained in:
sefaria
2026-06-07 21:55:42 +02:00
commit d22998a9b2
2 changed files with 222 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
custom.css
+64
View File
@@ -0,0 +1,64 @@
/* Change global color variables */
:root {
/* --primary: #121212; /* default text */
/*--primary-dark: blue; /* address, date, no. */
/*--primary-light: orange; /* second alternating row */
/*--primary-extralight: green; /* first alternating row */
--accent: #FF4500; /* total header */
--accent-dark: #121212; /* total value */
--accent-light: #FFC999; /* total background value */
--accent-extralight: #FFE7CC; /* total background header */
}
/* Recolor headline, remove bold style, add more letter-spacing */
h1 {
color: #ff4500;
font-weight: 400;
letter-spacing: 0.025em;
}
/* Remove bold style, add more letter-spacing */
.footer section small b {
font-weight: normal; /* or font-weight: 400; */
letter-spacing: 0.025em;
}
/* Add more letter-spacing */
.footer section small i {
letter-spacing: 0.025em;
}
/* Remove bold style, add more letter-spacing */
.footer section small span {
font-weight: normal !important; /* or font-weight: 400; */
letter-spacing: 0.025em;
}
/* Remove bold style, add more letter-spacing */
.address-row span {
font-weight: normal !important; /* or font-weight: 400; */
letter-spacing: 0.025em;
}
/* Disable circled numbers, activate square punctuation and legible forms for MD UI */
.address, .info-table td, .main-table td, .total-table td {
font-feature-settings: "ss01" 1, "ss02" 1, "ss03" 0, "ss04" 0;
}
/* Disable circled numbers for MD IO */
.info-table th, .main-table th, .total-table th {
font-feature-settings: "ss01" 1, "ss02" 0, "ss03" 0, "ss04" 0;
}
/* Change table header to primary color */
.info-table tr:last-of-type th, .total-table tr:last-of-type th {
color: #121212;
}
/* Change look of folding-marks */
.folding-mark {
width: 6px;
height: 6px;
border-radius: 16px;
background-color: #ff8c00;
}
invoice-example.html
+158
View File
@@ -0,0 +1,158 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Invoice 2026-042</title>
</head>
<body>
<section class="header">
<h1>Invoice</h1>
<small class="address-row"><span>Lena Hoffmann Design</span> · <span>Torstraße 42</span> · <span>10119 Berlin</span></small>
<div class="address">
Studio Braun & Partner GmbH<br>
Friedrichstraße 128<br>
10117 Berlin
</div>
</section>
<table class="info-table">
<tr>
<th>Date</th>
<td>5 May 2025</td>
</tr>
<tr>
<th>Service Period</th>
<td>1 April<br>to 30 April 2025</td>
</tr>
<tr>
<th>Invoice Number</th>
<td>2026-042</td>
</tr>
</table>
<table class="main-table">
<thead>
<tr>
<th>Description</th>
<th>Hours</th>
<th>Price in €</th>
<th>Total in €</th>
</tr>
</thead>
<tbody>
<tr>
<td>Corporate Identity – Logo &amp; Brand Design</td>
<td>40</td>
<td>60,00</td>
<td>2.400,00</td>
</tr>
<tr>
<td>Web Design – UI/UX Concept &amp; Wireframes</td>
<td>30</td>
<td>60,00</td>
<td>1.800,00</td>
</tr>
<tr>
<td>Print Templates – Business Cards &amp; Letterhead</td>
<td>10</td>
<td>60,00</td>
<td>600,00</td>
</tr>
<tr><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td></tr>
</tbody>
</table>
<table class="total-table">
<tr>
<th>Subtotal in €</th>
<td>4.800,00</td>
</tr>
<tr>
<th>19% VAT in €</th>
<td>912,00</td>
</tr>
<tr>
<th>Total in €</th>
<td>5.712,00</td>
</tr>
</table>
<aside class="logo-for-footer">
<section></section>
</aside>
<aside>
<section>
<small>
<span>Lena Hoffmann Design</span>
<span>Torstraße 42</span>
<span>10119 Berlin</span>
</small>
<small>
lena@hoffmann-design.de<br>
+49 30 98765432<br>
www.hoffmann-design.de
</small>
</section>
<section>
<small>
<b>Tax</b>
<span>Tax no.: 14/234/56789</span>
<span>VAT no.: DE287654321</span>
</small>
<small>
<b>Bank Details</b>
<span>DE89 3704 0044 0532 0130 00</span>
<span>COBADEFFXXX</span>
</small>
<small class="additional">
<i>The invoice must be paid within 14 days.</i>
</small>
</section>
</aside>
<aside class="footer">
<section>
<small>
<span>Lena Hoffmann Design</span>
<span>Torstraße 42</span>
<span>10119 Berlin</span>
</small>
<small>
lena@hoffmann-design.de<br>
+49 30 98765432<br>
www.hoffmann-design.de
</small>
</section>
<section>
<small>
<b>Tax</b>
<span>Tax no.: 14/234/56789</span>
<span>VAT no.: DE287654321</span>
</small>
<small>
<b>Bank Details</b>
<span>DE89 3704 0044 0532 0130 00</span>
<span>COBADEFFXXX</span>
</small>
</section>
<section>
<small>
<i>The invoice must be paid within 14 days.</i>
</small>
</section>
</aside>
<mark class="folding-mark"></mark>
<mark class="folding-mark"></mark>
</body>
</html>