diff --git a/client/src/components/index.js b/client/src/components/index.js
index fa4a5a9b7..a11744c50 100644
--- a/client/src/components/index.js
+++ b/client/src/components/index.js
@@ -18,6 +18,7 @@ import CurrenciesSelectList from './CurrenciesSelectList';
import FieldRequiredHint from './FieldRequiredHint';
import AppToaster from './AppToaster';
import DataTable from './DataTable';
+import DataTableEditable from './Datatable/DatatableEditable';
import AccountsSelectList from './AccountsSelectList';
import AccountsTypesSelect from './AccountsTypesSelect';
import LoadingIndicator from './LoadingIndicator';
@@ -90,4 +91,5 @@ export {
InputPrependText,
PageFormBigNumber,
AccountsMultiSelect,
+ DataTableEditable
};
diff --git a/client/src/config/sidebarMenu.js b/client/src/config/sidebarMenu.js
index d53d52394..3e5c7cf18 100644
--- a/client/src/config/sidebarMenu.js
+++ b/client/src/config/sidebarMenu.js
@@ -2,9 +2,6 @@
import { FormattedMessage as T } from 'react-intl';
export default [
- {
- spacer: 1,
- },
{
text:
,
disabled: false,
@@ -97,7 +94,7 @@ export default [
divider: true,
},
{
- text:
,
+ text:
,
label: true,
},
{
diff --git a/client/src/containers/Accounting/MakeJournalEntriesPage.js b/client/src/containers/Accounting/MakeJournalEntriesPage.js
index 0e823f2da..d129d3423 100644
--- a/client/src/containers/Accounting/MakeJournalEntriesPage.js
+++ b/client/src/containers/Accounting/MakeJournalEntriesPage.js
@@ -14,6 +14,8 @@ import withDashboardActions from 'containers/Dashboard/withDashboardActions';
import { compose } from 'utils';
+import 'style/pages/ManualJournal/MakeJournal.scss'
+
function MakeJournalEntriesPage({
// #withCustomersActions
requestFetchCustomers,
diff --git a/client/src/containers/Accounting/MakeJournalEntriesTable.js b/client/src/containers/Accounting/MakeJournalEntriesTable.js
index d57286dc8..f522a8f2a 100644
--- a/client/src/containers/Accounting/MakeJournalEntriesTable.js
+++ b/client/src/containers/Accounting/MakeJournalEntriesTable.js
@@ -1,17 +1,12 @@
import React, { useState, useMemo, useEffect, useCallback } from 'react';
-import { Button, Tooltip, Position, Intent } from '@blueprintjs/core';
+import { Button } from '@blueprintjs/core';
import { FormattedMessage as T, useIntl } from 'react-intl';
import { omit } from 'lodash';
import classNames from 'classnames';
import { CLASSES } from 'common/classes';
import DataTable from 'components/DataTable';
-import {
- compose,
- formattedAmount,
- transformUpdatedRows,
- saveInvoke,
-} from 'utils';
+import { compose, transformUpdatedRows, saveInvoke } from 'utils';
import {
AccountsListFieldCell,
MoneyFieldCell,
@@ -25,6 +20,7 @@ import {
TotalCreditDebitCellRenderer,
NoteCellRenderer,
} from './components';
+import { DataTableEditable } from 'components';
import withAccounts from 'containers/Accounts/withAccounts';
import withCustomers from 'containers/Customers/withCustomers';
@@ -130,45 +126,34 @@ function MakeJournalEntriesTable({
};
// Handles update datatable data.
- const handleUpdateData = useCallback(
- (rowIndex, columnIdOrObj, value) => {
- const newRows = transformUpdatedRows(
- rows,
- rowIndex,
- columnIdOrObj,
- value,
- );
- saveInvoke(
- onChange,
- newRows
- .filter((row) => row.rowType === 'editor')
- .map((row) => ({
- ...omit(row, ['rowType']),
- })),
- );
- },
- [rows, onChange],
- );
+ const handleUpdateData = (rowIndex, columnIdOrObj, value) => {
+ const newRows = transformUpdatedRows(rows, rowIndex, columnIdOrObj, value);
+ saveInvoke(
+ onChange,
+ newRows
+ .filter((row) => row.rowType === 'editor')
+ .map((row) => ({
+ ...omit(row, ['rowType']),
+ })),
+ );
+ };
+ // Handle remove datatable row.
+ const handleRemoveRow = (rowIndex) => {
+ // Can't continue if there is just one row line or less.
+ if (rows.length <= 2) {
+ return;
+ }
+ const removeIndex = parseInt(rowIndex, 10);
+ const newRows = rows.filter((row, index) => index !== removeIndex);
- const handleRemoveRow = useCallback(
- (rowIndex) => {
- // Can't continue if there is just one row line or less.
- if (rows.length <= 2) {
- return;
- }
- const removeIndex = parseInt(rowIndex, 10);
- const newRows = rows.filter((row, index) => index !== removeIndex);
-
- saveInvoke(
- onChange,
- newRows
- .filter((row) => row.rowType === 'editor')
- .map((row) => ({ ...omit(row, ['rowType']) })),
- );
- saveInvoke(onClickRemoveRow, removeIndex);
- },
- [rows, onChange, onClickRemoveRow],
- );
+ saveInvoke(
+ onChange,
+ newRows
+ .filter((row) => row.rowType === 'editor')
+ .map((row) => ({ ...omit(row, ['rowType']) })),
+ );
+ saveInvoke(onClickRemoveRow, removeIndex);
+ };
// Rows class names callback.
const rowClassNames = useCallback(
@@ -183,48 +168,44 @@ function MakeJournalEntriesTable({
};
return (
-
-
({
- ...customer,
- contact_type: 'customer',
- })),
- ],
- }}
- />
-
-
+ ({
+ ...customer,
+ contact_type: 'customer',
+ })),
+ ],
+ }}
+ actions={
+ <>
+
-
-
-
+
+
+ }
+ />
);
}
diff --git a/client/src/containers/Accounting/ManualJournalsList.js b/client/src/containers/Accounting/ManualJournalsList.js
index 39df9dca7..de9fabee9 100644
--- a/client/src/containers/Accounting/ManualJournalsList.js
+++ b/client/src/containers/Accounting/ManualJournalsList.js
@@ -6,7 +6,6 @@ import AppToaster from 'components/AppToaster';
import {
FormattedMessage as T,
useIntl,
- FormattedHTMLMessage,
} from 'react-intl';
import DashboardPageContent from 'components/Dashboard/DashboardPageContent';
@@ -25,6 +24,8 @@ import withResourceActions from 'containers/Resources/withResourcesActions';
import { compose } from 'utils';
+import 'style/pages/ManualJournal/List.scss';
+
/**
* Manual journals table.
*/
diff --git a/client/src/containers/Accounts/AccountsChart.js b/client/src/containers/Accounts/AccountsChart.js
index 8f5b85894..9f0808de4 100644
--- a/client/src/containers/Accounts/AccountsChart.js
+++ b/client/src/containers/Accounts/AccountsChart.js
@@ -25,6 +25,11 @@ import withAccounts from 'containers/Accounts/withAccounts';
import { compose } from 'utils';
+import 'style/pages/Accounts/List.scss';
+
+/**
+ * Accounts chart list.
+ */
function AccountsChart({
// #withDashboardActions
changePageTitle,
diff --git a/client/src/containers/Accounts/AccountsDataTable.js b/client/src/containers/Accounts/AccountsDataTable.js
index bb6e3bbbb..27ee94cc0 100644
--- a/client/src/containers/Accounts/AccountsDataTable.js
+++ b/client/src/containers/Accounts/AccountsDataTable.js
@@ -27,6 +27,7 @@ import withAccounts from 'containers/Accounts/withAccounts';
import withDialogActions from 'containers/Dialog/withDialogActions';
import withCurrentView from 'containers/Views/withCurrentView';
+import { accountNameAccessor } from './utils';
function AccountsDataTable({
// #withDashboardActions
@@ -135,7 +136,7 @@ function AccountsDataTable({
{
id: 'name',
Header: formatMessage({ id: 'account_name' }),
- accessor: 'name',
+ accessor: accountNameAccessor,
className: 'account_name',
width: 220,
},
diff --git a/client/src/containers/Accounts/utils.js b/client/src/containers/Accounts/utils.js
new file mode 100644
index 000000000..8411ee3ba
--- /dev/null
+++ b/client/src/containers/Accounts/utils.js
@@ -0,0 +1,13 @@
+import React from 'react';
+import { If } from 'components';
+
+export const accountNameAccessor = (account) => {
+ return (
+
+
+ { account.name }
+
+ { account.description }
+
+ );
+}
\ No newline at end of file
diff --git a/client/src/containers/Customers/Customer.js b/client/src/containers/Customers/Customer.js
index 7259ff98c..17f4b5bba 100644
--- a/client/src/containers/Customers/Customer.js
+++ b/client/src/containers/Customers/Customer.js
@@ -11,6 +11,8 @@ import withCurrenciesActions from 'containers/Currencies/withCurrenciesActions';
import { compose } from 'utils';
+import 'style/pages/Customers/PageForm.scss';
+
function Customer({
// // #withDashboardActions
// changePageTitle,
diff --git a/client/src/containers/Customers/CustomersList.js b/client/src/containers/Customers/CustomersList.js
index 34da5edde..8ce331458 100644
--- a/client/src/containers/Customers/CustomersList.js
+++ b/client/src/containers/Customers/CustomersList.js
@@ -24,6 +24,11 @@ import withDashboardActions from 'containers/Dashboard/withDashboardActions';
import { compose } from 'utils';
+import 'style/pages/Customers/List.scss';
+
+/**
+ * Customers list.
+ */
function CustomersList({
// #withDashboardActions
changePageTitle,
diff --git a/client/src/containers/Dialogs/AccountFormDialog/AccountFormDialogContent.js b/client/src/containers/Dialogs/AccountFormDialog/AccountFormDialogContent.js
index 8e66e88fc..ce5b41ab7 100644
--- a/client/src/containers/Dialogs/AccountFormDialog/AccountFormDialogContent.js
+++ b/client/src/containers/Dialogs/AccountFormDialog/AccountFormDialogContent.js
@@ -19,6 +19,8 @@ import {
import { compose, transformToForm } from 'utils';
import { transformApiErrors, transformAccountToForm } from './utils';
+import 'style/pages/Accounts/AccountFormDialog.scss';
+
const defaultInitialValues = {
account_type_id: '',
parent_account_id: '',
diff --git a/client/src/containers/Dialogs/CurrencyFormDialog/CurencyFormDialogContent.js b/client/src/containers/Dialogs/CurrencyFormDialog/CurencyFormDialogContent.js
index 9ac0bf890..0de05e569 100644
--- a/client/src/containers/Dialogs/CurrencyFormDialog/CurencyFormDialogContent.js
+++ b/client/src/containers/Dialogs/CurrencyFormDialog/CurencyFormDialogContent.js
@@ -11,9 +11,7 @@ import { useFormik } from 'formik';
import { useQuery, queryCache } from 'react-query';
import { FormattedMessage as T, useIntl } from 'react-intl';
import { pick } from 'lodash';
-import classNames from 'classnames';
import {
- If,
ErrorMessage,
AppToaster,
FieldRequiredHint,
@@ -26,6 +24,8 @@ import withCurrenciesActions from 'containers/Currencies/withCurrenciesActions';
import { compose } from 'utils';
+import 'style/pages/Currency/CurrencyFormDialog.scss'
+
function CurencyFormDialogContent({
// #withCurrencyDetail
currency,
diff --git a/client/src/containers/Dialogs/ExchangeRateFormDialog/ExchangeRateFormDialogContent.js b/client/src/containers/Dialogs/ExchangeRateFormDialog/ExchangeRateFormDialogContent.js
index 26aac7e70..d853ee681 100644
--- a/client/src/containers/Dialogs/ExchangeRateFormDialog/ExchangeRateFormDialogContent.js
+++ b/client/src/containers/Dialogs/ExchangeRateFormDialog/ExchangeRateFormDialogContent.js
@@ -6,7 +6,6 @@ import {
InputGroup,
Intent,
Position,
- MenuItem,
} from '@blueprintjs/core';
import { pick } from 'lodash';
import * as Yup from 'yup';
@@ -18,9 +17,7 @@ import { FormattedMessage as T, useIntl } from 'react-intl';
import { momentFormatter, tansformDateValue } from 'utils';
import {
AppToaster,
- Dialog,
ErrorMessage,
- ListSelect,
DialogContent,
FieldRequiredHint,
CurrencySelectList,
@@ -35,6 +32,11 @@ import withDialogActions from 'containers/Dialog/withDialogActions';
import { compose } from 'utils';
+import 'style/pages/ExchangeRate/ExchangeRateDialog.scss';
+
+/**
+ * Exchange rate form content.
+ */
function ExchangeRateFormDialogContent({
// #withDialogActions
closeDialog,
diff --git a/client/src/containers/Dialogs/InviteUserDialog/InviteUserDialogContent.js b/client/src/containers/Dialogs/InviteUserDialog/InviteUserDialogContent.js
index 20a6c95e4..baf2dfd4b 100644
--- a/client/src/containers/Dialogs/InviteUserDialog/InviteUserDialogContent.js
+++ b/client/src/containers/Dialogs/InviteUserDialog/InviteUserDialogContent.js
@@ -15,7 +15,11 @@ import UserFormDialogForm from './InviteUserDialogForm';
import { transformApiErrors } from './utils';
-//
+import 'style/pages/Users/InviteFormDialog.scss'
+
+/**
+ * Invite user dialog content.
+ */
function InviteUserDialogContent({
// #wihtCurrenciesActions
requestFetchUser,
diff --git a/client/src/containers/Dialogs/ItemCategoryDialog/ItemCategoryFormDialogContent.js b/client/src/containers/Dialogs/ItemCategoryDialog/ItemCategoryFormDialogContent.js
index 0fd4f7e03..35017fc7d 100644
--- a/client/src/containers/Dialogs/ItemCategoryDialog/ItemCategoryFormDialogContent.js
+++ b/client/src/containers/Dialogs/ItemCategoryDialog/ItemCategoryFormDialogContent.js
@@ -20,6 +20,8 @@ import {
} from './itemCategoryForm.schema';
import { compose, transformToForm } from 'utils';
+import 'style/pages/ItemCategory/ItemCategoryDialog.scss'
+
const defaultInitialValues = {
name: '',
description: '',
diff --git a/client/src/containers/Dialogs/JournalNumberDialog/JournalNumberDialogContent.js b/client/src/containers/Dialogs/JournalNumberDialog/JournalNumberDialogContent.js
index a953895d3..7aaaa37ba 100644
--- a/client/src/containers/Dialogs/JournalNumberDialog/JournalNumberDialogContent.js
+++ b/client/src/containers/Dialogs/JournalNumberDialog/JournalNumberDialogContent.js
@@ -1,4 +1,4 @@
-import React, { useState, useCallback, useEffect } from 'react';
+import React, { useCallback } from 'react';
import { DialogContent } from 'components';
import { useQuery, queryCache } from 'react-query';
@@ -11,6 +11,8 @@ import withManualJournalsActions from 'containers/Accounting/withManualJournalsA
import { compose, optionsMapToArray } from 'utils';
+import 'style/pages/ManualJournal/JournalNumberDialog.scss'
+
/**
* Journal number dialog's content.
*/
diff --git a/client/src/containers/Dialogs/JournalNumberDialog/index.js b/client/src/containers/Dialogs/JournalNumberDialog/index.js
index cf83bf035..2ab3db165 100644
--- a/client/src/containers/Dialogs/JournalNumberDialog/index.js
+++ b/client/src/containers/Dialogs/JournalNumberDialog/index.js
@@ -29,7 +29,6 @@ function JournalNumberDialog({
);
}
-
export default compose(
withDialogRedux(),
)(JournalNumberDialog);
diff --git a/client/src/containers/Entries/EditableItemsEntriesTable.js b/client/src/containers/Entries/EditableItemsEntriesTable.js
index ebf109bf1..46da0edaf 100644
--- a/client/src/containers/Entries/EditableItemsEntriesTable.js
+++ b/client/src/containers/Entries/EditableItemsEntriesTable.js
@@ -5,6 +5,8 @@ import { FormattedMessage as T } from 'react-intl';
import ItemsEntriesTable from './ItemsEntriesTable';
import { orderingLinesIndexes, repeatValue } from 'utils';
+import 'style/components/DataTable/DataTableEditable.scss';
+
export default function EditableItemsEntriesTable({
defaultEntry,
minLinesNumber = 2,
diff --git a/client/src/containers/Entries/ItemsEntriesTable.js b/client/src/containers/Entries/ItemsEntriesTable.js
index 6bf128c04..385e19b5c 100644
--- a/client/src/containers/Entries/ItemsEntriesTable.js
+++ b/client/src/containers/Entries/ItemsEntriesTable.js
@@ -3,8 +3,7 @@ import { Button, Intent, Position, Tooltip } from '@blueprintjs/core';
import { FormattedMessage as T, useIntl } from 'react-intl';
import classNames from 'classnames';
import { CLASSES } from 'common/classes';
-import { Hint, Icon } from 'components';
-import DataTable from 'components/DataTable';
+import { Hint, Icon, DataTableEditable } from 'components';
import {
InputGroupCell,
MoneyFieldCell,
@@ -17,7 +16,6 @@ import withItems from 'containers/Items/withItems';
import {
compose,
formattedAmount,
- orderingLinesIndexes,
saveInvoke,
} from 'utils';
@@ -202,7 +200,7 @@ function ItemsEntriesTable({
if (rows.length <= 1) {
return;
}
- const removeIndex = parseInt(rowIndex, 10);
+ const removeIndex = parseInt(rowIndex, 10);
saveInvoke(onClickRemoveRow, removeIndex);
},
[rows, onClickRemoveRow],
@@ -224,43 +222,38 @@ function ItemsEntriesTable({
);
return (
-
-
-
-
+
+
-
-
-
+
+
+ }
+ />
);
}
diff --git a/client/src/containers/Expenses/ExpenseFormEntries.js b/client/src/containers/Expenses/ExpenseFormEntries.js
index 54e1c3874..f6bc35fc2 100644
--- a/client/src/containers/Expenses/ExpenseFormEntries.js
+++ b/client/src/containers/Expenses/ExpenseFormEntries.js
@@ -2,12 +2,8 @@ import React, { useState, useMemo, useEffect, useCallback } from 'react';
import { Button, Intent, Position, Tooltip } from '@blueprintjs/core';
import { FormattedMessage as T, useIntl } from 'react-intl';
import { omit } from 'lodash';
-import classNames from 'classnames';
-import { CLASSES } from 'common/classes';
-
-import DataTable from 'components/DataTable';
-import Icon from 'components/Icon';
+import { DataTableEditable, Icon } from 'components';
import { Hint } from 'components';
import {
compose,
@@ -228,42 +224,38 @@ function ExpenseTable({
);
return (
-
-
-
-
+
+
-
-
-
+
+
+ }
+ totalRow={true}
+ />
);
}
diff --git a/client/src/containers/Expenses/Expenses.js b/client/src/containers/Expenses/Expenses.js
index a08f94c78..cd78f8611 100644
--- a/client/src/containers/Expenses/Expenses.js
+++ b/client/src/containers/Expenses/Expenses.js
@@ -13,6 +13,11 @@ import withDashboardActions from 'containers/Dashboard/withDashboardActions';
import { compose } from 'utils';
+import 'style/pages/Expense/PageForm.scss';
+
+/**
+ * Expense page form.
+ */
function Expenses({
// #withwithAccountsActions
requestFetchAccounts,
diff --git a/client/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummary.js b/client/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummary.js
index 3e1090854..6b26c8e29 100644
--- a/client/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummary.js
+++ b/client/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummary.js
@@ -19,6 +19,8 @@ import withARAgingSummary from './withARAgingSummary';
import { compose } from 'utils';
import { transfromFilterFormToQuery } from './common';
+import 'style/pages/FinancialStatements/ARAgingSummary.scss';
+
/**
* AR aging summary report.
*/
diff --git a/client/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummaryTable.js b/client/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummaryTable.js
index 9e2db87b7..d3d74a593 100644
--- a/client/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummaryTable.js
+++ b/client/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummaryTable.js
@@ -5,7 +5,7 @@ import FinancialSheet from 'components/FinancialSheet';
import withARAgingSummary from './withARAgingSummary';
-import { compose } from 'utils';
+import { compose, getColumnWidth } from 'utils';
/**
* AR aging summary table sheet.
@@ -37,28 +37,34 @@ function ReceivableAgingSummaryTable({
accessor: 'name',
className: 'customer_name',
sticky: 'left',
- width: 200,
+ width: 240,
},
{
Header:
,
accessor: 'current',
className: 'current',
- width: 120,
+ width: getColumnWidth(receivableAgingRows, `current`, {
+ minWidth: 120,
+ }),
},
...agingColumns.map((agingColumn, index) => ({
Header: agingColumn,
accessor: `aging-${index }`,
- width: 120,
+ width: getColumnWidth(receivableAgingRows, `aging-${index }`, {
+ minWidth: 120,
+ }),
})),
{
Header: (
),
id: 'total',
accessor: 'total',
className: 'total',
- width: 140,
+ width: getColumnWidth(receivableAgingRows, 'total', {
+ minWidth: 120,
+ }),
},
],
- [agingColumns],
+ [receivableAgingRows, agingColumns],
);
const rowClassNames = (row) => [`row-type--${row.original.rowType}`];
diff --git a/client/src/containers/FinancialStatements/BalanceSheet/BalanceSheet.js b/client/src/containers/FinancialStatements/BalanceSheet/BalanceSheet.js
index 0e8eeffa3..0dc9db878 100644
--- a/client/src/containers/FinancialStatements/BalanceSheet/BalanceSheet.js
+++ b/client/src/containers/FinancialStatements/BalanceSheet/BalanceSheet.js
@@ -21,6 +21,8 @@ import withBalanceSheetDetail from './withBalanceSheetDetail';
import { transformFilterFormToQuery } from 'containers/FinancialStatements/common';
+import 'style/pages/FinancialStatements/BalanceSheet.scss';
+
function BalanceSheet({
// #withDashboardActions
changePageTitle,
diff --git a/client/src/containers/FinancialStatements/BalanceSheet/BalanceSheetHeader.js b/client/src/containers/FinancialStatements/BalanceSheet/BalanceSheetHeader.js
index 6a9c7be3f..9c6420a73 100644
--- a/client/src/containers/FinancialStatements/BalanceSheet/BalanceSheetHeader.js
+++ b/client/src/containers/FinancialStatements/BalanceSheet/BalanceSheetHeader.js
@@ -1,4 +1,4 @@
-import React, { useEffect } from 'react';
+import React from 'react';
import { Tabs, Tab, Button, Intent } from '@blueprintjs/core';
import { FormattedMessage as T, useIntl } from 'react-intl';
import moment from 'moment';
diff --git a/client/src/containers/FinancialStatements/FinancialReports.js b/client/src/containers/FinancialStatements/FinancialReports.js
index 546f99a85..11051c587 100644
--- a/client/src/containers/FinancialStatements/FinancialReports.js
+++ b/client/src/containers/FinancialStatements/FinancialReports.js
@@ -9,6 +9,8 @@ import withDashboardActions from 'containers/Dashboard/withDashboardActions';
import { compose } from 'utils';
+import 'style/pages/FinancialStatements/FinancialSheets.scss';
+
function FinancialReportsItem({ title, desc, link }) {
return (
diff --git a/client/src/containers/FinancialStatements/FinancialStatementHeader.js b/client/src/containers/FinancialStatements/FinancialStatementHeader.js
index f8979892e..a1c66bfc5 100644
--- a/client/src/containers/FinancialStatements/FinancialStatementHeader.js
+++ b/client/src/containers/FinancialStatements/FinancialStatementHeader.js
@@ -1,6 +1,7 @@
import React, { useEffect, useState } from 'react';
import classNames from 'classnames';
import { Position, Drawer } from '@blueprintjs/core';
+import 'style/containers/FinancialStatements/DrawerHeader.scss';
export default function FinancialStatementHeader({
children,
diff --git a/client/src/containers/FinancialStatements/GeneralLedger/GeneralLedger.js b/client/src/containers/FinancialStatements/GeneralLedger/GeneralLedger.js
index 213fc5f45..b36a53803 100644
--- a/client/src/containers/FinancialStatements/GeneralLedger/GeneralLedger.js
+++ b/client/src/containers/FinancialStatements/GeneralLedger/GeneralLedger.js
@@ -21,6 +21,8 @@ import { compose } from 'utils';
import { transformFilterFormToQuery } from 'containers/FinancialStatements/common';
import withGeneralLedger from './withGeneralLedger';
+import 'style/pages/FinancialStatements/GeneralLedger.scss';
+
/**
* General Ledger (GL) sheet.
*/
diff --git a/client/src/containers/FinancialStatements/Journal/Journal.js b/client/src/containers/FinancialStatements/Journal/Journal.js
index 10d76c345..ea694d6ab 100644
--- a/client/src/containers/FinancialStatements/Journal/Journal.js
+++ b/client/src/containers/FinancialStatements/Journal/Journal.js
@@ -19,6 +19,8 @@ import withJournal from './withJournal';
import { transformFilterFormToQuery } from 'containers/FinancialStatements/common';
+import 'style/pages/FinancialStatements/Journal.scss';
+
function Journal({
// #withJournalActions
requestFetchJournalSheet,
diff --git a/client/src/containers/FinancialStatements/Journal/JournalTable.js b/client/src/containers/FinancialStatements/Journal/JournalTable.js
index ae211e40b..93779678f 100644
--- a/client/src/containers/FinancialStatements/Journal/JournalTable.js
+++ b/client/src/containers/FinancialStatements/Journal/JournalTable.js
@@ -45,7 +45,7 @@ function JournalSheetTable({
Header: formatMessage({ id: 'transaction_type' }),
accessor: (r) =>
rowTypeFilter(r.rowType, r.transaction_type, ['first_entry']),
- className: 'transaction_type',
+ className: 'reference_type_formatted',
width: 145,
},
{
diff --git a/client/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossSheet.js b/client/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossSheet.js
index 8647c1fb5..a15fa1228 100644
--- a/client/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossSheet.js
+++ b/client/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossSheet.js
@@ -19,6 +19,11 @@ import withSettings from 'containers/Settings/withSettings';
import { transformFilterFormToQuery } from 'containers/FinancialStatements/common';
+import 'style/pages/FinancialStatements/ProfitLossSheet.scss';
+
+/**
+ * Profit/Loss financial statement sheet.
+ */
function ProfitLossSheet({
// #withDashboardActions
changePageTitle,
diff --git a/client/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheet.js b/client/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheet.js
index 226388531..3f5516553 100644
--- a/client/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheet.js
+++ b/client/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheet.js
@@ -18,6 +18,8 @@ import withTrialBalanceActions from './withTrialBalanceActions';
import withSettings from 'containers/Settings/withSettings';
import withTrialBalance from './withTrialBalance';
+import 'style/pages/FinancialStatements/TrialBalanceSheet.scss';
+
/**
* Trial balance sheet.
*/
diff --git a/client/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheetTable.js b/client/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheetTable.js
index dcd79e9b2..7455557df 100644
--- a/client/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheetTable.js
+++ b/client/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheetTable.js
@@ -7,11 +7,11 @@ import Money from 'components/Money';
import withTrialBalance from './withTrialBalance';
-import { compose } from 'utils';
+import { compose, getColumnWidth } from 'utils';
function TrialBalanceSheetTable({
// #withTrialBalanceDetail
- trialBalance,
+ trialBalanceTableRows,
trialBalanceSheetLoading,
// #withTrialBalanceTable
@@ -27,44 +27,57 @@ function TrialBalanceSheetTable({
Header: formatMessage({ id: 'account_name' }),
accessor: (row) => (row.code ? `${row.name} - ${row.code}` : row.name),
className: 'name',
- minWidth: 150,
- maxWidth: 150,
- width: 150,
+ width: 160,
},
{
Header: formatMessage({ id: 'credit' }),
accessor: 'credit',
Cell: ({ cell }) => {
const { currency_code, credit } = cell.row.original;
- return (
);
+ return
;
},
className: 'credit',
- width: 95,
+ width: getColumnWidth(trialBalanceTableRows, `credit`, {
+ minWidth: 95,
+ }),
},
{
Header: formatMessage({ id: 'debit' }),
accessor: 'debit',
Cell: ({ cell }) => {
const { currency_code, debit } = cell.row.original;
- return (
);
+ return
;
},
- className: 'debit',
- width: 95,
+ width: getColumnWidth(trialBalanceTableRows, `debit`, { minWidth: 95 }),
},
{
Header: formatMessage({ id: 'balance' }),
accessor: 'balance',
Cell: ({ cell }) => {
const { currency_code, balance } = cell.row.original;
- return (
);
+ return
;
},
className: 'balance',
- width: 95,
+ width: getColumnWidth(trialBalanceTableRows, `balance`, {
+ minWidth: 95,
+ }),
},
],
- [formatMessage],
+ [trialBalanceTableRows, formatMessage],
);
+ const rowClassNames = (row) => {
+ const { original } = row;
+ const rowTypes = Array.isArray(original.rowTypes) ? original.rowTypes : [];
+
+ return {
+ ...rowTypes.reduce((acc, rowType) => {
+ acc[`row_type--${rowType}`] = rowType;
+ return acc;
+ }, {}),
+ };
+ };
+
return (
);
}
export default compose(
- withTrialBalance(({
- trialBalance,
- trialBalanceSheetLoading,
- trialBalanceQuery
- }) => ({
- trialBalance,
- trialBalanceSheetLoading,
- trialBalanceQuery
- })),
+ withTrialBalance(
+ ({
+ trialBalanceTableRows,
+ trialBalanceSheetLoading,
+ trialBalanceQuery,
+ }) => ({
+ trialBalanceTableRows,
+ trialBalanceSheetLoading,
+ trialBalanceQuery,
+ }),
+ ),
)(TrialBalanceSheetTable);
diff --git a/client/src/containers/FinancialStatements/TrialBalanceSheet/withTrialBalance.js b/client/src/containers/FinancialStatements/TrialBalanceSheet/withTrialBalance.js
index c2b5def47..d8c482f7e 100644
--- a/client/src/containers/FinancialStatements/TrialBalanceSheet/withTrialBalance.js
+++ b/client/src/containers/FinancialStatements/TrialBalanceSheet/withTrialBalance.js
@@ -2,16 +2,19 @@ import {connect} from 'react-redux';
import {
getFinancialSheetFactory,
getFinancialSheetQueryFactory,
+ getFinancialSheetTableRowsFactory,
} from 'store/financialStatement/financialStatements.selectors';
export default (mapState) => {
const mapStateToProps = (state, props) => {
const getTrialBalance = getFinancialSheetFactory('trialBalance');
const getBalanceSheetQuery = getFinancialSheetQueryFactory('trialBalance');
+ const getTrialBalanceRows = getFinancialSheetTableRowsFactory('trialBalance');
const mapped = {
trialBalance: getTrialBalance(state, props),
trialBalanceQuery: getBalanceSheetQuery(state, props),
+ trialBalanceTableRows: getTrialBalanceRows(state, props),
trialBalanceSheetLoading: state.financialStatements.trialBalance.loading,
trialBalanceSheetFilter: state.financialStatements.trialBalance.filter,
trialBalanceSheetRefresh: state.financialStatements.trialBalance.refresh,
diff --git a/client/src/containers/Items/ItemForm.js b/client/src/containers/Items/ItemForm.js
index b30b6c3ee..f3bd8b9cf 100644
--- a/client/src/containers/Items/ItemForm.js
+++ b/client/src/containers/Items/ItemForm.js
@@ -30,6 +30,8 @@ import {
transformItemFormData,
} from './ItemForm.schema';
+import 'style/pages/Items/PageForm.scss';
+
const defaultInitialValues = {
active: 1,
name: '',
diff --git a/client/src/containers/Items/ItemsList.js b/client/src/containers/Items/ItemsList.js
index 76f8678c9..81a387cfe 100644
--- a/client/src/containers/Items/ItemsList.js
+++ b/client/src/containers/Items/ItemsList.js
@@ -24,6 +24,11 @@ import withDashboardActions from 'containers/Dashboard/withDashboardActions';
import withItemsActions from 'containers/Items/withItemsActions';
import withViewsActions from 'containers/Views/withViewsActions';
+import 'style/pages/Items/List.scss';
+
+/**
+ * Items list.
+ */
function ItemsList({
// #withDashboardActions
changePageTitle,
diff --git a/client/src/containers/Preferences/Accountant/Accountant.js b/client/src/containers/Preferences/Accountant/Accountant.js
index e7acd35c5..4e7ebe6be 100644
--- a/client/src/containers/Preferences/Accountant/Accountant.js
+++ b/client/src/containers/Preferences/Accountant/Accountant.js
@@ -14,6 +14,8 @@ import withAccountsActions from 'containers/Accounts/withAccountsActions';
import { compose } from 'utils';
+import 'style/pages/Preferences/Accounting.scss';
+
// Accountant preferences.
function AccountantPreferences({
changePreferencesPageTitle,
diff --git a/client/src/containers/Preferences/General/General.js b/client/src/containers/Preferences/General/General.js
index 0aa0d2c71..13de955c1 100644
--- a/client/src/containers/Preferences/General/General.js
+++ b/client/src/containers/Preferences/General/General.js
@@ -17,6 +17,11 @@ import withDashboardActions from 'containers/Dashboard/withDashboardActions';
import withSettings from 'containers/Settings/withSettings';
import withSettingsActions from 'containers/Settings/withSettingsActions';
+import 'style/pages/Preferences/GeneralForm.scss';
+
+/**
+ * Preferences - General form.
+ */
function GeneralPreferences({
// #withSettings
organizationSettings,
diff --git a/client/src/containers/Purchases/Bill/BillActionsBar.js b/client/src/containers/Purchases/Bill/BillActionsBar.js
index 720f265bf..fdd0c4d4b 100644
--- a/client/src/containers/Purchases/Bill/BillActionsBar.js
+++ b/client/src/containers/Purchases/Bill/BillActionsBar.js
@@ -3,8 +3,6 @@ import Icon from 'components/Icon';
import {
Button,
Classes,
- Menu,
- MenuItem,
Popover,
NavbarDivider,
NavbarGroup,
@@ -14,7 +12,7 @@ import {
} from '@blueprintjs/core';
import classNames from 'classnames';
-import { useRouteMatch, useHistory } from 'react-router-dom';
+import { useHistory } from 'react-router-dom';
import { FormattedMessage as T, useIntl } from 'react-intl';
import { connect } from 'react-redux';
diff --git a/client/src/containers/Purchases/Bill/Bills.js b/client/src/containers/Purchases/Bill/Bills.js
index e6279e279..815f5cc2c 100644
--- a/client/src/containers/Purchases/Bill/Bills.js
+++ b/client/src/containers/Purchases/Bill/Bills.js
@@ -14,17 +14,19 @@ import withDashboardActions from 'containers/Dashboard/withDashboardActions';
import { compose } from 'utils';
+import 'style/pages/Bills/PageForm.scss';
+
function Bills({
- //#withwithAccountsActions
+ // #withwithAccountsActions
requestFetchAccounts,
- //#withVendorActions
+ // #withVendorActions
requestFetchVendorsTable,
- //#withItemsActions
+ // #withItemsActions
requestFetchItems,
- //# withBilleActions
+ // #withBilleActions
requestFetchBill,
// #withSettingsActions
diff --git a/client/src/containers/Purchases/PaymentMades/PaymentMade.js b/client/src/containers/Purchases/PaymentMades/PaymentMade.js
index 49e34c61b..1e863c682 100644
--- a/client/src/containers/Purchases/PaymentMades/PaymentMade.js
+++ b/client/src/containers/Purchases/PaymentMades/PaymentMade.js
@@ -16,6 +16,11 @@ import withSettingsActions from 'containers/Settings/withSettingsActions';
import { compose } from 'utils';
+import 'style/pages/PaymentMade/PageForm.scss'
+
+/**
+ * Payment made - Page form.
+ */
function PaymentMade({
//#withAccountsActions
requestFetchAccounts,
diff --git a/client/src/containers/Purchases/PaymentMades/PaymentMadeItemsTableEditor.js b/client/src/containers/Purchases/PaymentMades/PaymentMadeItemsTableEditor.js
index c70e2f3f5..b4a2cf22f 100644
--- a/client/src/containers/Purchases/PaymentMades/PaymentMadeItemsTableEditor.js
+++ b/client/src/containers/Purchases/PaymentMades/PaymentMadeItemsTableEditor.js
@@ -6,7 +6,7 @@ import { sumBy } from 'lodash';
import classNames from 'classnames';
import { CLASSES } from 'common/classes';
-import { DataTable, Money } from 'components';
+import { DataTableEditable, Money } from 'components';
import { transformUpdatedRows } from 'utils';
import {
MoneyFieldCell,
@@ -140,24 +140,18 @@ export default function PaymentMadeItemsTableEditor({
);
return (
-
+ }
+ totalRow={true}
+ />
);
}
diff --git a/client/src/containers/Sales/Estimate/Estimates.js b/client/src/containers/Sales/Estimate/Estimates.js
index 60dda9d08..d01f90943 100644
--- a/client/src/containers/Sales/Estimate/Estimates.js
+++ b/client/src/containers/Sales/Estimate/Estimates.js
@@ -13,6 +13,8 @@ import withDashboardActions from 'containers/Dashboard/withDashboardActions';
import { compose } from 'utils';
+import 'style/pages/SaleEstimate/PageForm.scss';
+
function Estimates({
// #withCustomersActions
requestFetchCustomers,
@@ -85,8 +87,8 @@ function Estimates({
name={'estimate-form'}
>
diff --git a/client/src/containers/Sales/Invoice/InvoiceForm.js b/client/src/containers/Sales/Invoice/InvoiceForm.js
index 88d757721..7c5404704 100644
--- a/client/src/containers/Sales/Invoice/InvoiceForm.js
+++ b/client/src/containers/Sales/Invoice/InvoiceForm.js
@@ -3,7 +3,7 @@ import { Formik, Form } from 'formik';
import moment from 'moment';
import { Intent } from '@blueprintjs/core';
import { useIntl } from 'react-intl';
-import { pick, sumBy, omit, values } from 'lodash';
+import { pick, sumBy, omit } from 'lodash';
import classNames from 'classnames';
import { CLASSES } from 'common/classes';
diff --git a/client/src/containers/Sales/Invoice/InvoiceFormHeader.js b/client/src/containers/Sales/Invoice/InvoiceFormHeader.js
index f0809033d..09362a497 100644
--- a/client/src/containers/Sales/Invoice/InvoiceFormHeader.js
+++ b/client/src/containers/Sales/Invoice/InvoiceFormHeader.js
@@ -8,6 +8,7 @@ import InvoiceFormHeaderFields from './InvoiceFormHeaderFields';
import { PageFormBigNumber } from 'components';
import withSettings from 'containers/Settings/withSettings';
+
import { compose } from 'redux';
/**
diff --git a/client/src/containers/Sales/Invoice/Invoices.js b/client/src/containers/Sales/Invoice/Invoices.js
index 892c208f4..49c31ad4c 100644
--- a/client/src/containers/Sales/Invoice/Invoices.js
+++ b/client/src/containers/Sales/Invoice/Invoices.js
@@ -13,6 +13,8 @@ import withDashboardActions from 'containers/Dashboard/withDashboardActions';
import { compose } from 'utils';
+import 'style/pages/SaleInvoice/PageForm.scss';
+
function Invoices({
// #withCustomersActions
requestFetchCustomers,
diff --git a/client/src/containers/Sales/PaymentReceive/PaymentReceiveForm.js b/client/src/containers/Sales/PaymentReceive/PaymentReceiveForm.js
index 859e079c0..6852821e0 100644
--- a/client/src/containers/Sales/PaymentReceive/PaymentReceiveForm.js
+++ b/client/src/containers/Sales/PaymentReceive/PaymentReceiveForm.js
@@ -27,6 +27,8 @@ import { AppToaster } from 'components';
import { compose, defaultToTransform } from 'utils';
+import 'style/pages/PaymentReceive/PageForm.scss'
+
/**
* Payment Receive form.
*/
diff --git a/client/src/containers/Sales/PaymentReceive/PaymentReceiveItemsTableEditor.js b/client/src/containers/Sales/PaymentReceive/PaymentReceiveItemsTableEditor.js
index 3327d8a61..579dd01e1 100644
--- a/client/src/containers/Sales/PaymentReceive/PaymentReceiveItemsTableEditor.js
+++ b/client/src/containers/Sales/PaymentReceive/PaymentReceiveItemsTableEditor.js
@@ -6,7 +6,7 @@ import { sumBy } from 'lodash';
import classNames from 'classnames';
import { CLASSES } from 'common/classes';
-import { DataTable, Money } from 'components';
+import { DataTableEditable, Money } from 'components';
import { transformUpdatedRows } from 'utils';
import {
MoneyFieldCell,
@@ -146,24 +146,18 @@ export default function PaymentReceiveItemsTableEditor({
);
return (
-
+ }
+ totalRow={true}
+ />
);
}
diff --git a/client/src/containers/Sales/Receipt/ReceiptForm.js b/client/src/containers/Sales/Receipt/ReceiptForm.js
index d94049c85..a2643a0f0 100644
--- a/client/src/containers/Sales/Receipt/ReceiptForm.js
+++ b/client/src/containers/Sales/Receipt/ReceiptForm.js
@@ -29,9 +29,6 @@ import withMediaActions from 'containers/Media/withMediaActions';
import withSettings from 'containers/Settings/withSettings';
import { AppToaster } from 'components';
-import Dragzone from 'components/Dragzone';
-import useMedia from 'hooks/useMedia';
-
import {
compose,
repeatValue,
@@ -39,6 +36,8 @@ import {
defaultToTransform,
} from 'utils';
+import 'style/pages/SaleReceipt/PageForm.scss'
+
const MIN_LINES_NUMBER = 4;
const defaultReceipt = {
@@ -66,18 +65,18 @@ const defaultInitialValues = {
* Receipt form.
*/
function ReceiptForm({
- //#withMedia
+ // #withMedia
requestSubmitMedia,
requestDeleteMedia,
- //#withReceiptActions
+ // #withReceiptActions
requestSubmitReceipt,
requestEditReceipt,
- //#withReceiptDetail
+ // #withReceiptDetail
receipt,
- //#withDashboard
+ // #withDashboard
changePageTitle,
changePageSubtitle,
diff --git a/client/src/containers/Setup/SetupCongratsPage.js b/client/src/containers/Setup/SetupCongratsPage.js
index 51343733b..2cb7b87a6 100644
--- a/client/src/containers/Setup/SetupCongratsPage.js
+++ b/client/src/containers/Setup/SetupCongratsPage.js
@@ -1,12 +1,16 @@
import React, { useCallback } from 'react';
import { Button, Intent } from '@blueprintjs/core';
-import { FormattedMessage as T } from 'react-intl';
import { useHistory } from "react-router-dom";
import WorkflowIcon from './WorkflowIcon';
import withOrganizationActions from 'containers/Organization/withOrganizationActions';
+import 'style/pages/Setup/Congrats.scss';
+
import { compose } from 'utils';
+/**
+ * Setup congrats page.
+ */
function SetupCongratsPage({
setOrganizationSetupCompleted,
}) {
diff --git a/client/src/containers/Setup/SetupInitializingForm.js b/client/src/containers/Setup/SetupInitializingForm.js
index 37dc4b6c9..9445b9354 100644
--- a/client/src/containers/Setup/SetupInitializingForm.js
+++ b/client/src/containers/Setup/SetupInitializingForm.js
@@ -3,8 +3,9 @@ import { useQuery } from 'react-query';
import { withWizard } from 'react-albus'
import { ProgressBar, Intent } from '@blueprintjs/core';
+import 'style/pages/Setup/Initializing.scss';
+
import withOrganizationActions from 'containers/Organization/withOrganizationActions';
-import withOrganization from 'containers/Organization/withOrganization'
import { compose } from 'utils';
diff --git a/client/src/containers/Setup/SetupOrganizationForm.js b/client/src/containers/Setup/SetupOrganizationForm.js
index a78ff2651..fc7d5f3f6 100644
--- a/client/src/containers/Setup/SetupOrganizationForm.js
+++ b/client/src/containers/Setup/SetupOrganizationForm.js
@@ -17,6 +17,9 @@ import { TimezonePicker } from '@blueprintjs/timezone';
import { FormattedMessage as T, useIntl } from 'react-intl';
import { DateInput } from '@blueprintjs/datetime';
import { withWizard } from 'react-albus';
+
+import 'style/pages/Setup/Organization.scss';
+
import { momentFormatter, tansformDateValue } from 'utils';
import { ListSelect, ErrorMessage, FieldRequiredHint } from 'components';
diff --git a/client/src/containers/Setup/SetupSubscriptionForm.js b/client/src/containers/Setup/SetupSubscriptionForm.js
index ba3c2be35..5d26dfbb3 100644
--- a/client/src/containers/Setup/SetupSubscriptionForm.js
+++ b/client/src/containers/Setup/SetupSubscriptionForm.js
@@ -4,11 +4,16 @@ import { useFormik } from 'formik';
import { FormattedMessage as T, useIntl } from 'react-intl';
import { Button, Intent } from '@blueprintjs/core';
import { withWizard } from 'react-albus';
-import withSubscriptionsActions from 'containers/Subscriptions/withSubscriptionsActions';
+
+import 'style/pages/Setup/Billing.scss';
+
import BillingPlans from 'containers/Subscriptions/billingPlans';
import BillingPeriods from 'containers/Subscriptions/billingPeriods';
import { BillingPaymentmethod } from 'containers/Subscriptions/billingPaymentmethod';
+
+import withSubscriptionsActions from 'containers/Subscriptions/withSubscriptionsActions';
import withBillingActions from 'containers/Subscriptions/withBillingActions';
+
import { compose } from 'utils';
/**
diff --git a/client/src/containers/Setup/WizardSetupPage.js b/client/src/containers/Setup/WizardSetupPage.js
index 0a22bffd3..3f204f909 100644
--- a/client/src/containers/Setup/WizardSetupPage.js
+++ b/client/src/containers/Setup/WizardSetupPage.js
@@ -2,6 +2,7 @@ import React from 'react';
import SetupRightSection from './SetupRightSection';
import SetupLeftSection from './SetupLeftSection';
+import 'style/pages/Setup/SetupPage.scss';
export default function WizardSetupPage() {
return (
diff --git a/client/src/routes/dashboard.js b/client/src/routes/dashboard.js
index fc245fae9..ff05aa653 100644
--- a/client/src/routes/dashboard.js
+++ b/client/src/routes/dashboard.js
@@ -11,7 +11,6 @@ export default [
}),
breadcrumb: 'Home',
},
-
// Accounts.
{
path: `/accounts`,
@@ -20,7 +19,6 @@ export default [
}),
breadcrumb: 'Accounts Chart',
},
-
// Custom views.
{
path: `/custom_views/:resource_slug/new`,
@@ -36,8 +34,7 @@ export default [
}),
breadcrumb: 'Edit',
},
-
- // Accounting
+ // Accounting.
{
path: `/make-journal-entry`,
component: LazyLoader({
@@ -81,7 +78,7 @@ export default [
breadcrumb: 'New Item',
},
- // Items
+ // Items.
{
path: `/items`,
component: LazyLoader({
@@ -89,7 +86,7 @@ export default [
}),
breadcrumb: 'Items',
},
- // Inventory adjustments
+ // Inventory adjustments.
{
path: `/inventory-adjustments`,
component: LazyLoader({
@@ -166,7 +163,7 @@ export default [
}),
breadcrumb: 'Exchange Rates',
},
- // Expenses
+ // Expenses.
{
path: `/expenses/new`,
component: LazyLoader({
diff --git a/client/src/store/financialStatement/financialStatements.mappers.js b/client/src/store/financialStatement/financialStatements.mappers.js
index a5f78c9e6..f4bbc42f2 100644
--- a/client/src/store/financialStatement/financialStatements.mappers.js
+++ b/client/src/store/financialStatement/financialStatements.mappers.js
@@ -17,7 +17,7 @@ export const mapBalanceSheetToTableRows = (accounts) => {
? [
{
name: `Total ${account.name}`,
- row_types: rowTypes,
+ row_types: ['total-row', account.section_type],
total: { ...account.total },
...(account.total_periods && {
total_periods: account.total_periods,
@@ -104,7 +104,7 @@ export const ARAgingSummaryTableRowsMapper = (sheet, total) => {
return [
...rows,
{
- name: 'TOTAL',
+ name: 'Total Aged Receivable',
rowType: 'total',
current: sheet.total.current.formatted_amount,
...mapAging(sheet.total.aging),
@@ -115,11 +115,12 @@ export const ARAgingSummaryTableRowsMapper = (sheet, total) => {
export const mapTrialBalanceSheetToRows = (sheet) => {
return [
+ ...sheet.accounts,
{
name: 'Total',
+ rowTypes: ['total'],
...sheet.total,
},
- ...sheet.accounts,
];
};
diff --git a/client/src/store/financialStatement/financialStatements.reducer.js b/client/src/store/financialStatement/financialStatements.reducer.js
index c88cff6e9..467d5a2b0 100644
--- a/client/src/store/financialStatement/financialStatements.reducer.js
+++ b/client/src/store/financialStatement/financialStatements.reducer.js
@@ -81,7 +81,6 @@ export default createReducer(initialState, {
...financialStatementFilterToggle('BALANCE_SHEET', 'balanceSheet'),
[t.TRAIL_BALANCE_STATEMENT_SET]: (state, action) => {
- debugger;
const trailBalanceSheet = {
sheet: action.data.data,
tableRows: mapTrialBalanceSheetToRows(action.data.data),
@@ -155,11 +154,8 @@ export default createReducer(initialState, {
const { refresh } = action.payload;
state.profitLoss.refresh = !!refresh;
},
-
...financialStatementFilterToggle('PROFIT_LOSS', 'profitLoss'),
-
-
[t.RECEIVABLE_AGING_SUMMARY_SET]: (state, action) => {
const { customers, total, columns, query } = action.payload;
diff --git a/client/src/style/App.scss b/client/src/style/App.scss
index 5de0242af..bda8db957 100644
--- a/client/src/style/App.scss
+++ b/client/src/style/App.scss
@@ -1,129 +1,49 @@
@import './normalize.scss';
-$pt-popover-box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.02),
- 0 2px 4px rgba(16, 22, 26, 0.1), 0 8px 24px rgba(16, 22, 26, 0.1);
-
-@import '@blueprintjs/core/src/common/_variables.scss';
-// @import "@blueprintjs/core/src/common/colors.scss";
-
-$blue1: #0069ff;
-$blue2: #0052ff;
-$blue3: rgb(0, 82, 204);
-$pt-link-color: $blue3;
-$pt-intent-primary: $blue1;
-$menu-item-color-hover: $light-gray4;
-$menu-item-color-active: $light-gray3;
-
-$breadcrumbs-collapsed-icon: url("data:image/svg+xml,
");
-
-$sidebar-zindex: 15;
-$pt-font-family: Noto Sans, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto,
- Oxygen, Ubuntu, Cantarell, Open Sans, Helvetica Neue, Icons16, sans-serif;
-
-$button-box-shadow: 0 0 0 !default;
-$button-box-shadow-active: 0 0 0 !default;
-$button-intent-box-shadow: 0 0 0 !default;
-$button-intent-box-shadow-active: 0 0 0 !default;
-
-$button-background-color-disabled: #E9ECEF !default;
-$button-background-color: #E6EFFB !default;
-$button-background-color-hover: #CFDCEE !default;
+@import './Base.scss';
// Blueprint framework.
@import '@blueprintjs/core/src/blueprint.scss';
@import '@blueprintjs/datetime/src/blueprint-datetime.scss';
-// Bootstrap
-// @import '~bootstrap/scss/bootstrap';
-
@import 'basscss';
-@import 'functions';
-
// Objects
@import 'objects/form';
@import 'objects/typography';
@import 'objects/buttons';
+@import 'objects/Bigcapital';
// Components
-@import 'components/data-table';
-@import 'components/dialog';
-@import 'components/custom-scrollbar';
+@import 'components/CustomScrollbar';
@import 'components/dragzone';
-@import 'components/pagination';
@import 'components/resizer';
+@import 'components/CloudSpinner';
+@import 'components/Alert';
+@import 'components/Card';
+@import 'components/Toast';
+@import 'components/PageForm';
+@import 'components/Tooltip';
// Pages
-@import 'pages/dashboard';
-@import 'pages/accounts-chart';
-@import 'pages/authentication';
-@import 'pages/expense-form';
@import 'pages/financial-statements';
-@import 'pages/make-journal-entries';
-@import 'pages/preferences';
@import 'pages/view-form';
-@import 'pages/manual-journals';
-@import 'pages/item-category';
-@import 'pages/items';
-@import 'pages/items-categories';
-@import 'pages/invite-form';
-@import 'pages/currency';
-@import 'pages/invite-user';
-@import 'pages/exchange-rate';
-@import 'pages/customer';
-@import 'pages/billing';
-@import 'pages/register-wizard-page';
@import 'pages/register-organizaton';
-@import 'pages/bills';
-@import 'pages/estimates';
-@import 'pages/invoice-form';
-@import 'pages/receipt-form';
-@import 'pages/payment-made';
-@import 'pages/payment-receive';
// Views
@import 'views/filter-dropdown';
-@import 'views/sidebar';
-// @import 'pages/estimate';
+
.App {
min-width: 960px;
}
-.#{$ns}-tooltip {
- box-shadow: none;
-}
-
-[data-icon='bigcapital'] {
- path {
- fill: #004dd0;
- }
- .path-1,
- .path-13 {
- fill: #2d95fd;
- }
-}
-
-.bigcapital--alt {
- svg {
- path,
- .path-13,
- .path-1 {
- fill: #fff;
- }
- }
-}
// =======
-body.authentication {
- background-color: #fcfdff;
-}
+
body.hide-scrollbar .Pane2{
overflow: hidden;
}
-.bp3-toast {
- box-shadow: none;
-}
.select-list--fill-popover {
position: relative;
@@ -149,36 +69,12 @@ body.hide-scrollbar .Pane2{
.bp3-datepicker-caption .bp3-html-select::after {
margin-right: 6px;
}
-
-.hint {
- margin-left: 6px;
- position: relative;
- top: -1px;
-
- .bp3-icon {
- color: #a1b2c5;
- }
-
- .bp3-popover-target:hover .bp3-icon {
- color: #90a1b5;
- }
- .bp3-icon {
- vertical-align: middle;
- }
-}
-
.bp3-select-popover .bp3-menu {
max-height: 300px;
max-width: 400px;
overflow: auto;
}
-.pt-tooltip {
- .pt-popover-content {
- max-width: 100px;
- }
-}
-
.bp3-form-group .bp3-label {
.hint {
.bp3-popover-wrapper {
@@ -196,408 +92,7 @@ body.hide-scrollbar .Pane2{
max-width: 300px;
}
-
-.bigcapital-loading{
- height: 100%;
- width: 100%;
- position: absolute;
- display: flex;
-
- .center{
- width: auto;
- margin: auto;
- display: flex;
- flex-direction: column;
- }
-
- .text{
- margin-top: 12px;
- opacity: 0.85;
- display: none;
- }
-}
-
-
-// .page-form
-// .page-form__header
-// .page-form__content
-// .page-form__floating-actions
-.page-form{
- $self: '.page-form';
- padding-bottom: 20px;
-
-
- &__floating-actions{
- position: fixed;
- bottom: 0;
- width: 100%;
- background: #fff;
- padding: 14px 18px;
- border-top: 1px solid rgba(0, 0, 0, 0.05);
- box-shadow: 0px -1px 4px 0px rgba(0, 0, 0, 0.05);
- }
-
- &--strip{
-
- #{$self}__header-fields{
- width: 85%;
- }
- #{$self}__body,
- #{$self}__footer{
- max-width: 1200px;
- }
-
- #{$self}__header{
- background-color: #fbfbfb;
- padding: 30px 20px 0;
- border-bottom: 1px solid #d2dce2;
-
- .bp3-form-group.bp3-inline label.bp3-label{
- font-weight: 500;
- }
- }
-
- #{$self}__body{
- padding-top: 15px;
- padding-left: 20px;
- padding-right: 20px;
- }
-
- #{$self}__footer{
- margin: 25px 0 0 0;
- padding-left: 20px;
- padding-right: 20px;
- }
- }
-}
-.datatable-editor{
-
- .bp3-form-group {
- margin-bottom: 0;
- }
- .table {
- border: 1px solid #d2dce2;
- border-left: transparent;
-
- .th,
- .td {
- border-left: 1px solid #e2e2e2;
-
- &.index {
- text-align: center;
-
- span {
- width: 100%;
- font-weight: 500;
- }
- }
-
- &:first-child{
- border-left: 1px solid #d2dce2;
- }
- }
-
- .thead {
- .tr .th {
- padding: 10px 10px;
- background-color: #f0f2f8;
- font-size: 14px;
- font-weight: 500;
- color: #1c1940;
-
- &.index > div {
- width: 100%;
- }
- }
- }
-
- .tbody {
- .tr .td {
- padding: 5px;
- border-bottom: 0;
- border-top: 1px dashed #AAA;
- min-height: 42px;
-
- &.index {
- background-color: #f0f2f8;
-
- > span {
- margin-top: auto;
- margin-bottom: auto;
- }
- }
- }
- .tr {
- .bp3-form-group:not(.bp3-intent-danger) .bp3-input,
- .form-group--select-list .bp3-button {
- border-color: #ffffff;
- color: #222;
- border-radius: 3px;
- }
-
- .bp3-form-group:not(.bp3-intent-danger) .bp3-input{
- border-radius: 2px;
- padding-left: 4px;
- padding-right: 4px;
-
- &:focus{
- box-shadow: 0 0 0 2px #116cd0;
- }
- }
-
- .form-group--select-list .bp3-button{
- padding-left: 6px;
- padding-right: 6px;
-
- &:after{
- display: none;
- }
- }
-
- .form-group--select-list,
- .bp3-form-group {
- &.bp3-intent-danger {
- .bp3-button:not(.bp3-minimal),
- .bp3-input {
- border-color: #F7B6B6;
- }
- }
- }
-
- &:first-of-type{
- .td{
- border-top: 0;
- }
- }
-
- &:last-of-type {
- .td {
-
- .bp3-button,
- .bp3-input-group {
- display: none;
- }
- }
- }
-
- .td.actions {
- .bp3-button {
- background-color: transparent;
- color: #e66d6d;
-
- &:hover {
- color: #c23030;
- }
-
- svg {
- color: inherit;
- }
- }
- }
-
- &.row--total {
-
- .account.td,
- .debit.td,
- .credit.td {
- > span {
- padding-top: 2px;
- }
- }
- .debit.td,
- .credit.td {
- > span {
- font-weight: 600;
- color: #444;
- }
- }
- }
-
- .td {
- &.note {
- .bp3-form-group {
- width: 100%;
- }
- }
-
- }
- }
- }
- .th {
- color: #444;
- font-weight: 600;
- border-bottom: 1px dotted #666;
- }
-
- .td {
- border-bottom: 1px dotted #999;
- }
-
- .actions.td {
- .bp3-button {
- background: transparent;
- margin: 0;
- }
- }
- }
-
- .table{
- .tbody{
- .tr .td.actions .bp3-button{
- background-color: transparent;
- color: #e66d6d;
-
- svg{
- color: inherit;
- }
- }
- }
- }
-
- &__actions{
- margin-top: 12px;
-
- .bp3-button{
- padding-left: 10px;
- padding-right: 10px;
- }
-
- .button--clear-lines{
-
- &.bp3-button:not([class*="bp3-intent-"]):not(.bp3-minimal){
- background-color: #fcefef;
- }
- }
- }
-
-
- &.has-total-row{
-
- .table .tbody-inner .tr:last-of-type{
-
- .td{
- border-top-width: 2px;
- border-top-color: #E9E9EF;
- border-top-style: solid;
- min-height: 40px;
-
- &:not(.index) {
- background-color: #FCFCFD;
- }
-
- &.index span{
- display: none;
- }
- }
- }
- }
-}
-
-.cloud-spinner{
- position: relative;
-
- &.is-loading:before{
- content: "";
- position: absolute;
- top: 0;
- bottom: 0;
- right: 0;
- left: 0;
- background: rgba(255, 255, 255, 0.8);
- z-index: 999;
- }
-
- .bp3-spinner{
- position: absolute;
- z-index: 999999;
- left: 50%;
- top: 50%;
- margin-top: -20px;
- margin-left: -20px;
- }
-
- &:not(.is-loading) .bp3-spinner{
- display: none;
- }
-}
-
-
-.big-amount{
-
- &__label{
- color: #5d6f90;
- text-overflow: ellipsis;
- white-space: nowrap;
- font-size: 14px;
- }
- &__number{
- margin: 0;
- text-overflow: ellipsis;
- white-space: nowrap;
- font-weight: 400;
- margin-top: 6px;
- color: #343463;
- line-height: 1;
- font-size: 34px;
- }
-}
-
-
-.bp3-alert{
- .bp3-alert-footer{
- .bp3-button{
- min-width: 70px;
- }
- }
-}
-
-.datatable-empty-status{
- max-width: 550px;
- width: 100%;
- margin: 0 auto;
- text-align: center;
- margin-top: 200px;
-
- &__title{
- font-size: 20px;
- color: #2c3a5d;
- font-weight: 600;
- margin-left: auto;
- margin-bottom: 10px;
- margin-right: auto;
- margin-top: 0;
- line-height: 1.4;
- }
- &__desc{
- font-size: 16px;
- color: #1f3255;
- opacity: 0.8;
- line-height: 1.6;
- }
- &__actions{
- margin-top: 26px;
-
- .bp3-button{
- min-height: 36px;
-
- & + .bp3-button{
- margin-left: 10px;
- }
- }
- }
-}
-
-.dropzone-container{
- max-width: 250px;
- margin-left: auto;
-}
-
-.card{
- background: #fff;
- border: 1px solid #d2dce2;
-}
-
-
+
.form-group--select-list{
button{
justify-content: start;
diff --git a/client/src/style/Base.scss b/client/src/style/Base.scss
new file mode 100644
index 000000000..e8fa8c7d3
--- /dev/null
+++ b/client/src/style/Base.scss
@@ -0,0 +1,3 @@
+
+@import 'variables';
+@import 'functions';
\ No newline at end of file
diff --git a/client/src/style/components/Alert.scss b/client/src/style/components/Alert.scss
new file mode 100644
index 000000000..502d5da40
--- /dev/null
+++ b/client/src/style/components/Alert.scss
@@ -0,0 +1,7 @@
+.bp3-alert{
+ .bp3-alert-footer{
+ .bp3-button{
+ min-width: 70px;
+ }
+ }
+}
\ No newline at end of file
diff --git a/client/src/style/components/BigAmount.scss b/client/src/style/components/BigAmount.scss
new file mode 100644
index 000000000..32231bdf4
--- /dev/null
+++ b/client/src/style/components/BigAmount.scss
@@ -0,0 +1,20 @@
+
+.big-amount{
+
+ &__label{
+ color: #5d6f90;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ font-size: 14px;
+ }
+ &__number{
+ margin: 0;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ font-weight: 400;
+ margin-top: 6px;
+ color: #343463;
+ line-height: 1;
+ font-size: 34px;
+ }
+}
\ No newline at end of file
diff --git a/client/src/style/components/BigcapitalLoading.scss b/client/src/style/components/BigcapitalLoading.scss
new file mode 100644
index 000000000..b44be05a3
--- /dev/null
+++ b/client/src/style/components/BigcapitalLoading.scss
@@ -0,0 +1,19 @@
+.bigcapital-loading {
+ height: 100%;
+ width: 100%;
+ position: absolute;
+ display: flex;
+
+ .center {
+ width: auto;
+ margin: auto;
+ display: flex;
+ flex-direction: column;
+ }
+
+ .text {
+ margin-top: 12px;
+ opacity: 0.85;
+ display: none;
+ }
+}
diff --git a/client/src/style/components/Card.scss b/client/src/style/components/Card.scss
new file mode 100644
index 000000000..5662ab350
--- /dev/null
+++ b/client/src/style/components/Card.scss
@@ -0,0 +1,5 @@
+
+.card{
+ background: #fff;
+ border: 1px solid #d2dce2;
+}
\ No newline at end of file
diff --git a/client/src/style/components/CloudSpinner.scss b/client/src/style/components/CloudSpinner.scss
new file mode 100644
index 000000000..d300db262
--- /dev/null
+++ b/client/src/style/components/CloudSpinner.scss
@@ -0,0 +1,28 @@
+
+
+.cloud-spinner{
+ position: relative;
+
+ &.is-loading:before{
+ content: "";
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ right: 0;
+ left: 0;
+ background: rgba(255, 255, 255, 0.8);
+ z-index: 999;
+ }
+
+ .bp3-spinner{
+ position: absolute;
+ z-index: 999999;
+ left: 50%;
+ top: 50%;
+ margin-top: -20px;
+ margin-left: -20px;
+ }
+ &:not(.is-loading) .bp3-spinner{
+ display: none;
+ }
+}
diff --git a/client/src/style/components/custom-scrollbar.scss b/client/src/style/components/CustomScrollbar.scss
similarity index 100%
rename from client/src/style/components/custom-scrollbar.scss
rename to client/src/style/components/CustomScrollbar.scss
diff --git a/client/src/style/components/data-table.scss b/client/src/style/components/DataTable/DataTable.scss
similarity index 67%
rename from client/src/style/components/data-table.scss
rename to client/src/style/components/DataTable/DataTable.scss
index 260ce47bb..c9fb01445 100644
--- a/client/src/style/components/data-table.scss
+++ b/client/src/style/components/DataTable/DataTable.scss
@@ -1,27 +1,26 @@
+@import 'src/style/Base.scss';
-.bigcapital-datatable{
+.bigcapital-datatable {
display: block;
- .dashboard__page-content &{
-
- .table .thead{
- .th{
- border-bottom-color: #D2DDE2;
+ .dashboard__page-content & {
+ .table .thead {
+ .th {
+ border-bottom-color: #d2dde2;
}
}
}
-
.table {
text-align: left;
border-spacing: 0;
min-width: 100%;
display: block;
- .thead{
+ .thead {
overflow-y: auto;
overflow-x: hidden;
- .th{
+ .th {
padding: 0.6rem 0.5rem;
background: #fafafa;
font-size: 14px;
@@ -29,7 +28,7 @@
font-weight: 500;
border-bottom: 1px solid rgb(224, 224, 224);
}
- .sort-icon{
+ .sort-icon {
width: 0;
height: 0;
position: relative;
@@ -37,12 +36,12 @@
display: inline-block;
margin-left: 5px;
- &--desc{
+ &--desc {
border-left: 4px solid transparent;
border-right: 4px solid transparent;
border-bottom: 6px solid #666;
}
- &--asc{
+ &--asc {
border-left: 4px solid transparent;
border-right: 4px solid transparent;
border-top: 6px solid #666;
@@ -53,7 +52,7 @@
.tr {
display: flex;
flex: 1 0 auto;
-
+
&:last-child {
.td {
border-bottom: 0;
@@ -75,7 +74,7 @@
border-right: 0;
}
- .bp3-control{
+ .bp3-control {
margin-bottom: 0;
}
.resizer {
@@ -88,94 +87,94 @@
top: 0;
transform: translateX(50%);
z-index: 1;
- touch-action:none;
+ touch-action: none;
&.isResizing {
// background: red;
}
- .inner-resizer{
+ .inner-resizer {
height: 100%;
width: 1px;
border-left: 1px solid #ececec;
margin: 0 auto;
}
- &.isResizing .inner-resizer{
- background: #1183DA;
+ &.isResizing .inner-resizer {
+ background: #1183da;
}
}
- .bp3-control.bp3-checkbox .bp3-control-indicator{
+ .bp3-control.bp3-checkbox .bp3-control-indicator {
border: 2px solid #d7d7d7;
&,
- &:hover{
+ &:hover {
height: 16px;
width: 16px;
}
}
- .bp3-control.bp3-checkbox{
+ .bp3-control.bp3-checkbox {
input:checked ~ .bp3-control-indicator,
- input:indeterminate ~ .bp3-control-indicator,{
+ input:indeterminate ~ .bp3-control-indicator {
border-color: #0052ff;
}
- }
+ }
}
- .tbody{
+ .tbody {
width: 100%;
overflow: auto;
- .tbody-inner{
- > .loading{
+ .tbody-inner {
+ > .loading {
padding-top: 40px;
}
}
- .tr .td{
- border-bottom: 1px solid #E8E8E8;
+ .tr .td {
+ border-bottom: 1px solid #e8e8e8;
align-items: center;
color: #141720;
- .placeholder{
- color: #A0A0A0;
+ .placeholder {
+ color: #a0a0a0;
}
- .bp3-form-group{
+ .bp3-form-group {
width: 100%;
}
- }
- .tr:hover .td{
+ }
+ .tr:hover .td {
background: #f3f7fc;
}
- .tr.is-context-menu-active .td{
- background: #F3FAFC;
+ .tr.is-context-menu-active .td {
+ background: #f3fafc;
}
- .td.actions .#{$ns}-button{
- background: #E6EFFB;
+ .td.actions .#{$ns}-button {
+ background: #e6effb;
border: 0;
box-shadow: none;
padding: 5px 15px;
border-radius: 8px;
&:hover,
- &:focus{
- background-color: #CFDCEE;
+ &:focus {
+ background-color: #cfdcee;
}
- svg{
- color: #425361
+ svg {
+ color: #425361;
}
- .bp3-icon-more-h-16{
+ .bp3-icon-more-h-16 {
margin-top: 2px;
}
}
- .tr.no-results{
- .td{
+ .tr.no-results {
+ .td {
flex-direction: column;
padding: 20px;
color: #666;
@@ -183,14 +182,14 @@
}
}
- > .loading{
+ > .loading {
padding-top: 50px;
}
}
.tr .th,
- .tr .td{
- .expand-toggle{
+ .tr .td {
+ .expand-toggle {
cursor: pointer;
display: inline-block;
padding: 0 8px 0 0;
@@ -198,7 +197,7 @@
margin: auto 0;
margin-left: 4px;
- .arrow-right{
+ .arrow-right {
width: 0;
height: 0;
border-top: 5px solid transparent;
@@ -206,10 +205,10 @@
border-left: 8px solid #acacac;
display: block;
}
-
- .arrow-down{
- width: 0;
- height: 0;
+
+ .arrow-down {
+ width: 0;
+ height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 8px solid #acacac;
@@ -219,27 +218,25 @@
}
}
- .no-results{
+ .no-results {
color: #666;
- .td{
+ .td {
padding-top: 20px;
- padding-bottom: 20px;
+ padding-bottom: 20px;
width: 100%;
}
}
- &.has-sticky-header{
-
- .thead{
- .tr .th{
+ &.has-sticky-header {
+ .thead {
+ .tr .th {
position: sticky;
}
}
}
&.has-sticky {
-
.thead,
.tfoot {
position: sticky;
@@ -273,38 +270,10 @@
}
}
- &.has-virtualized-rows{
- .tbody{
+ &.has-virtualized-rows {
+ .tbody {
overflow-y: scroll;
overflow-x: hidden;
- }
- }
-
- &--financial-report{
-
- .table {
- .thead{
- .tr .th{
- background: transparent;
- border-top: 1px solid #666;
- border-bottom: 1px solid #666;
-
- padding: 8px 0.4rem;
- color: #222;
- }
- }
-
- .tbody{
- .tr .td{
- border-bottom: 0;
- }
- .tr:not(:first-child) .td{
- border-top: 1px dotted #CCC;
- }
- .tr:last-child .td{
- border-bottom: 1px dotted #CCC;
- }
- }
- }
+ }
}
}
diff --git a/client/src/style/components/DataTable/DataTableEditable.scss b/client/src/style/components/DataTable/DataTableEditable.scss
new file mode 100644
index 000000000..8517e4a18
--- /dev/null
+++ b/client/src/style/components/DataTable/DataTableEditable.scss
@@ -0,0 +1,207 @@
+.datatable-editor {
+ .bp3-form-group {
+ margin-bottom: 0;
+ }
+ .table {
+ border: 1px solid #d2dce2;
+ border-left: transparent;
+
+ .th,
+ .td {
+ border-left: 1px solid #e2e2e2;
+
+ &.index {
+ text-align: center;
+
+ span {
+ width: 100%;
+ font-weight: 500;
+ }
+ }
+ &:first-child {
+ border-left: 1px solid #d2dce2;
+ }
+ }
+
+ .thead {
+ .tr .th {
+ padding: 10px 10px;
+ background-color: #f0f2f8;
+ font-size: 14px;
+ font-weight: 500;
+ color: #1c1940;
+
+ &.index > div {
+ width: 100%;
+ }
+ }
+ }
+
+ .tbody {
+ .tr .td {
+ padding: 5px;
+ border-bottom: 0;
+ border-top: 1px dashed #aaa;
+ min-height: 42px;
+
+ &.index {
+ background-color: #f0f2f8;
+
+ > span {
+ margin-top: auto;
+ margin-bottom: auto;
+ }
+ }
+ }
+ .tr {
+ .bp3-form-group:not(.bp3-intent-danger) .bp3-input,
+ .form-group--select-list .bp3-button {
+ border-color: #ffffff;
+ color: #222;
+ border-radius: 3px;
+ }
+ .bp3-form-group:not(.bp3-intent-danger) .bp3-input {
+ border-radius: 2px;
+ padding-left: 4px;
+ padding-right: 4px;
+
+ &:focus {
+ box-shadow: 0 0 0 2px #116cd0;
+ }
+ }
+ .form-group--select-list .bp3-button {
+ padding-left: 6px;
+ padding-right: 6px;
+
+ &:after {
+ display: none;
+ }
+ }
+ .form-group--select-list,
+ .bp3-form-group {
+ &.bp3-intent-danger {
+ .bp3-button:not(.bp3-minimal),
+ .bp3-input {
+ border-color: #f7b6b6;
+ }
+ }
+ }
+
+ &:first-of-type {
+ .td {
+ border-top: 0;
+ }
+ }
+
+ &:last-of-type {
+ .td {
+ .bp3-button,
+ .bp3-input-group {
+ display: none;
+ }
+ }
+ }
+ .td.actions {
+ .bp3-button {
+ background-color: transparent;
+ color: #e66d6d;
+
+ &:hover {
+ color: #c23030;
+ }
+
+ svg {
+ color: inherit;
+ }
+ }
+ }
+ &.row--total {
+ .account.td,
+ .debit.td,
+ .credit.td {
+ > span {
+ padding-top: 2px;
+ }
+ }
+ .debit.td,
+ .credit.td {
+ > span {
+ font-weight: 600;
+ color: #444;
+ }
+ }
+ }
+ .td {
+ &.note {
+ .bp3-form-group {
+ width: 100%;
+ }
+ }
+ }
+ }
+ }
+ .th {
+ color: #444;
+ font-weight: 600;
+ border-bottom: 1px dotted #666;
+ }
+
+ .td {
+ border-bottom: 1px dotted #999;
+ }
+
+ .actions.td {
+ .bp3-button {
+ background: transparent;
+ margin: 0;
+ }
+ }
+ }
+
+ .table {
+ .tbody {
+ .tr .td.actions .bp3-button {
+ background-color: transparent;
+ color: #e66d6d;
+
+ svg {
+ color: inherit;
+ }
+ }
+ }
+ }
+
+ &__actions {
+ margin-top: 12px;
+
+ .bp3-button {
+ padding-left: 10px;
+ padding-right: 10px;
+ }
+
+ .button--clear-lines {
+ &.bp3-button:not([class*='bp3-intent-']):not(.bp3-minimal) {
+ background-color: #fcefef;
+ }
+ }
+ }
+
+ &.has-total-row {
+ .table .tbody-inner .tr:last-of-type {
+ .td {
+ border-top-width: 2px;
+ border-top-color: #e9e9ef;
+ border-top-style: solid;
+ min-height: 40px;
+
+ &:not(.index) {
+ background-color: #fcfcfd;
+ }
+
+ &.index span {
+ display: none;
+ }
+ }
+ }
+ }
+}
diff --git a/client/src/style/components/DataTable/DataTableEmptyStatus.scss b/client/src/style/components/DataTable/DataTableEmptyStatus.scss
new file mode 100644
index 000000000..97fbe7720
--- /dev/null
+++ b/client/src/style/components/DataTable/DataTableEmptyStatus.scss
@@ -0,0 +1,35 @@
+.datatable-empty-status {
+ max-width: 550px;
+ width: 100%;
+ margin: 0 auto;
+ text-align: center;
+ margin-top: 200px;
+
+ &__title {
+ font-size: 20px;
+ color: #2c3a5d;
+ font-weight: 600;
+ margin-left: auto;
+ margin-bottom: 10px;
+ margin-right: auto;
+ margin-top: 0;
+ line-height: 1.4;
+ }
+ &__desc {
+ font-size: 16px;
+ color: #1f3255;
+ opacity: 0.8;
+ line-height: 1.6;
+ }
+ &__actions {
+ margin-top: 26px;
+
+ .bp3-button {
+ min-height: 36px;
+
+ & + .bp3-button {
+ margin-left: 10px;
+ }
+ }
+ }
+}
diff --git a/client/src/style/components/pagination.scss b/client/src/style/components/DataTable/Pagination.scss
similarity index 99%
rename from client/src/style/components/pagination.scss
rename to client/src/style/components/DataTable/Pagination.scss
index fc193804e..e0eed1137 100644
--- a/client/src/style/components/pagination.scss
+++ b/client/src/style/components/DataTable/Pagination.scss
@@ -94,9 +94,7 @@
border-top-width: 4px;
margin-right: 6px;
}
- }
-
-
+ }
}
&__goto-control{
diff --git a/client/src/style/components/dialog.scss b/client/src/style/components/Dialog/Dialog.scss
similarity index 85%
rename from client/src/style/components/dialog.scss
rename to client/src/style/components/Dialog/Dialog.scss
index bbaa382dc..12558e9f7 100644
--- a/client/src/style/components/dialog.scss
+++ b/client/src/style/components/Dialog/Dialog.scss
@@ -1,3 +1,4 @@
+@import '../../Base.scss';
// Dialog
.#{$ns}-dialog{
diff --git a/client/src/style/components/Hint.scss b/client/src/style/components/Hint.scss
new file mode 100644
index 000000000..7e8de0e37
--- /dev/null
+++ b/client/src/style/components/Hint.scss
@@ -0,0 +1,16 @@
+.hint {
+ margin-left: 6px;
+ position: relative;
+ top: -1px;
+
+ .bp3-icon {
+ color: #a1b2c5;
+ }
+
+ .bp3-popover-target:hover .bp3-icon {
+ color: #90a1b5;
+ }
+ .bp3-icon {
+ vertical-align: middle;
+ }
+}
diff --git a/client/src/style/components/PageForm.scss b/client/src/style/components/PageForm.scss
new file mode 100644
index 000000000..435c686f2
--- /dev/null
+++ b/client/src/style/components/PageForm.scss
@@ -0,0 +1,49 @@
+// .page-form
+// > .page-form__header
+// > .page-form__content
+// > .page-form__floating-actions
+.page-form {
+ $self: '.page-form';
+ padding-bottom: 20px;
+
+ &__floating-actions {
+ position: fixed;
+ bottom: 0;
+ width: 100%;
+ background: #fff;
+ padding: 14px 18px;
+ border-top: 1px solid rgba(0, 0, 0, 0.05);
+ box-shadow: 0px -1px 4px 0px rgba(0, 0, 0, 0.05);
+ }
+ &--strip {
+ #{$self}__header-fields {
+ width: 85%;
+ }
+ #{$self}__body,
+ #{$self}__footer {
+ max-width: 1200px;
+ }
+
+ #{$self}__header {
+ background-color: #fbfbfb;
+ padding: 30px 20px 0;
+ border-bottom: 1px solid #d2dce2;
+
+ .bp3-form-group.bp3-inline label.bp3-label {
+ font-weight: 500;
+ }
+ }
+
+ #{$self}__body {
+ padding-top: 15px;
+ padding-left: 20px;
+ padding-right: 20px;
+ }
+
+ #{$self}__footer {
+ margin: 25px 0 0 0;
+ padding-left: 20px;
+ padding-right: 20px;
+ }
+ }
+}
diff --git a/client/src/style/components/Toast.scss b/client/src/style/components/Toast.scss
new file mode 100644
index 000000000..ff6a35d43
--- /dev/null
+++ b/client/src/style/components/Toast.scss
@@ -0,0 +1,3 @@
+.bp3-toast {
+ box-shadow: none;
+}
\ No newline at end of file
diff --git a/client/src/style/components/Tooltip.scss b/client/src/style/components/Tooltip.scss
new file mode 100644
index 000000000..c5082b849
--- /dev/null
+++ b/client/src/style/components/Tooltip.scss
@@ -0,0 +1,11 @@
+
+
+.pt-tooltip {
+ .pt-popover-content {
+ max-width: 100px;
+ }
+}
+
+.#{$ns}-tooltip {
+ box-shadow: none;
+}
diff --git a/client/src/style/components/dragzone.scss b/client/src/style/components/dragzone.scss
index 78d626829..a1c7ff0a5 100644
--- a/client/src/style/components/dragzone.scss
+++ b/client/src/style/components/dragzone.scss
@@ -1,30 +1,33 @@
-
-.dropzone{
+.dropzone {
flex: 1 1;
display: flex;
flex-direction: column;
align-items: center;
padding: 18px;
border-width: 1px;
- border-color: #AFAFAF;
+ border-color: #afafaf;
border-style: dashed;
color: #999;
outline: none;
- transition: border .24s ease-in-out;
+ transition: border 0.24s ease-in-out;
font-size: 14px;
- p{
+ p {
margin: auto;
}
}
-.dropzone-thumbs{
+.dropzone-container {
+ max-width: 250px;
+ margin-left: auto;
+}
+.dropzone-thumbs {
display: flex;
flex-direction: row;
margin-top: 15px;
}
-.dropzone-thumb{
+.dropzone-thumb {
position: relative;
display: inline-block;
border-radius: 2px;
@@ -34,14 +37,14 @@
width: 100px;
padding: 2px;
- img{
+ img {
display: block;
height: 100%;
width: auto;
max-width: 100%;
}
- button{
+ button {
height: 16px;
width: 16px;
color: #fff;
@@ -55,20 +58,20 @@
left: -5px;
visibility: hidden;
- .bp3-icon{
+ .bp3-icon {
position: relative;
top: -3px;
left: 0px;
}
}
- &:hover button{
+ &:hover button {
visibility: visible;
}
}
-.dropzone-hint{
+.dropzone-hint {
font-size: 12px;
margin-bottom: 6px;
color: #777;
-}
\ No newline at end of file
+}
diff --git a/client/src/style/views/Sidebar.scss b/client/src/style/containers/Dashboard/Sidebar.scss
similarity index 73%
rename from client/src/style/views/Sidebar.scss
rename to client/src/style/containers/Dashboard/Sidebar.scss
index 315cabe62..53b1d4e22 100644
--- a/client/src/style/views/Sidebar.scss
+++ b/client/src/style/containers/Dashboard/Sidebar.scss
@@ -1,14 +1,4 @@
-$sidebar-background: #01194e;
-$sidebar-text-color: #fff;
-$sidebar-width: 100%;
-$sidebar-menu-item-color: rgba(255, 255, 255, 0.9);
-$sidebar-menu-item-color-active: rgb(255, 255, 255);
-$sidebar-popover-submenu-bg: rgb(1, 20, 62);
-$sidebar-menu-label-color: rgba(255, 255, 255, 0.5);
-$sidebar-submenu-item-color: rgba(255, 255, 255, 0.6);
-$sidebar-submenu-item-hover-color: rgba(255, 255, 255, 0.85);
-$sidebar-logo-opacity: 0.55;
-$sidebar-submenu-item-bg-color: #01287d;
+@import 'src/style/Base.scss';
.sidebar {
background: $sidebar-background;
@@ -19,11 +9,11 @@ $sidebar-submenu-item-bg-color: #01287d;
.ScrollbarsCustom-Track {
&.ScrollbarsCustom-TrackY,
- &.ScrollbarsCustom-TrackX{
+ &.ScrollbarsCustom-TrackX {
background: rgba(0, 0, 0, 0);
}
}
- .ScrollbarsCustom-Thumb{
+ .ScrollbarsCustom-Thumb {
&.ScrollbarsCustom-ThumbX,
&.ScrollbarsCustom-ThumbY {
background: rgba(0, 0, 0, 0);
@@ -31,27 +21,29 @@ $sidebar-submenu-item-bg-color: #01287d;
}
&:hover {
- .ScrollbarsCustom-Thumb{
+ .ScrollbarsCustom-Thumb {
&.ScrollbarsCustom-ThumbX,
&.ScrollbarsCustom-ThumbY {
background: rgba(255, 255, 255, 0.25);
- }
- }
- }
- &__head{
- padding: 16px 12px;
-
- &-logo{
- position: relative;
- top: 2px;
-
- svg{
- opacity: $sidebar-logo-opacity;
}
}
}
+ &__head {
+ padding: 18px;
- &__scroll-wrapper{
+ &-logo {
+ position: relative;
+ top: 2px;
+
+ svg {
+ opacity: $sidebar-logo-opacity;
+ }
+ }
+ .sidebar__head-logo{
+ transition: transform 0.05s ease-in-out;
+ }
+ }
+ &__scroll-wrapper {
height: 100%;
}
@@ -78,7 +70,6 @@ $sidebar-submenu-item-bg-color: #01287d;
&:active {
background: #01143e;
}
-
> .#{$ns}-icon {
color: #767b9b;
margin-right: 16px;
@@ -89,22 +80,24 @@ $sidebar-submenu-item-bg-color: #01287d;
margin-top: 3px;
color: rgba(255, 255, 255, 0.25);
}
- &-labeler{
+ &-labeler {
display: block;
color: $sidebar-menu-label-color;
- font-size: 12px;
- padding: 6px 18px;
+ font-size: 11px;
+ padding: 8px 18px;
margin-top: 4px;
+ text-transform: uppercase;
+ font-weight: 500;
+ letter-spacing: 1px;
}
- &:hover .bp3-button.menu-item__add-btn{
+ &:hover .bp3-button.menu-item__add-btn {
display: inline-block;
}
}
.#{$ns}-submenu {
.#{$ns}-collapse {
-
&-body {
background-color: rgb(11, 34, 85);
padding-bottom: 6px;
@@ -120,7 +113,7 @@ $sidebar-submenu-item-bg-color: #01287d;
background: transparent;
color: $sidebar-submenu-item-hover-color;
}
- &.bp3-active{
+ &.bp3-active {
font-weight: 500;
}
}
@@ -137,26 +130,30 @@ $sidebar-submenu-item-bg-color: #01287d;
color: $sidebar-menu-item-color;
}
.#{$ns}-menu-divider {
- border-top-color: rgba(255, 255, 255, 0.15);
+ border-top-color: rgba(255, 255, 255, 0.1);
color: #6b708c;
margin: 4px 0;
}
- .#{$ns}-menu-spacer{
+ .#{$ns}-menu-spacer {
margin: 4px 0;
height: 1px;
}
}
- &--mini-sidebar{
+ &--mini-sidebar {
position: fixed;
white-space: nowrap;
width: 50px;
+ .sidebar__head{
+ .sidebar__head-logo{
+ transform: translate(-6px, 0);
+ }
+ }
// Hide text of bigcapital logo.
- .sidebar__head-logo{
-
- .bp3-icon-bigcapital{
- path{
+ .sidebar__head-logo {
+ .bp3-icon-bigcapital {
+ path {
transition: opacity 0.3s ease-in-out;
}
path:not(.path-1):not(.path-2) {
@@ -165,37 +162,38 @@ $sidebar-submenu-item-bg-color: #01287d;
}
}
- .sidebar__menu{
+ .sidebar__menu {
transition: opacity 0.3s ease-in-out;
opacity: 0;
}
- .sidebar__scroll-wrapper{
+ .sidebar__scroll-wrapper {
background: $sidebar-background;
transition: min-width 0.15s ease-in-out;
min-width: 50px;
- &:hover{
+ &:hover {
min-width: 190px;
- .sidebar__head-logo{
-
- .bp3-icon-bigcapital{
+ .sidebar__head-logo {
+ transform: translate(0px, 0);
+
+ .bp3-icon-bigcapital {
path:not(.path-1):not(.path-2) {
opacity: 1;
}
}
}
- .sidebar__menu{
+ .sidebar__menu {
opacity: 1;
}
- }
+ }
}
}
- .bp3-button.menu-item__add-btn{
+ .bp3-button.menu-item__add-btn {
width: auto;
-
+
padding: 2px;
margin-right: 0px;
position: relative;
@@ -204,28 +202,27 @@ $sidebar-submenu-item-bg-color: #01287d;
display: none;
vertical-align: top;
- &:not([class*="bp3-intent-"]):not(.bp3-minimal):not(:disabled){
-
- .bp3-icon{
+ &:not([class*='bp3-intent-']):not(.bp3-minimal):not(:disabled) {
+ .bp3-icon {
color: rgba(255, 255, 255, 0.4);
}
&,
- &:hover{
+ &:hover {
min-height: auto;
min-width: auto;
outline: 0;
background-color: transparent;
}
- &:hover{
+ &:hover {
background-color: rgba(255, 255, 255, 0.12);
- .bp3-icon{
+ .bp3-icon {
color: rgba(255, 255, 255, 0.6);
}
}
}
- .bp3-icon{
+ .bp3-icon {
margin: 0;
display: block;
}
diff --git a/client/src/style/containers/FinancialStatements/DrawerHeader.scss b/client/src/style/containers/FinancialStatements/DrawerHeader.scss
new file mode 100644
index 000000000..2c8beb92f
--- /dev/null
+++ b/client/src/style/containers/FinancialStatements/DrawerHeader.scss
@@ -0,0 +1,126 @@
+//
+// Financial sheet - Drawer header.
+// --------------------
+.financial-header-drawer {
+ padding: 25px 26px 25px;
+ position: absolute;
+ top: 101px;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ overflow: hidden;
+
+ &.is-hidden {
+ visibility: hidden;
+ }
+ .row {
+ .col {
+ max-width: 400px;
+ min-width: 250px;
+ }
+ }
+
+ .bp3-drawer {
+ box-shadow: 0 0 0 transparent;
+ max-height: 550px;
+ height: 100%;
+ padding-bottom: 49px;
+
+ > form {
+ display: flex;
+ flex-direction: column;
+ flex: 1 0 0;
+ height: 100%;
+ }
+ .bp3-drawer-backdrop {
+ background-color: rgba(2, 9, 19, 0.65);
+ }
+ }
+
+ .bp3-form-group {
+ margin-bottom: 22px;
+
+ label.bp3-label {
+ margin-bottom: 6px;
+ }
+ }
+
+ .bp3-button.button--submit-filter {
+ min-height: 34px;
+ padding-left: 16px;
+ padding-right: 16px;
+ }
+ .radio-group---accounting-basis {
+ .bp3-label {
+ margin-bottom: 12px;
+ }
+ }
+
+ .bp3-tabs {
+ height: 100%;
+
+ &.bp3-vertical > .bp3-tab-panel {
+ flex: 1 0 0;
+ border-top: 24px solid transparent;
+ padding-left: 20px;
+ padding-right: 20px;
+ padding-bottom: 24px;
+ overflow: auto;
+ }
+ }
+
+ .bp3-tabs.bp3-vertical {
+ flex: 1 0 0;
+
+ .bp3-tab-list {
+ width: 220px;
+ border-right: 1px solid #c3cdd5;
+ padding-top: 10px;
+
+ > *:not(:last-child) {
+ margin-right: 0;
+ }
+ .bp3-tab-indicator-wrapper {
+ width: 100%;
+
+ .bp3-tab-indicator {
+ border-left: 3px solid #0350f8;
+ background-color: #edf5ff;
+ border-radius: 0;
+ }
+ }
+
+ .bp3-tab {
+ color: #333;
+ line-height: 45px;
+ border-radius: 0;
+ padding-left: 14px;
+ padding-right: 14px;
+ font-weight: 500;
+ }
+ }
+ }
+
+ .bp3-tab-panel {
+ }
+
+ &__footer {
+ background-color: #ecf0f3;
+ border-top: 1px solid #c3cdd5;
+ padding: 8px;
+ padding-left: 230px;
+ position: absolute;
+ bottom: 0;
+ width: 100%;
+ }
+
+ .row {
+ margin-left: -0.85rem;
+ margin-right: -0.85rem;
+
+ .col {
+ padding-left: 0.85rem;
+ padding-right: 0.85rem;
+ }
+ }
+}
diff --git a/client/src/style/containers/FinancialStatements/FinancialSheet.scss b/client/src/style/containers/FinancialStatements/FinancialSheet.scss
new file mode 100644
index 000000000..b2bf7c1e4
--- /dev/null
+++ b/client/src/style/containers/FinancialStatements/FinancialSheet.scss
@@ -0,0 +1,113 @@
+// Financial sheet.
+// -----------------------
+.financial-sheet {
+ border: 2px solid #f0f0f0;
+ border-radius: 10px;
+ min-width: 640px;
+ width: auto;
+ padding: 30px 18px;
+ max-width: 100%;
+ margin: 35px auto;
+ min-height: 400px;
+ display: flex;
+ flex-direction: column;
+ background: #fff;
+
+ &__title {
+ margin: 0;
+ font-weight: 400;
+ font-size: 20px;
+ color: #464646;
+ text-align: center;
+ }
+ &__sheet-type {
+ text-align: center;
+ margin: 0;
+ font-size: 16px;
+ font-weight: 400;
+ color: #666;
+ margin-top: 6px;
+ }
+ &__date {
+ text-align: center;
+ color: #666;
+ margin-top: 6px;
+ }
+ &__table {
+ margin-top: 24px;
+
+ .table {
+ .tbody,
+ .thead {
+ .tr .td,
+ .tr .th {
+ background: #fff;
+ }
+ }
+
+ .tr.no-results {
+ .td {
+ flex-direction: column;
+ padding: 20px;
+ color: #666;
+ align-items: center;
+ }
+ }
+ }
+ }
+ &__inner {
+ &.is-loading {
+ display: none;
+ }
+ }
+ &__basis {
+ color: #888;
+ text-align: center;
+ margin-top: auto;
+ padding-top: 18px;
+ font-size: 13px;
+ }
+ .dashboard__loading-indicator {
+ margin: auto;
+ padding: 0;
+ }
+ &--expended {
+ width: auto;
+ }
+
+ &--minimal {
+ border: 0;
+ padding: 0;
+ margin-top: 20px;
+
+ .financial-sheet {
+ &__title {
+ font-size: 18px;
+ color: #333;
+ }
+ &__title + .financial-sheet__date {
+ margin-top: 8px;
+ }
+ &__table {
+ margin-top: 20px;
+ }
+ }
+ }
+ &.is-full-width {
+ width: 100%;
+ margin-top: 25px;
+ }
+}
+
+.financial-statement {
+ &__header {
+ }
+
+ &__body {
+ padding-left: 15px;
+ padding-right: 15px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ }
+}
diff --git a/client/src/style/functions.scss b/client/src/style/functions.scss
index 0f3211afd..50d4e4497 100644
--- a/client/src/style/functions.scss
+++ b/client/src/style/functions.scss
@@ -22,7 +22,6 @@ $escaped-characters: (
@if $index {
@return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
}
-
@return $string;
}
diff --git a/client/src/style/objects/Bigcapital.scss b/client/src/style/objects/Bigcapital.scss
new file mode 100644
index 000000000..f2e3fd99a
--- /dev/null
+++ b/client/src/style/objects/Bigcapital.scss
@@ -0,0 +1,19 @@
+[data-icon='bigcapital'] {
+ path {
+ fill: #004dd0;
+ }
+ .path-1,
+ .path-13 {
+ fill: #4f5861;
+ }
+}
+
+.bigcapital--alt {
+ svg {
+ path,
+ .path-13,
+ .path-1 {
+ fill: #fff;
+ }
+ }
+}
diff --git a/client/src/style/objects/buttons.scss b/client/src/style/objects/buttons.scss
index 2580ae63d..5354f8f59 100644
--- a/client/src/style/objects/buttons.scss
+++ b/client/src/style/objects/buttons.scss
@@ -1,91 +1,81 @@
-
-.form-group--select-list{
-
- .bp3-popover-target{
-
- .bp3-icon{
+.form-group--select-list {
+ .bp3-popover-target {
+ .bp3-icon {
position: absolute;
top: 0;
left: 0;
margin: 7px;
- + .bp3-button-text{
+ + .bp3-button-text {
padding-left: 20px;
}
}
- .bp3-button{
+ .bp3-button {
padding-left: 10px;
color: #333;
}
}
}
-.form-group--select-list{
-
- .bp3-popover-open{
- .bp3-button{
-
+.form-group--select-list {
+ .bp3-popover-open {
+ .bp3-button {
border-color: #80bdff;
}
}
}
-.bp3-button{
+.bp3-button {
min-width: 32px;
min-height: 32px;
padding-left: 12px;
padding-right: 12px;
}
-
-.bp3-button:not([class*="bp3-intent-"]):not(.bp3-minimal){
+.bp3-button:not([class*='bp3-intent-']):not(.bp3-minimal) {
color: #555555;
box-shadow: 0 0 0 transparent;
- &.bp3-small{
+ &.bp3-small {
font-size: 13px;
min-height: 29px;
}
- .form-group--select-list &{
+ .form-group--select-list & {
border-radius: 2px;
&,
- &:hover{
- box-shadow: 0 0 0 transparent;
+ &:hover {
+ box-shadow: 0 0 0 transparent;
border: 1px solid #ced4da;
-
+
&:not(:disabled) {
- background: #fff;
+ background: #fff;
}
- }
+ }
}
- .form-group--select-list.bp3-intent-danger &{
-
- &{
+ .form-group--select-list.bp3-intent-danger & {
+ & {
border-color: #db3737;
}
}
}
-.bp3-button-group.bp3-minimal .bp3-button{
+.bp3-button-group.bp3-minimal .bp3-button {
background-color: transparent;
}
-.bp3-button{
-
+.bp3-button {
&.bp3-intent-primary,
&.bp3-intent-success,
&.bp3-intent-danger,
- &.bp3-intent-warning{
-
+ &.bp3-intent-warning {
&,
- &:hover{
+ &:hover {
box-shadow: 0 0 0 transparent;
- }
+ }
}
}
-.button--secondary{
-
-}
\ No newline at end of file
+.button--secondary {
+}
diff --git a/client/src/style/objects/form.scss b/client/src/style/objects/form.scss
index 0455fe7d4..09f973a51 100644
--- a/client/src/style/objects/form.scss
+++ b/client/src/style/objects/form.scss
@@ -1,10 +1,6 @@
-$form-check-input-checked-color: #fff;
-$form-check-input-checked-bg-color: $blue1;
-$form-check-input-checked-bg-image: url("data:image/svg+xml,
") !default;
-$form-check-input-indeterminate-bg-image: url("data:image/svg+xml,
") !default;
-.form{
- &__floating-footer{
+.form {
+ &__floating-footer {
position: fixed;
bottom: 0;
width: 100%;
@@ -12,30 +8,30 @@ $form-check-input-indeterminate-bg-image: url("data:image/svg+xml,