factor

src/components/Invoice.css

@@ -0,0 +1,146 @@
+.invoice-container {
+  padding: 0;
+  margin: 0 auto;
+  max-width: 29.7cm;
+  -webkit-print-color-adjust: exact;
+  direction: rtl;
+  font: 9pt irancell;
+}
+
+.page {
+  background: white;
+  page-break-after: always;
+  padding: 0.5cm;
+}
+
+.flex {
+  display: flex;
+}
+
+.flex > * {
+  float: left;
+}
+
+.flex-grow {
+  flex-grow: 10000000;
+}
+
+.barcode {
+  text-align: center;
+  margin: 12px 0 0 0;
+  height: 30px;
+}
+
+.barcode span {
+  font-size: 35pt;
+  font-family: "Libre Barcode 128";
+}
+
+.portait {
+  transform: rotate(-90deg) translate(0, 40%);
+  text-align: center;
+}
+
+.header-item-wrapper {
+  border: 1px solid #000;
+  width: 100%;
+  height: 100%;
+  background: #eee;
+  display: flex;
+  align-content: center;
+}
+
+thead,
+tfoot {
+  background: #eee;
+}
+
+.header-item-data {
+  height: 100%;
+  width: 100%;
+}
+
+.bordered {
+  border: 1px solid #000;
+  padding: 0.12cm;
+}
+
+.header-table {
+  width: 100%;
+  table-layout: fixed;
+  border-spacing: 0;
+}
+
+.header-table td {
+  padding: 0;
+  vertical-align: top;
+}
+
+.content-table {
+  border-collapse: collapse;
+  width: 100%;
+  table-layout: fixed;
+  border-spacing: 0;
+}
+
+.content-table td,
+.content-table th {
+  border: 1px solid #000;
+  text-align: center;
+  padding: 0.1cm;
+  font-weight: normal;
+}
+
+.centered td {
+  vertical-align: middle;
+}
+
+.serials {
+  direction: ltr;
+  text-align: left;
+}
+
+.title {
+  text-align: right;
+}
+
+.grow {
+  width: 100%;
+  height: 100%;
+}
+
+.font-small {
+  font-size: 8pt;
+}
+
+.font-medium {
+  font-size: 10pt;
+}
+
+.font-big {
+  font-size: 15pt;
+}
+
+.label {
+  font-weight: bold;
+  padding: 0 0 0 2px;
+}
+
+.ltr {
+  direction: ltr;
+  display: block;
+}
+
+@media print {
+  .print-button {
+    display: none;
+    visibility: hidden;
+  }
+}
+
+@page {
+  size: A4 landscape;
+  margin: 0;
+  margin-bottom: 0.5cm;
+  margin-top: 0.5cm;
+}