aq-fe-framework 0.1.165 → 0.1.167

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -22,15 +22,13 @@
22
22
  "types": "./dist/hooks/index.d.mts"
23
23
  }
24
24
  },
25
- "version": "0.1.165",
25
+ "version": "0.1.167",
26
26
  "private": false,
27
27
  "files": [
28
- "dist",
29
- "src/**/*.css"
28
+ "dist"
30
29
  ],
31
30
  "scripts": {
32
31
  "deploy": "node deploy.js",
33
- "postbuild": "node copy-css.js",
34
32
  "update-mantine": "npx npm-check-updates @mantine/* @mantinex/* postcss-preset-mantine -u",
35
33
  "dev": "next dev --turbopack -p 3000",
36
34
  "build-next": "next build",
@@ -112,6 +110,7 @@
112
110
  "@types/react-dom": "^18",
113
111
  "barrelsby": "^2.8.1",
114
112
  "cpx": "^1.5.0",
113
+ "esbuild-plugin-css-modules": "^0.3.0",
115
114
  "eslint": "^8",
116
115
  "eslint-config-next": "15.0.3",
117
116
  "postcss": "^8.5.3",
@@ -1,59 +0,0 @@
1
- @tailwind base;
2
- @tailwind components;
3
- @tailwind utilities;
4
-
5
- /* body {
6
- font-family: 'Tahoma', sans-serif;
7
- } */
8
- ul {
9
- list-style: disc;
10
- list-style-position: outside;
11
- }
12
-
13
- ol {
14
- list-style: decimal;
15
- list-style-position: outside;
16
- }
17
-
18
- .m_d6493fad :where(img) {
19
- max-width: unset !important;
20
- margin-bottom: unset !important;
21
- }
22
-
23
- /* .m_b23fa0ef:where([data-with-table-border]) {
24
- border: none !important;
25
- } */
26
-
27
- .MRT_TableHeadCell-module_content-wrapper-nowrap__-4aIg {
28
- white-space: normal !important;
29
- }
30
- .m_4e7aa4fd:where([data-with-row-border]) {
31
- border-bottom: calc(0.0625rem * var(--mantine-scale)) solid var(--table-border-color) !important;
32
- border-top: calc(0.0625rem * var(--mantine-scale)) solid var(--table-border-color) !important;
33
- }
34
-
35
- .MRT_TableBody-module_empty-row-td-content__Cc2XW {
36
- max-width: unset !important; /* Hoặc max-width: initial !important; */
37
- }
38
- img,
39
- svg,
40
- video,
41
- canvas,
42
- audio,
43
- iframe,
44
- embed,
45
- object {
46
- display: inline; /* Hoặc giá trị khác mà bạn mong muốn */
47
- vertical-align: auto; /* Hoặc giá trị khác mà bạn mong muốn */
48
- }
49
-
50
- .tabler-icon {
51
- width: 20px;
52
- height: 20px;
53
- }
54
- @media (max-width: 640px) {
55
- :root {
56
- /* Kích thước chữ cho màn hình nhỏ (mobile) */
57
- font-size: 14px;
58
- }
59
- }
@@ -1,62 +0,0 @@
1
- .navbar {
2
- height: rem(700px);
3
- padding: var(--mantine-spacing-md);
4
- display: flex;
5
- flex-direction: column;
6
- border-right: rem(1px) solid light-dark(var(--mantine-color-gray-3), var(--mantine-color-dark-4));
7
- }
8
-
9
- .navbarMain {
10
- flex: 1;
11
- }
12
-
13
- .header {
14
- padding-bottom: var(--mantine-spacing-md);
15
- margin-bottom: calc(var(--mantine-spacing-md) * 1.5);
16
- border-bottom: rem(1px) solid light-dark(var(--mantine-color-gray-3), var(--mantine-color-dark-4));
17
- }
18
-
19
- .footer {
20
- padding-top: var(--mantine-spacing-md);
21
- margin-top: var(--mantine-spacing-md);
22
- border-top: rem(1px) solid light-dark(var(--mantine-color-gray-3), var(--mantine-color-dark-4));
23
- }
24
-
25
- .link {
26
- display: flex;
27
- align-items: center;
28
- text-decoration: none;
29
- font-size: var(--mantine-font-size-sm);
30
- color: light-dark(var(--mantine-color-gray-7), var(--mantine-color-dark-1));
31
- padding: var(--mantine-spacing-xs) var(--mantine-spacing-sm);
32
- border-radius: var(--mantine-radius-sm);
33
- font-weight: 500;
34
-
35
- @mixin hover {
36
- background-color: light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-6));
37
- color: light-dark(var(--mantine-color-black), var(--mantine-color-white));
38
-
39
- .linkIcon {
40
- color: light-dark(var(--mantine-color-black), var(--mantine-color-white));
41
- }
42
- }
43
-
44
- &[data-active] {
45
- &,
46
- &:hover {
47
- background-color: var(--mantine-color-blue-light);
48
- color: var(--mantine-color-blue-light-color);
49
-
50
- .linkIcon {
51
- color: var(--mantine-color-blue-light-color);
52
- }
53
- }
54
- }
55
- }
56
-
57
- .linkIcon {
58
- color: light-dark(var(--mantine-color-gray-6), var(--mantine-color-dark-2));
59
- margin-right: var(--mantine-spacing-sm);
60
- width: rem(25px);
61
- height: rem(25px);
62
- }
@@ -1,50 +0,0 @@
1
- .header {
2
- position: sticky; /* Giúp header dính trên cùng */
3
- top: 0;
4
- z-index: 1; /* Đảm bảo header nằm trên các thành phần khác */
5
- height: 60px;
6
- background-color: light-dark(var(--mantine-color-white), var(--mantine-color-dark));
7
- padding-left: var(--mantine-spacing-md);
8
- padding-right: var(--mantine-spacing-md);
9
- border-bottom: 1px solid light-dark(var(--mantine-color-gray-3), var(--mantine-color-dark-4));
10
- }
11
-
12
- .link {
13
- display: flex;
14
- align-items: center;
15
- height: 100%;
16
- padding-left: var(--mantine-spacing-md);
17
- padding-right: var(--mantine-spacing-md);
18
- text-decoration: none;
19
- color: light-dark(var(--mantine-color-black), var(--mantine-color-white));
20
- font-weight: 500;
21
- font-size: var(--mantine-font-size-sm);
22
-
23
- @media (max-width: $mantine-breakpoint-sm) {
24
- height: 42px;
25
- width: 100%;
26
- }
27
-
28
- @mixin hover {
29
- background-color: light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-6));
30
- }
31
- }
32
-
33
- .subLink {
34
- width: 100%;
35
- padding: var(--mantine-spacing-xs) var(--mantine-spacing-md);
36
- border-radius: var(--mantine-radius-md);
37
-
38
- @mixin hover {
39
- background-color: light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-7));
40
- }
41
- }
42
-
43
- .dropdownFooter {
44
- background-color: light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-7));
45
- margin: calc(var(--mantine-spacing-md) * -1);
46
- margin-top: var(--mantine-spacing-sm);
47
- padding: var(--mantine-spacing-md) calc(var(--mantine-spacing-md) * 2);
48
- padding-bottom: var(--mantine-spacing-xl);
49
- border-top: 1px solid light-dark(var(--mantine-color-gray-1), var(--mantine-color-dark-5));
50
- }
@@ -1,4 +0,0 @@
1
- .title {
2
- font-family: Greycliff CF, var(--mantine-font-family);
3
- font-weight: 900;
4
- }
@@ -1,21 +0,0 @@
1
- .input {
2
- &[data-variant="underline"] {
3
- border: 2px solid transparent;
4
- border-radius: 5px;
5
- padding-left: 8px;
6
- padding-right: 8px;
7
- background-color: white;
8
-
9
- &:focus,
10
- &:focus-visible {
11
- border-color: var(--mantine-color-gray-5);
12
- outline: none;
13
- }
14
-
15
- &:active {
16
- border-color: var(--mantine-color-gray-5);
17
- }
18
-
19
- transition: border-color 0.2s ease-in-out;
20
- }
21
- }
@@ -1,59 +0,0 @@
1
- @tailwind base;
2
- @tailwind components;
3
- @tailwind utilities;
4
-
5
- /* body {
6
- font-family: 'Tahoma', sans-serif;
7
- } */
8
- ul {
9
- list-style: disc;
10
- list-style-position: outside;
11
- }
12
-
13
- ol {
14
- list-style: decimal;
15
- list-style-position: outside;
16
- }
17
-
18
- .m_d6493fad :where(img) {
19
- max-width: unset !important;
20
- margin-bottom: unset !important;
21
- }
22
-
23
- /* .m_b23fa0ef:where([data-with-table-border]) {
24
- border: none !important;
25
- } */
26
-
27
- .MRT_TableHeadCell-module_content-wrapper-nowrap__-4aIg {
28
- white-space: normal !important;
29
- }
30
- .m_4e7aa4fd:where([data-with-row-border]) {
31
- border-bottom: calc(0.0625rem * var(--mantine-scale)) solid var(--table-border-color) !important;
32
- border-top: calc(0.0625rem * var(--mantine-scale)) solid var(--table-border-color) !important;
33
- }
34
-
35
- .MRT_TableBody-module_empty-row-td-content__Cc2XW {
36
- max-width: unset !important; /* Hoặc max-width: initial !important; */
37
- }
38
- img,
39
- svg,
40
- video,
41
- canvas,
42
- audio,
43
- iframe,
44
- embed,
45
- object {
46
- display: inline; /* Hoặc giá trị khác mà bạn mong muốn */
47
- vertical-align: auto; /* Hoặc giá trị khác mà bạn mong muốn */
48
- }
49
-
50
- .tabler-icon {
51
- width: 20px;
52
- height: 20px;
53
- }
54
- @media (max-width: 640px) {
55
- :root {
56
- /* Kích thước chữ cho màn hình nhỏ (mobile) */
57
- font-size: 14px;
58
- }
59
- }
@@ -1,62 +0,0 @@
1
- .navbar {
2
- height: rem(700px);
3
- padding: var(--mantine-spacing-md);
4
- display: flex;
5
- flex-direction: column;
6
- border-right: rem(1px) solid light-dark(var(--mantine-color-gray-3), var(--mantine-color-dark-4));
7
- }
8
-
9
- .navbarMain {
10
- flex: 1;
11
- }
12
-
13
- .header {
14
- padding-bottom: var(--mantine-spacing-md);
15
- margin-bottom: calc(var(--mantine-spacing-md) * 1.5);
16
- border-bottom: rem(1px) solid light-dark(var(--mantine-color-gray-3), var(--mantine-color-dark-4));
17
- }
18
-
19
- .footer {
20
- padding-top: var(--mantine-spacing-md);
21
- margin-top: var(--mantine-spacing-md);
22
- border-top: rem(1px) solid light-dark(var(--mantine-color-gray-3), var(--mantine-color-dark-4));
23
- }
24
-
25
- .link {
26
- display: flex;
27
- align-items: center;
28
- text-decoration: none;
29
- font-size: var(--mantine-font-size-sm);
30
- color: light-dark(var(--mantine-color-gray-7), var(--mantine-color-dark-1));
31
- padding: var(--mantine-spacing-xs) var(--mantine-spacing-sm);
32
- border-radius: var(--mantine-radius-sm);
33
- font-weight: 500;
34
-
35
- @mixin hover {
36
- background-color: light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-6));
37
- color: light-dark(var(--mantine-color-black), var(--mantine-color-white));
38
-
39
- .linkIcon {
40
- color: light-dark(var(--mantine-color-black), var(--mantine-color-white));
41
- }
42
- }
43
-
44
- &[data-active] {
45
- &,
46
- &:hover {
47
- background-color: var(--mantine-color-blue-light);
48
- color: var(--mantine-color-blue-light-color);
49
-
50
- .linkIcon {
51
- color: var(--mantine-color-blue-light-color);
52
- }
53
- }
54
- }
55
- }
56
-
57
- .linkIcon {
58
- color: light-dark(var(--mantine-color-gray-6), var(--mantine-color-dark-2));
59
- margin-right: var(--mantine-spacing-sm);
60
- width: rem(25px);
61
- height: rem(25px);
62
- }
@@ -1,50 +0,0 @@
1
- .header {
2
- position: sticky; /* Giúp header dính trên cùng */
3
- top: 0;
4
- z-index: 1; /* Đảm bảo header nằm trên các thành phần khác */
5
- height: 60px;
6
- background-color: light-dark(var(--mantine-color-white), var(--mantine-color-dark));
7
- padding-left: var(--mantine-spacing-md);
8
- padding-right: var(--mantine-spacing-md);
9
- border-bottom: 1px solid light-dark(var(--mantine-color-gray-3), var(--mantine-color-dark-4));
10
- }
11
-
12
- .link {
13
- display: flex;
14
- align-items: center;
15
- height: 100%;
16
- padding-left: var(--mantine-spacing-md);
17
- padding-right: var(--mantine-spacing-md);
18
- text-decoration: none;
19
- color: light-dark(var(--mantine-color-black), var(--mantine-color-white));
20
- font-weight: 500;
21
- font-size: var(--mantine-font-size-sm);
22
-
23
- @media (max-width: $mantine-breakpoint-sm) {
24
- height: 42px;
25
- width: 100%;
26
- }
27
-
28
- @mixin hover {
29
- background-color: light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-6));
30
- }
31
- }
32
-
33
- .subLink {
34
- width: 100%;
35
- padding: var(--mantine-spacing-xs) var(--mantine-spacing-md);
36
- border-radius: var(--mantine-radius-md);
37
-
38
- @mixin hover {
39
- background-color: light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-7));
40
- }
41
- }
42
-
43
- .dropdownFooter {
44
- background-color: light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-7));
45
- margin: calc(var(--mantine-spacing-md) * -1);
46
- margin-top: var(--mantine-spacing-sm);
47
- padding: var(--mantine-spacing-md) calc(var(--mantine-spacing-md) * 2);
48
- padding-bottom: var(--mantine-spacing-xl);
49
- border-top: 1px solid light-dark(var(--mantine-color-gray-1), var(--mantine-color-dark-5));
50
- }
@@ -1,4 +0,0 @@
1
- .title {
2
- font-family: Greycliff CF, var(--mantine-font-family);
3
- font-weight: 900;
4
- }
@@ -1,21 +0,0 @@
1
- .input {
2
- &[data-variant="underline"] {
3
- border: 2px solid transparent;
4
- border-radius: 5px;
5
- padding-left: 8px;
6
- padding-right: 8px;
7
- background-color: white;
8
-
9
- &:focus,
10
- &:focus-visible {
11
- border-color: var(--mantine-color-gray-5);
12
- outline: none;
13
- }
14
-
15
- &:active {
16
- border-color: var(--mantine-color-gray-5);
17
- }
18
-
19
- transition: border-color 0.2s ease-in-out;
20
- }
21
- }