re-structure to monorepo.

packages/webapp/src/style/pages/SaleInvoice/List.scss

@@ -0,0 +1,59 @@
+.dashboard__insider--sales-invoices-list {
+  .bigcapital-datatable {
+    .tbody {
+      .balance.td {
+        .cell-inner {
+          > span {
+            font-weight: 600;
+          }
+        }
+      }
+      .status.td {
+        .overdue-status,
+        .due-status {
+          display: block;
+          font-size: 13.5px;
+          line-height: 1.4;
+
+          + .partial-paid {
+            margin-top: 2px;
+          }
+        }
+        .overdue-status {
+          color: #ec5b0a;
+        }
+        .due-status {
+          color: #1652c8;
+        }
+        .partial-paid {
+          font-size: 12px;
+          line-height: 1;
+          display: block;
+          margin-bottom: 6px;
+          opacity: 0.7;
+        }
+        .fully-paid-icon {
+          width: 18px;
+          height: 18px;
+          margin-right: 8px;
+
+          svg {
+            fill: #2ba01d;
+          }
+        }
+        .fully-paid-text {
+          font-size: 13.5px;
+        }
+        .bp3-progress-bar {
+          height: 3px;
+          max-width: 180px;
+
+          &,
+          .bp3-progress-meter {
+            border-radius: 0;
+          }
+        }
+      }
+    }
+  }
+}

packages/webapp/src/style/pages/SaleInvoice/PageForm.scss

@@ -0,0 +1,106 @@
+body.page-invoice-new,
+body.page-invoice-edit {
+  .dashboard__footer {
+    display: none;
+  }
+}
+
+.dashboard__insider--invoice-form {
+  padding-bottom: 64px;
+}
+
+.page-form--invoice {
+  $self: '.page-form';
+
+  #{$self}__header {
+    display: flex;
+
+    &-fields {
+      flex: 1 0 0;
+    }
+
+    .bp3-label {
+      min-width: 150px;
+    }
+
+    .bp3-form-content {
+      width: 100%;
+    }
+
+    .bp3-form-group {
+      &.bp3-inline {
+        max-width: 450px;
+      }
+    }
+
+    .row {
+      display: flex;
+      flex-wrap: nowrap;
+
+      .col {
+        max-width: 470px;
+
+        &--due-date {
+          .bp3-form-group {
+            margin: 0px 15px 15px;
+
+            .bp3-label {
+              min-width: 100px;
+            }
+          }
+        }
+      }
+    }
+
+    .col--invoice-date {
+      max-width: 435px;
+    }
+  }
+
+  #{$self}__footer {
+
+    .form-group--invoice_message,
+    .form-group--terms_conditions {
+      max-width: 450px;
+      width: 100%;
+
+      textarea {
+        width: 100%;
+        min-height: 60px;
+      }
+    }
+  }
+}
+
+.status-accessor {
+  span {
+    font-size: 13px;
+    font-weight: 400;
+    line-height: 1.5;
+  }
+
+  .fully-paid-status {
+    height: 19px;
+    width: 19px;
+    display: inline-block;
+    background: #2ba01d;
+    border-radius: 50%;
+    margin-right: 6px;
+    color: #ffffff;
+  }
+
+  .bp3-progress-bar {
+    background: rgba(92, 112, 128, 0.2);
+    border-radius: 40px;
+    display: block;
+    height: 5px;
+    overflow: hidden;
+    position: relative;
+    margin-top: 5px;
+    width: 80%;
+  }
+
+  &.overdue-status {}
+
+  &.remaining-status {}
+}