From 7fbd51cb7eb79751e384a58bbb2420ae2421e1f3 Mon Sep 17 00:00:00 2001 From: Rafael Taranto Date: Thu, 8 May 2025 21:24:46 +0100 Subject: [PATCH] partial: last batch of components --- new-lamassu-admin/package-lock.json | 237 ++---------------- new-lamassu-admin/package.json | 1 - new-lamassu-admin/src/App.jsx | 21 +- .../src/components/buttons/ActionButton.jsx | 24 +- .../buttons/ActionButton.module.css | 143 +++++++++++ .../components/buttons/ActionButton.styles.js | 127 ---------- .../src/components/buttons/AddButton.jsx | 39 +-- .../components/buttons/AddButton.module.css | 30 +++ .../src/components/buttons/Button.jsx | 40 +-- .../src/components/buttons/Button.module.css | 49 ++++ .../src/components/buttons/Button.styles.js | 79 ------ .../src/components/buttons/DeleteButton.jsx | 53 ---- .../src/components/buttons/FeatureButton.jsx | 46 +--- .../buttons/FeatureButton.module.css | 87 +++++++ .../src/components/buttons/IDButton.jsx | 63 +---- .../components/buttons/IDButton.module.css | 58 +++++ .../src/components/buttons/Link.jsx | 6 +- .../src/components/buttons/Link.module.css | 47 ++++ .../src/components/buttons/Link.styles.js | 47 ---- .../src/components/buttons/SubpageButton.jsx | 12 +- .../buttons/SubpageButton.module.css | 51 ++++ .../src/components/buttons/index.js | 4 +- .../components/date-range-picker/Calendar.jsx | 68 +---- .../date-range-picker/Calendar.module.css | 66 +++++ .../src/components/date-range-picker/Tile.jsx | 65 +---- .../date-range-picker/Tile.module.css | 53 ++++ .../src/components/editableTable/Row.jsx | 42 ++-- .../components/editableTable/Row.module.css | 29 +++ .../components/editableTable/Row.styles.js | 45 ---- .../src/components/editableTable/Table.jsx | 9 +- .../components/editableTable/Table.module.css | 16 ++ .../components/editableTable/Table.styles.js | 21 -- .../src/components/fake-table/Table.jsx | 20 +- .../components/fake-table/Table.module.css | 22 +- .../src/components/inputs/base/TextInput.jsx | 19 +- .../inputs/base/TextInput.module.css | 18 +- .../src/components/inputs/cashbox/Cashbox.jsx | 60 ++--- .../inputs/cashbox/Cashbox.module.css | 52 ++++ .../inputs/cashbox/Cashbox.styles.js | 85 ------- .../src/components/table/TableHeader.jsx | 28 +-- .../src/pages/Blacklist/Blacklist.jsx | 6 - .../src/pages/Customers/CustomerProfile.jsx | 3 - .../sections/FiatBalanceAlerts.jsx | 12 +- 43 files changed, 855 insertions(+), 1148 deletions(-) create mode 100644 new-lamassu-admin/src/components/buttons/ActionButton.module.css delete mode 100644 new-lamassu-admin/src/components/buttons/ActionButton.styles.js create mode 100644 new-lamassu-admin/src/components/buttons/AddButton.module.css create mode 100644 new-lamassu-admin/src/components/buttons/Button.module.css delete mode 100644 new-lamassu-admin/src/components/buttons/Button.styles.js delete mode 100644 new-lamassu-admin/src/components/buttons/DeleteButton.jsx create mode 100644 new-lamassu-admin/src/components/buttons/FeatureButton.module.css create mode 100644 new-lamassu-admin/src/components/buttons/IDButton.module.css create mode 100644 new-lamassu-admin/src/components/buttons/Link.module.css delete mode 100644 new-lamassu-admin/src/components/buttons/Link.styles.js create mode 100644 new-lamassu-admin/src/components/buttons/SubpageButton.module.css create mode 100644 new-lamassu-admin/src/components/date-range-picker/Calendar.module.css create mode 100644 new-lamassu-admin/src/components/date-range-picker/Tile.module.css create mode 100644 new-lamassu-admin/src/components/editableTable/Row.module.css delete mode 100644 new-lamassu-admin/src/components/editableTable/Row.styles.js create mode 100644 new-lamassu-admin/src/components/editableTable/Table.module.css delete mode 100644 new-lamassu-admin/src/components/editableTable/Table.styles.js create mode 100644 new-lamassu-admin/src/components/inputs/cashbox/Cashbox.module.css delete mode 100644 new-lamassu-admin/src/components/inputs/cashbox/Cashbox.styles.js diff --git a/new-lamassu-admin/package-lock.json b/new-lamassu-admin/package-lock.json index 28868ab9..b3374115 100644 --- a/new-lamassu-admin/package-lock.json +++ b/new-lamassu-admin/package-lock.json @@ -15,7 +15,6 @@ "@lamassu/coins": "v1.6.1", "@mui/icons-material": "^5.17.1", "@mui/material": "^5.17.1", - "@mui/styles": "^5.17.1", "@simplewebauthn/browser": "^3.0.0", "apollo-upload-client": "^18.0.0", "bignumber.js": "9.0.0", @@ -503,12 +502,6 @@ "stylis": "4.2.0" } }, - "node_modules/@emotion/babel-plugin/node_modules/@emotion/hash": { - "version": "0.9.2", - "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.2.tgz", - "integrity": "sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g==", - "license": "MIT" - }, "node_modules/@emotion/babel-plugin/node_modules/convert-source-map": { "version": "1.9.0", "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.9.0.tgz", @@ -528,6 +521,12 @@ "stylis": "4.2.0" } }, + "node_modules/@emotion/hash": { + "version": "0.9.2", + "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.2.tgz", + "integrity": "sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g==", + "license": "MIT" + }, "node_modules/@emotion/is-prop-valid": { "version": "1.3.1", "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.3.1.tgz", @@ -580,18 +579,6 @@ "csstype": "^3.0.2" } }, - "node_modules/@emotion/serialize/node_modules/@emotion/hash": { - "version": "0.9.2", - "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.2.tgz", - "integrity": "sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g==", - "license": "MIT" - }, - "node_modules/@emotion/serialize/node_modules/csstype": { - "version": "3.1.3", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", - "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==", - "license": "MIT" - }, "node_modules/@emotion/sheet": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.4.0.tgz", @@ -1491,18 +1478,6 @@ "node": ">=6" } }, - "node_modules/@mui/material/node_modules/csstype": { - "version": "3.1.3", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", - "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==", - "license": "MIT" - }, - "node_modules/@mui/material/node_modules/react-is": { - "version": "19.1.0", - "resolved": "https://registry.npmjs.org/react-is/-/react-is-19.1.0.tgz", - "integrity": "sha512-Oe56aUPnkHyyDxxkvqtd7KkdQP5uIUfHxd5XTb3wE9d/kRnZLmKbDB0GWk919tdQ+mxxPtG6EAs6RMT6i1qtHg==", - "license": "MIT" - }, "node_modules/@mui/private-theming": { "version": "5.17.1", "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-5.17.1.tgz", @@ -1562,75 +1537,6 @@ } } }, - "node_modules/@mui/styled-engine/node_modules/csstype": { - "version": "3.1.3", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", - "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==", - "license": "MIT" - }, - "node_modules/@mui/styles": { - "version": "5.17.1", - "resolved": "https://registry.npmjs.org/@mui/styles/-/styles-5.17.1.tgz", - "integrity": "sha512-GxNtcD1jXjj1i81vyuaeNxCpph/ApxSxgJ+G8A2jUY5/bMOxXSmgUdupbB0JLexsDIqmaSqTePVN0jnMZc1iZQ==", - "deprecated": "Deprecated, check the migration instruction in https://mui.com/material-ui/migration/migrating-from-jss/", - "license": "MIT", - "dependencies": { - "@babel/runtime": "^7.23.9", - "@emotion/hash": "^0.9.1", - "@mui/private-theming": "^5.17.1", - "@mui/types": "~7.2.15", - "@mui/utils": "^5.17.1", - "clsx": "^2.1.0", - "csstype": "^3.1.3", - "hoist-non-react-statics": "^3.3.2", - "jss": "^10.10.0", - "jss-plugin-camel-case": "^10.10.0", - "jss-plugin-default-unit": "^10.10.0", - "jss-plugin-global": "^10.10.0", - "jss-plugin-nested": "^10.10.0", - "jss-plugin-props-sort": "^10.10.0", - "jss-plugin-rule-value-function": "^10.10.0", - "jss-plugin-vendor-prefixer": "^10.10.0", - "prop-types": "^15.8.1" - }, - "engines": { - "node": ">=12.0.0" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/mui-org" - }, - "peerDependencies": { - "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", - "react": "^17.0.0 || ^18.0.0 || ^19.0.0" - }, - "peerDependenciesMeta": { - "@types/react": { - "optional": true - } - } - }, - "node_modules/@mui/styles/node_modules/@emotion/hash": { - "version": "0.9.2", - "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.2.tgz", - "integrity": "sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g==", - "license": "MIT" - }, - "node_modules/@mui/styles/node_modules/clsx": { - "version": "2.1.1", - "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz", - "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==", - "license": "MIT", - "engines": { - "node": ">=6" - } - }, - "node_modules/@mui/styles/node_modules/csstype": { - "version": "3.1.3", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", - "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==", - "license": "MIT" - }, "node_modules/@mui/system": { "version": "5.17.1", "resolved": "https://registry.npmjs.org/@mui/system/-/system-5.17.1.tgz", @@ -1680,12 +1586,6 @@ "node": ">=6" } }, - "node_modules/@mui/system/node_modules/csstype": { - "version": "3.1.3", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", - "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==", - "license": "MIT" - }, "node_modules/@mui/types": { "version": "7.2.24", "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.2.24.tgz", @@ -1739,12 +1639,6 @@ "node": ">=6" } }, - "node_modules/@mui/utils/node_modules/react-is": { - "version": "19.1.0", - "resolved": "https://registry.npmjs.org/react-is/-/react-is-19.1.0.tgz", - "integrity": "sha512-Oe56aUPnkHyyDxxkvqtd7KkdQP5uIUfHxd5XTb3wE9d/kRnZLmKbDB0GWk919tdQ+mxxPtG6EAs6RMT6i1qtHg==", - "license": "MIT" - }, "node_modules/@parcel/watcher": { "version": "2.5.1", "resolved": "https://registry.npmjs.org/@parcel/watcher/-/watcher-2.5.1.tgz", @@ -3177,13 +3071,6 @@ "@types/react": "*" } }, - "node_modules/@types/react/node_modules/csstype": { - "version": "3.1.3", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", - "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==", - "license": "MIT", - "peer": true - }, "node_modules/@types/scheduler": { "version": "0.16.8", "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.8.tgz", @@ -4281,15 +4168,11 @@ "integrity": "sha512-DIT51nX0dCfKltpRiXV+/TVZq+Qq2NgF4644+K7Ttnla7zEzqc+kjJyiB96BHNyUTBxyjzRcZYpUdZa+QAqi6Q==", "license": "MIT" }, - "node_modules/css-vendor": { - "version": "2.0.8", - "resolved": "https://registry.npmjs.org/css-vendor/-/css-vendor-2.0.8.tgz", - "integrity": "sha512-x9Aq0XTInxrkuFeHKbYC7zWY8ai7qJ04Kxd9MnvbC1uO5DagxoHQjm4JvG+vCdXOoFtCjbL2XSZfxmoYa9uQVQ==", - "license": "MIT", - "dependencies": { - "@babel/runtime": "^7.8.3", - "is-in-browser": "^1.0.2" - } + "node_modules/csstype": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", + "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==", + "license": "MIT" }, "node_modules/d3": { "version": "6.7.0", @@ -4791,12 +4674,6 @@ "csstype": "^3.0.2" } }, - "node_modules/dom-helpers/node_modules/csstype": { - "version": "3.1.3", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", - "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==", - "license": "MIT" - }, "node_modules/dot-case": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/dot-case/-/dot-case-3.0.4.tgz", @@ -6162,12 +6039,6 @@ "node": ">=16.17.0" } }, - "node_modules/hyphenate-style-name": { - "version": "1.1.0", - "resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.1.0.tgz", - "integrity": "sha512-WDC/ui2VVRrz3jOVi+XtjqkDjiVjTtFaAGiW37k6b+ohyQ5wYDOGkvCZa8+H0nx3gyvv0+BST9xuOgIyGQ00gw==", - "license": "BSD-3-Clause" - }, "node_modules/iconv-lite": { "version": "0.4.24", "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz", @@ -6851,27 +6722,6 @@ "url": "https://opencollective.com/jss" } }, - "node_modules/jss-plugin-camel-case": { - "version": "10.10.0", - "resolved": "https://registry.npmjs.org/jss-plugin-camel-case/-/jss-plugin-camel-case-10.10.0.tgz", - "integrity": "sha512-z+HETfj5IYgFxh1wJnUAU8jByI48ED+v0fuTuhKrPR+pRBYS2EDwbusU8aFOpCdYhtRc9zhN+PJ7iNE8pAWyPw==", - "license": "MIT", - "dependencies": { - "@babel/runtime": "^7.3.1", - "hyphenate-style-name": "^1.0.3", - "jss": "10.10.0" - } - }, - "node_modules/jss-plugin-default-unit": { - "version": "10.10.0", - "resolved": "https://registry.npmjs.org/jss-plugin-default-unit/-/jss-plugin-default-unit-10.10.0.tgz", - "integrity": "sha512-SvpajxIECi4JDUbGLefvNckmI+c2VWmP43qnEy/0eiwzRUsafg5DVSIWSzZe4d2vFX1u9nRDP46WCFV/PXVBGQ==", - "license": "MIT", - "dependencies": { - "@babel/runtime": "^7.3.1", - "jss": "10.10.0" - } - }, "node_modules/jss-plugin-extend": { "version": "10.10.0", "resolved": "https://registry.npmjs.org/jss-plugin-extend/-/jss-plugin-extend-10.10.0.tgz", @@ -6883,65 +6733,6 @@ "tiny-warning": "^1.0.2" } }, - "node_modules/jss-plugin-global": { - "version": "10.10.0", - "resolved": "https://registry.npmjs.org/jss-plugin-global/-/jss-plugin-global-10.10.0.tgz", - "integrity": "sha512-icXEYbMufiNuWfuazLeN+BNJO16Ge88OcXU5ZDC2vLqElmMybA31Wi7lZ3lf+vgufRocvPj8443irhYRgWxP+A==", - "license": "MIT", - "dependencies": { - "@babel/runtime": "^7.3.1", - "jss": "10.10.0" - } - }, - "node_modules/jss-plugin-nested": { - "version": "10.10.0", - "resolved": "https://registry.npmjs.org/jss-plugin-nested/-/jss-plugin-nested-10.10.0.tgz", - "integrity": "sha512-9R4JHxxGgiZhurDo3q7LdIiDEgtA1bTGzAbhSPyIOWb7ZubrjQe8acwhEQ6OEKydzpl8XHMtTnEwHXCARLYqYA==", - "license": "MIT", - "dependencies": { - "@babel/runtime": "^7.3.1", - "jss": "10.10.0", - "tiny-warning": "^1.0.2" - } - }, - "node_modules/jss-plugin-props-sort": { - "version": "10.10.0", - "resolved": "https://registry.npmjs.org/jss-plugin-props-sort/-/jss-plugin-props-sort-10.10.0.tgz", - "integrity": "sha512-5VNJvQJbnq/vRfje6uZLe/FyaOpzP/IH1LP+0fr88QamVrGJa0hpRRyAa0ea4U/3LcorJfBFVyC4yN2QC73lJg==", - "license": "MIT", - "dependencies": { - "@babel/runtime": "^7.3.1", - "jss": "10.10.0" - } - }, - "node_modules/jss-plugin-rule-value-function": { - "version": "10.10.0", - "resolved": "https://registry.npmjs.org/jss-plugin-rule-value-function/-/jss-plugin-rule-value-function-10.10.0.tgz", - "integrity": "sha512-uEFJFgaCtkXeIPgki8ICw3Y7VMkL9GEan6SqmT9tqpwM+/t+hxfMUdU4wQ0MtOiMNWhwnckBV0IebrKcZM9C0g==", - "license": "MIT", - "dependencies": { - "@babel/runtime": "^7.3.1", - "jss": "10.10.0", - "tiny-warning": "^1.0.2" - } - }, - "node_modules/jss-plugin-vendor-prefixer": { - "version": "10.10.0", - "resolved": "https://registry.npmjs.org/jss-plugin-vendor-prefixer/-/jss-plugin-vendor-prefixer-10.10.0.tgz", - "integrity": "sha512-UY/41WumgjW8r1qMCO8l1ARg7NHnfRVWRhZ2E2m0DMYsr2DD91qIXLyNhiX83hHswR7Wm4D+oDYNC1zWCJWtqg==", - "license": "MIT", - "dependencies": { - "@babel/runtime": "^7.3.1", - "css-vendor": "^2.0.8", - "jss": "10.10.0" - } - }, - "node_modules/jss/node_modules/csstype": { - "version": "3.1.3", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", - "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==", - "license": "MIT" - }, "node_modules/jsx-ast-utils": { "version": "3.3.5", "resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-3.3.5.tgz", @@ -8326,6 +8117,12 @@ "integrity": "sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw==", "license": "MIT" }, + "node_modules/react-is": { + "version": "19.1.0", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-19.1.0.tgz", + "integrity": "sha512-Oe56aUPnkHyyDxxkvqtd7KkdQP5uIUfHxd5XTb3wE9d/kRnZLmKbDB0GWk919tdQ+mxxPtG6EAs6RMT6i1qtHg==", + "license": "MIT" + }, "node_modules/react-lifecycles-compat": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz", diff --git a/new-lamassu-admin/package.json b/new-lamassu-admin/package.json index 316c7efd..f45a84fe 100644 --- a/new-lamassu-admin/package.json +++ b/new-lamassu-admin/package.json @@ -10,7 +10,6 @@ "@lamassu/coins": "v1.6.1", "@mui/icons-material": "^5.17.1", "@mui/material": "^5.17.1", - "@mui/styles": "^5.17.1", "@simplewebauthn/browser": "^3.0.0", "apollo-upload-client": "^18.0.0", "bignumber.js": "9.0.0", diff --git a/new-lamassu-admin/src/App.jsx b/new-lamassu-admin/src/App.jsx index 3241615b..be9df1a0 100644 --- a/new-lamassu-admin/src/App.jsx +++ b/new-lamassu-admin/src/App.jsx @@ -1,8 +1,5 @@ import CssBaseline from '@mui/material/CssBaseline' -import { StylesProvider, jssPreset } from '@mui/styles' import { ThemeProvider, StyledEngineProvider } from '@mui/material/styles' -import { create } from 'jss' -import extendJss from 'jss-plugin-extend' import React, { useState } from 'react' import { BrowserRouter as Router } from 'react-router-dom' import ApolloProvider from 'src/utils/apollo' @@ -13,10 +10,6 @@ import theme from 'src/styling/theme' import Main from './Main' import './styling/global/global.css' -const jss = create({ - plugins: [extendJss(), ...jssPreset().plugins] -}) - const App = () => { const [wizardTested, setWizardTested] = useState(false) const [userData, setUserData] = useState(null) @@ -32,14 +25,12 @@ const App = () => { value={{ wizardTested, setWizardTested, userData, setUserData, setRole }}> - - - - -
- - - + + + +
+ + diff --git a/new-lamassu-admin/src/components/buttons/ActionButton.jsx b/new-lamassu-admin/src/components/buttons/ActionButton.jsx index 36eba7cf..ca81fc72 100644 --- a/new-lamassu-admin/src/components/buttons/ActionButton.jsx +++ b/new-lamassu-admin/src/components/buttons/ActionButton.jsx @@ -1,35 +1,31 @@ -import { makeStyles } from '@mui/styles' import classnames from 'classnames' import React, { memo } from 'react' -import styles from './ActionButton.styles' - -const useStyles = makeStyles(styles) +import moduleStyles from './ActionButton.module.css' const ActionButton = memo( ({ className, Icon, InverseIcon, color, center, children, ...props }) => { - const classes = useStyles() const classNames = { - [classes.actionButton]: true, - [classes.primary]: color === 'primary', - [classes.secondary]: color === 'secondary', - [classes.spring]: color === 'spring', - [classes.tomato]: color === 'tomato', - [classes.center]: center + [moduleStyles.actionButton]: true, + [moduleStyles.primary]: color === 'primary', + [moduleStyles.secondary]: color === 'secondary', + [moduleStyles.spring]: color === 'spring', + [moduleStyles.tomato]: color === 'tomato', + [moduleStyles.center]: center } return ( diff --git a/new-lamassu-admin/src/components/buttons/Button.module.css b/new-lamassu-admin/src/components/buttons/Button.module.css new file mode 100644 index 00000000..be15b02e --- /dev/null +++ b/new-lamassu-admin/src/components/buttons/Button.module.css @@ -0,0 +1,49 @@ +.button { + composes: h3 from '../typography/typography.module.css'; + border: none; + cursor: pointer; + outline: 0; + font-weight: 900; + background-color: var(--spring); + height: 40px; + padding: 0 20px; + border-radius: 10px; + box-shadow: 0 3px var(--spring4); +} + +.buttonXl { + composes: h1 from '../typography/typography.module.css'; + height: 61px; + border-radius: 15px +} + +.buttonSm { + height: 32px; + padding: 0 16px; + border-radius: 8px +} + +.button:disabled { + background-color: var(--dust); + box-shadow: none; +} + +.button:disabled:hover { + background-color: var(--dust); + box-shadow: none; +} + +.button:disabled:active { + margin-top: 0; +} + +.button:hover { + background-color: var(--spring2); + box-shadow: 0 3px var(--spring4); +} + +.button:active { + margin-top: 2px; + background-color: var(--spring2); + box-shadow: 0 2px var(--spring4); +} \ No newline at end of file diff --git a/new-lamassu-admin/src/components/buttons/Button.styles.js b/new-lamassu-admin/src/components/buttons/Button.styles.js deleted file mode 100644 index 157c37a1..00000000 --- a/new-lamassu-admin/src/components/buttons/Button.styles.js +++ /dev/null @@ -1,79 +0,0 @@ -import typographyStyles from 'src/components/typography/styles' -import { - white, - disabledColor, - secondaryColor, - secondaryColorDark, - secondaryColorDarker, - offColor, - offDarkColor, - offDarkerColor, - spacer -} from 'src/styling/variables' - -const { h1, h3 } = typographyStyles - -const pickSize = size => { - switch (size) { - case 'xl': - return spacer * 7.625 - case 'sm': - return spacer * 4 - case 'lg': - default: - return spacer * 5 - } -} - -export default { - wrapper: ({ size }) => { - const height = pickSize(size) - const shadowSize = height / 12 - return { height: height + shadowSize / 2 } - }, - button: ({ size, backgroundColor }) => { - const height = pickSize(size) - const shadowSize = size === 'xl' ? 3 : height / 12 - const padding = size === 'xl' ? 20 : height / 2 - const isGrey = backgroundColor === 'grey' - - return { - extend: size === 'xl' ? h1 : h3, - border: 'none', - color: white, - cursor: 'pointer', - fontWeight: 900, - outline: 0, - backgroundColor: isGrey ? offDarkColor : secondaryColor, - '&:disabled': { - backgroundColor: disabledColor, - boxShadow: 'none', - '&:hover': { - backgroundColor: disabledColor, - boxShadow: 'none' - }, - '&:active': { - marginTop: 0 - } - }, - shadowSize, - height, - padding: `0 ${padding}px`, - borderRadius: height / 4, - boxShadow: `0 ${shadowSize}px ${isGrey ? offColor : secondaryColorDark}`, - '&:hover': { - backgroundColor: isGrey ? offColor : secondaryColorDark, - boxShadow: `0 ${shadowSize}px ${ - isGrey ? offDarkerColor : secondaryColorDarker - }` - }, - '&:active': { - marginTop: shadowSize / 2, - backgroundColor: isGrey ? offDarkColor : secondaryColorDark, - boxShadow: `0 ${shadowSize / 2}px ${ - isGrey ? offDarkerColor : secondaryColorDarker - }` - } - } - } -} diff --git a/new-lamassu-admin/src/components/buttons/DeleteButton.jsx b/new-lamassu-admin/src/components/buttons/DeleteButton.jsx deleted file mode 100644 index 3c2f56f6..00000000 --- a/new-lamassu-admin/src/components/buttons/DeleteButton.jsx +++ /dev/null @@ -1,53 +0,0 @@ -import { makeStyles } from '@mui/styles' -import classnames from 'classnames' -import React, { memo } from 'react' -import DeleteIcon from 'src/styling/icons/button/cancel/zodiac.svg?react' - -import typographyStyles from 'src/components/typography/styles' -import { zircon, zircon2, comet, fontColor, white } from 'src/styling/variables' - -const { p } = typographyStyles - -const styles = { - button: { - extend: p, - border: 'none', - backgroundColor: zircon, - cursor: 'pointer', - outline: 0, - display: 'flex', - justifyContent: 'center', - alignItems: 'center', - width: 167, - height: 48, - color: fontColor, - '&:hover': { - backgroundColor: zircon2 - }, - '&:active': { - backgroundColor: comet, - color: white, - '& svg g *': { - stroke: white - } - }, - '& svg': { - marginRight: 8 - } - } -} - -const useStyles = makeStyles(styles) - -const SimpleButton = memo(({ className, children, ...props }) => { - const classes = useStyles() - - return ( - - ) -}) - -export default SimpleButton diff --git a/new-lamassu-admin/src/components/buttons/FeatureButton.jsx b/new-lamassu-admin/src/components/buttons/FeatureButton.jsx index ad571077..73fb0a63 100644 --- a/new-lamassu-admin/src/components/buttons/FeatureButton.jsx +++ b/new-lamassu-admin/src/components/buttons/FeatureButton.jsx @@ -1,47 +1,19 @@ -import { makeStyles } from '@mui/styles' import classnames from 'classnames' import React, { memo } from 'react' -import baseButtonStyles from './BaseButton.styles' - -const { baseButton, primary } = baseButtonStyles - -const styles = { - featureButton: { - extend: baseButton, - width: baseButton.height, - borderRadius: baseButton.height / 2, - display: 'flex', - padding: 0 - }, - primary, - buttonIcon: { - margin: 'auto', - '& svg': { - width: 16, - height: 16, - overflow: 'visible', - '& g': { - strokeWidth: 1.8 - } - } - }, - buttonIconActive: {} // required to extend primary -} - -const useStyles = makeStyles(styles) +import classes from './FeatureButton.module.css' const FeatureButton = memo( ({ className, Icon, InverseIcon, children, ...props }) => { - const classes = useStyles() - - const classNames = { - [classes.featureButton]: true, - [classes.primary]: true - } - return ( - diff --git a/new-lamassu-admin/src/pages/Customers/CustomerProfile.jsx b/new-lamassu-admin/src/pages/Customers/CustomerProfile.jsx index e2e9f8df..0de0e3d9 100644 --- a/new-lamassu-admin/src/pages/Customers/CustomerProfile.jsx +++ b/new-lamassu-admin/src/pages/Customers/CustomerProfile.jsx @@ -755,9 +755,6 @@ const RetrieveDataDialog = ({ )} -