feat: darkmode skeleton and universal search

This commit is contained in:
Ahmed Bouhuolia
2025-10-21 00:14:31 +02:00
parent ce01b8645b
commit 0477133cda
9 changed files with 116 additions and 22 deletions

View File

@@ -10,7 +10,7 @@
"dev:server": "lerna run dev --scope \"@bigcapital/server\" --scope \"@bigcapital/utils\" --scope \"@bigcapital/pdf-templates\" --scope \"@bigcapital/email-components\"",
"build:server": "lerna run build --scope \"@bigcapital/server\" --scope \"@bigcapital/utils\" --scope \"@bigcapital/pdf-templates\" --scope \"@bigcapital/email-components\"",
"serve:server": "lerna run serve --scope \"@bigcapital/server\" --scope \"@bigcapital/utils\"",
"server2:start": "lerna run start:dev --scope \"@bigcapital/server2\"",
"server:start": "lerna run start:dev --scope \"@bigcapital/server\"",
"test:watch": "lerna run test:watch",
"test:e2e": "lerna run test:e2e",
"start:debug": "lerna run start:debug",

View File

@@ -1,5 +1,5 @@
{
"name": "@bigcapital/server2",
"name": "@bigcapital/server",
"version": "0.0.1",
"description": "",
"author": "",
@@ -48,6 +48,7 @@
"@supercharge/promise-pool": "^3.2.0",
"@types/multer": "^1.4.11",
"@types/nodemailer": "^6.4.17",
"@types/passport-google-oauth20": "^2.0.16",
"@types/passport-local": "^1.0.38",
"@types/ramda": "^0.30.2",
"accounting": "^0.4.1",
@@ -90,6 +91,7 @@
"object-hash": "^2.0.3",
"objection": "^3.1.5",
"passport": "^0.7.0",
"passport-google-oauth20": "^2.0.0",
"passport-headerapikey": "^1.2.2",
"passport-jwt": "^4.0.1",
"passport-local": "^1.0.0",

View File

@@ -3,9 +3,9 @@
"version": "0.10.2",
"private": true,
"dependencies": {
"@bigcapital/utils": "*",
"@bigcapital/pdf-templates": "*",
"@bigcapital/email-components": "*",
"@bigcapital/pdf-templates": "*",
"@bigcapital/utils": "*",
"@blueprintjs-formik/core": "^0.3.7",
"@blueprintjs-formik/datetime": "^0.3.7",
"@blueprintjs-formik/select": "^0.3.5",
@@ -21,6 +21,7 @@
"@craco/craco": "^5.9.0",
"@emotion/css": "^11.13.4",
"@emotion/react": "^11.13.3",
"@react-oauth/google": "^0.12.2",
"@reduxjs/toolkit": "^1.2.5",
"@stripe/connect-js": "^3.3.12",
"@stripe/react-connect-js": "^3.3.13",
@@ -38,8 +39,8 @@
"@types/node": "^14.14.9",
"@types/ramda": "^0.28.14",
"@types/react": "18.3.4",
"@types/react-dom": "18.3.0",
"@types/react-body-classname": "^1.1.7",
"@types/react-dom": "18.3.0",
"@types/react-helmet": "^6.1.11",
"@types/react-redux": "^7.1.24",
"@types/react-router-dom": "^5.3.3",

View File

@@ -5,4 +5,5 @@ export * from './BlueprintFormik';
export * from './InputPrependText';
export * from './InputPrependButton';
export * from './MoneyInputGroup';
export * from './FRichEditor';
export * from './FRichEditor';
export * from './Select';

View File

@@ -69,6 +69,7 @@ $ns: bp4;
// Main Dashboard.
--color-dashboard-insider-background: #fbfbfb;
--color-dashboard-topbar-background: #fff;
--color-dashboard-fallback-loading-background: #fbfbfb;
--color-dashboard-topbar-border-color: #c7d5db;
--color-dashboard-datatable-background: #fff;
--color-dashboard-datatable-border: #d2dce2;
@@ -242,7 +243,9 @@ $ns: bp4;
// Universal search
--color-universal-search-background: #fff;
--color-universal-search-footer-divider: #d3dce2;
--color-universal-search-icon: #5c707f;
--color-universal-search-tag-background: #708392;
--color-universal-search-tag-text: #fff;
--color-universal-search-menu-border: #d3dce2;
// Content tabs
@@ -255,9 +258,7 @@ $ns: bp4;
// Aside
--color-aside-background: #fff;
--color-aside-title-background: #fff;
--color-aside-divider: #E1E2E9;
// App shell
@@ -284,6 +285,13 @@ $ns: bp4;
--color-drawer-header-text: #354152;
--color-drawer-insider-background: #fbfbfb;
--color-drawer-tabs-background: #fff;
// Skeleton
--color-skeleton-background-start: rgba(206, 217, 224, 0.3);
--color-skeleton-background-end: rgba(92, 112, 128, 0.3);
--color-skeleton-border-start: rgba(206, 217, 224, 0.3);
--color-skeleton-border-end: rgba(92, 112, 128, 0.3);
--color-skeleton-border-radius: 2px;
}
$pt-popover-box-shadow:
@@ -360,6 +368,7 @@ body.bp4-dark {
// Main Dashboard.
--color-dashboard-insider-background: var(--color-dark-gray1);
--color-dashboard-topbar-background: var(--color-dark-gray1);
--color-dashboard-fallback-loading-background: var(--color-dark-gray1);
--color-dashboard-topbar-border-color: transparent;
--color-dashboard-datatable-background: var(--color-dark-gray1);
--color-dashboard-datatable-border: var(--color-dark-gray3);
@@ -436,6 +445,7 @@ body.bp4-dark {
--color-financial-report-background: var(--color-dark-gray2);
// Datatable
--color-datatable-text: var(--color-white);
--color-datatable-constrant-text: var(--color-light-gray2);
@@ -544,9 +554,9 @@ body.bp4-dark {
// Universal search
--color-universal-search-background: var(--color-dark-gray3);
--color-universal-search-footer-divider: var(--color-dark-gray4);
--color-universal-search-tag-background: #708392;
--color-universal-search-tag-background: var(--color-dark-gray4);
--color-universal-search-menu-border: #d3dce2;
--color-universal-search-icon: rgba(255, 255, 255, 0.25);
--color-universal-search-tag-background: rgba(255, 255, 255, 0.15);
--color-universal-search-tag-text: var(--color-white);
--color-universal-search-menu-border: rgba(255, 255, 255, 0.15);
// Content tabs
@@ -594,6 +604,13 @@ body.bp4-dark {
--color-drawer-header-text: #fff;
--color-drawer-insider-background: transparent;
--color-drawer-tabs-background: transparent;
// Skeleton
--color-skeleton-background-start: rgba(255, 255, 255, 0.1);
--color-skeleton-background-end: rgba(255, 255, 255, 0.2);
--color-skeleton-border-start: rgba(255, 255, 255, 0.1);
--color-skeleton-border-end: rgba(255, 255, 255, 0.2);
--color-skeleton-border-radius: 2px;
}
$pt-popover-box-shadow:

View File

@@ -2,21 +2,21 @@
@keyframes skeleton-glow {
0% {
background: rgba(206,217,224,.3);
border-color: rgba(206,217,224,.3);
background: var(--color-skeleton-background-start);
border-color: var(--color-skeleton-border-start);
}
to {
background: rgba(92,112,128,.3);
border-color: rgba(92,112,128,.3);
background: var(--color-skeleton-background-end);
border-color: var(--color-skeleton-border-end);
}
}
.skeleton{
animation: skeleton-glow 1s linear infinite alternate;
background: rgba(206,217,224,.3);
background: var(--color-skeleton-background-start);
background-clip: padding-box;
border-color: rgba(206,217,224,.3);
border-radius: 2px;
border-color: var(--color-skeleton-border-start);
border-radius: var(--color-skeleton-border-radius);
box-shadow: none;
color: transparent;

View File

@@ -69,7 +69,7 @@
.bp4-input-group {
.bp4-icon {
margin: 16px;
color: #5c707f;
color: var(--color-universal-search-icon);
svg {
stroke-width: 2;
@@ -139,6 +139,7 @@
.bp4-tag {
background: var(--color-universal-search-tag-background);
color: var(--color-universal-search-tag-text);
}
&--arrows {
.bp4-tag {
@@ -148,7 +149,7 @@
margin-left: 4px;
svg {
fill: #fff;
fill: var(--color-universal-search-tag-text);
height: 100%;
display: block;
width: 100%;

View File

@@ -399,8 +399,8 @@ $dashboard-views-bar-height: 44px;
&__fallback-loading {
display: flex;
flex-direction: column;
background-color: var(--color-dashboard-fallback-loading-background);
height: 100%;
background-color: #fbfbfb;
.bp4-spinner {
margin: auto;

74
pnpm-lock.yaml generated
View File

@@ -120,6 +120,9 @@ importers:
'@types/nodemailer':
specifier: ^6.4.17
version: 6.4.17
'@types/passport-google-oauth20':
specifier: ^2.0.16
version: 2.0.16
'@types/passport-local':
specifier: ^1.0.38
version: 1.0.38
@@ -246,6 +249,9 @@ importers:
passport:
specifier: ^0.7.0
version: 0.7.0
passport-google-oauth20:
specifier: ^2.0.0
version: 2.0.0
passport-headerapikey:
specifier: ^1.2.2
version: 1.2.2
@@ -439,6 +445,9 @@ importers:
'@emotion/react':
specifier: ^11.13.3
version: 11.13.3(@types/react@18.3.4)(react@18.3.1)
'@react-oauth/google':
specifier: ^0.12.2
version: 0.12.2(react-dom@18.3.1)(react@18.3.1)
'@reduxjs/toolkit':
specifier: ^1.2.5
version: 1.9.7(react-redux@7.2.9)(react@18.3.1)
@@ -8606,6 +8615,16 @@ packages:
react: 18.3.1
dev: false
/@react-oauth/google@0.12.2(react-dom@18.3.1)(react@18.3.1):
resolution: {integrity: sha512-d1GVm2uD4E44EJft2RbKtp8Z1fp/gK8Lb6KHgs3pHlM0PxCXGLaq8LLYQYENnN4xPWO1gkL4apBtlPKzpLvZwg==}
peerDependencies:
react: '>=16.8.0'
react-dom: '>=16.8.0'
dependencies:
react: 18.3.1
react-dom: 18.3.1(react@18.3.1)
dev: false
/@redis/bloom@1.2.0(@redis/client@1.6.0):
resolution: {integrity: sha512-HG2DFjYKbpNmVXsa0keLHp/3leGJz1mjh09f2RLGGLQZzSHpkmZWuwJbAvo3QcRY8p80m5+ZdXZdYOSBLlp7Cg==}
peerDependencies:
@@ -11815,9 +11834,23 @@ packages:
resolution: {integrity: sha512-37i+OaWTh9qeK4LSHPsyRC7NahnGotNuZvjLSgcPzblpHB3rrCJxAOgI5gCdKm7coonsaX1Of0ILiTcnZjbfxA==}
dev: true
/@types/oauth@0.9.6:
resolution: {integrity: sha512-H9TRCVKBNOhZZmyHLqFt9drPM9l+ShWiqqJijU1B8P3DX3ub84NjxDuy+Hjrz+fEca5Kwip3qPMKNyiLgNJtIA==}
dependencies:
'@types/node': 20.5.1
dev: false
/@types/parse-json@4.0.2:
resolution: {integrity: sha512-dISoDXWWQwUquiKsyZ4Ng+HX2KsPL7LyHKHQwgGFEA3IaKac4Obd+h2a/a6waisAoepJlBcx9paWqjA8/HVjCw==}
/@types/passport-google-oauth20@2.0.16:
resolution: {integrity: sha512-ayXK2CJ7uVieqhYOc6k/pIr5pcQxOLB6kBev+QUGS7oEZeTgIs1odDobXRqgfBPvXzl0wXCQHftV5220czZCPA==}
dependencies:
'@types/express': 5.0.0
'@types/passport': 1.0.17
'@types/passport-oauth2': 1.8.0
dev: false
/@types/passport-local@1.0.38:
resolution: {integrity: sha512-nsrW4A963lYE7lNTv9cr5WmiUD1ibYJvWrpE13oxApFsRt77b0RdtZvKbCdNIY4v/QZ6TRQWaDDEwV1kCTmcXg==}
dependencies:
@@ -11826,6 +11859,14 @@ packages:
'@types/passport-strategy': 0.2.38
dev: false
/@types/passport-oauth2@1.8.0:
resolution: {integrity: sha512-6//z+4orIOy/g3zx17HyQ71GSRK4bs7Sb+zFasRoc2xzlv7ZCJ+vkDBYFci8U6HY+or6Zy7ajf4mz4rK7nsWJQ==}
dependencies:
'@types/express': 5.0.0
'@types/oauth': 0.9.6
'@types/passport': 1.0.17
dev: false
/@types/passport-strategy@0.2.38:
resolution: {integrity: sha512-GC6eMqqojOooq993Tmnmp7AUTbbQSgilyvpCYQjT+H6JfG/g6RGc7nXEniZlp0zyKJ0WUdOiZWLBZft9Yug1uA==}
dependencies:
@@ -13953,6 +13994,11 @@ packages:
resolution: {integrity: sha512-lGe34o6EHj9y3Kts9R4ZYs/Gr+6N7MCaMlIFA3F1R2O5/m7K06AxfSeO5530PEERE6/WyEg3lsuyw4GHlPZHog==}
engines: {node: ^4.5.0 || >= 5.9}
/base64url@3.0.1:
resolution: {integrity: sha512-ir1UPr3dkwexU7FdV8qBBbNDRUhMmIekYMFZfi+C/sLNnRESKPl23nB9b2pltqfOQNnGzsDdId90AEtG5tCx4A==}
engines: {node: '>=6.0.0'}
dev: false
/base@0.11.2:
resolution: {integrity: sha512-5T6P4xPgpp0YDFvSWwEZ4NoE3aM4QBQXDzmVbraCkFj8zHM+mba8SyqB5DbZWyR7mYHo6Y7BdQo3MoA4m0TeQg==}
engines: {node: '>=0.10.0'}
@@ -21360,7 +21406,7 @@ packages:
dependencies:
copy-anything: 2.0.6
parse-node-version: 1.0.1
tslib: 2.8.0
tslib: 2.8.1
optionalDependencies:
errno: 0.1.8
graceful-fs: 4.2.11
@@ -22959,6 +23005,10 @@ packages:
ufo: 1.5.4
dev: true
/oauth@0.10.2:
resolution: {integrity: sha512-JtFnB+8nxDEXgNyniwz573xxbKSOu3R8D40xQKqcjwJ2CDkYqUDI53o6IuzDJBx60Z8VKCm271+t8iFjakrl8Q==}
dev: false
/object-assign@4.1.1:
resolution: {integrity: sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==}
engines: {node: '>=0.10.0'}
@@ -23438,6 +23488,13 @@ packages:
engines: {node: '>=0.10.0'}
dev: false
/passport-google-oauth20@2.0.0:
resolution: {integrity: sha512-KSk6IJ15RoxuGq7D1UKK/8qKhNfzbLeLrG3gkLZ7p4A6DBCcv7xpyQwuXtWdpyR0+E0mwkpjY1VfPOhxQrKzdQ==}
engines: {node: '>= 0.4.0'}
dependencies:
passport-oauth2: 1.8.0
dev: false
/passport-headerapikey@1.2.2:
resolution: {integrity: sha512-4BvVJRrWsNJPrd3UoZfcnnl4zvUWYKEtfYkoDsaOKBsrWHYmzTApCjs7qUbncOLexE9ul0IRiYBFfBG0y9IVQA==}
dependencies:
@@ -23459,6 +23516,17 @@ packages:
passport-strategy: 1.0.0
dev: false
/passport-oauth2@1.8.0:
resolution: {integrity: sha512-cjsQbOrXIDE4P8nNb3FQRCCmJJ/utnFKEz2NX209f7KOHPoX18gF7gBzBbLLsj2/je4KrgiwLLGjf0lm9rtTBA==}
engines: {node: '>= 0.4.0'}
dependencies:
base64url: 3.0.1
oauth: 0.10.2
passport-strategy: 1.0.0
uid2: 0.0.4
utils-merge: 1.0.1
dev: false
/passport-strategy@1.0.0:
resolution: {integrity: sha512-CB97UUvDKJde2V0KDWWB3lyf6PC3FaZP7YxZ2G8OAtn9p4HI9j9JLP9qjOGZFvyl8uwNT8qM+hGnz/n16NI7oA==}
engines: {node: '>= 0.4.0'}
@@ -29117,6 +29185,10 @@ packages:
dev: true
optional: true
/uid2@0.0.4:
resolution: {integrity: sha512-IevTus0SbGwQzYh3+fRsAMTVVPOoIVufzacXcHPmdlle1jUpq7BRL+mw3dgeLanvGZdwwbWhRV6XrcFNdBmjWA==}
dev: false
/uid@2.0.2:
resolution: {integrity: sha512-u3xV3X7uzvi5b1MncmZo3i2Aw222Zk1keqLA1YkHldREkAhAqi65wuPfe7lHx8H/Wzy+8CE7S7uS3jekIM5s8g==}
engines: {node: '>=8'}