bsmnt 0.2.9 → 0.2.11

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.
Files changed (197) hide show
  1. package/README.md +84 -146
  2. package/dist/configs/skills.d.ts +27 -0
  3. package/dist/configs/skills.d.ts.map +1 -0
  4. package/dist/configs/skills.js +18 -0
  5. package/dist/configs/skills.js.map +1 -0
  6. package/dist/configs/skills.json +26 -0
  7. package/dist/helpers/add/hooks-config.d.ts.map +1 -1
  8. package/dist/helpers/add/hooks-config.js +0 -6
  9. package/dist/helpers/add/hooks-config.js.map +1 -1
  10. package/dist/helpers/create/setup-agent.d.ts.map +1 -1
  11. package/dist/helpers/create/setup-agent.js +15 -5
  12. package/dist/helpers/create/setup-agent.js.map +1 -1
  13. package/dist/helpers/integrate/merge-config.d.ts.map +1 -1
  14. package/dist/helpers/integrate/merge-config.js +1 -0
  15. package/dist/helpers/integrate/merge-config.js.map +1 -1
  16. package/dist/helpers/integrate/sanity/config.d.ts.map +1 -1
  17. package/dist/helpers/integrate/sanity/config.js +8 -2
  18. package/dist/helpers/integrate/sanity/config.js.map +1 -1
  19. package/dist/helpers/integrate/sanity/mergers/layout-merger.d.ts.map +1 -1
  20. package/dist/helpers/integrate/sanity/mergers/layout-merger.js +13 -12
  21. package/dist/helpers/integrate/sanity/mergers/layout-merger.js.map +1 -1
  22. package/dist/helpers/skills/index.d.ts +10 -0
  23. package/dist/helpers/skills/index.d.ts.map +1 -0
  24. package/dist/helpers/skills/index.js +136 -0
  25. package/dist/helpers/skills/index.js.map +1 -0
  26. package/dist/index.js +18 -0
  27. package/dist/index.js.map +1 -1
  28. package/package.json +4 -3
  29. package/src/helpers/integrate/sanity/files/app/api/blog/[slug]/route.ts +2 -1
  30. package/src/helpers/integrate/sanity/files/lib/integrations/sanity/confirm-publish-action.ts +31 -0
  31. package/src/helpers/integrate/sanity/files/lib/integrations/sanity/sanity.config.ts +17 -0
  32. package/src/helpers/integrate/sanity/files/lib/utils/json-ld.tsx +249 -0
  33. package/src/template-hooks/config.js +0 -6
  34. package/src/templates/next-default/README.md +28 -199
  35. package/src/templates/next-default/app/layout.tsx +20 -3
  36. package/src/templates/next-default/biome.json +1 -14
  37. package/src/templates/next-default/components/layout/theme/index.tsx +2 -5
  38. package/src/templates/next-default/components/layout/wrapper/index.tsx +1 -2
  39. package/src/templates/next-default/components/ui/README.md +2 -3
  40. package/src/templates/next-default/components/ui/image/index.tsx +3 -3
  41. package/src/templates/next-default/lib/README.md +3 -3
  42. package/src/templates/next-default/lib/hooks/use-device-detection.ts +4 -3
  43. package/src/templates/next-default/lib/hooks/use-media-breakpoint.ts +11 -4
  44. package/src/templates/next-default/lib/hooks/use-media.ts +29 -0
  45. package/src/templates/next-default/lib/scripts/dev.ts +9 -29
  46. package/src/templates/next-default/lib/styles/README.md +7 -58
  47. package/src/templates/next-default/lib/styles/fonts.ts +7 -15
  48. package/src/templates/next-default/lib/styles/global.css +198 -0
  49. package/src/templates/next-default/lib/styles/index.css +3 -0
  50. package/src/templates/next-default/lib/styles/tokens.css +179 -0
  51. package/src/templates/next-default/lib/utils/global-css.d.ts +1 -0
  52. package/src/templates/next-default/lib/utils/json-ld.tsx +199 -0
  53. package/src/templates/next-default/lib/utils/viewport.ts +11 -5
  54. package/src/templates/next-default/next.config.ts +0 -1
  55. package/src/templates/next-default/package.json +11 -18
  56. package/src/templates/next-default/postcss.config.mjs +0 -14
  57. package/src/templates/next-default/tsconfig.json +1 -0
  58. package/src/templates/next-default/tsconfig.tsbuildinfo +1 -0
  59. package/src/templates/next-experiments/README.md +29 -200
  60. package/src/templates/next-experiments/app/layout.tsx +20 -3
  61. package/src/templates/next-experiments/app/page.tsx +46 -39
  62. package/src/templates/next-experiments/biome.json +1 -14
  63. package/src/templates/next-experiments/components/layout/theme/index.tsx +2 -5
  64. package/src/templates/next-experiments/components/layout/wrapper/index.tsx +1 -2
  65. package/src/templates/next-experiments/components/ui/README.md +2 -3
  66. package/src/templates/next-experiments/components/ui/image/index.tsx +3 -2
  67. package/src/templates/next-experiments/lib/README.md +3 -3
  68. package/src/templates/next-experiments/lib/hooks/use-device-detection.ts +4 -3
  69. package/src/templates/next-experiments/lib/hooks/use-media-breakpoint.ts +11 -4
  70. package/src/templates/next-experiments/lib/hooks/use-media.ts +29 -0
  71. package/src/templates/next-experiments/lib/scripts/dev.ts +9 -29
  72. package/src/templates/next-experiments/lib/styles/README.md +7 -58
  73. package/src/templates/next-experiments/lib/styles/fonts.ts +7 -15
  74. package/src/templates/next-experiments/lib/styles/global.css +198 -0
  75. package/src/templates/next-experiments/lib/styles/index.css +3 -0
  76. package/src/templates/next-experiments/lib/styles/tokens.css +179 -0
  77. package/src/templates/next-experiments/lib/utils/global-css.d.ts +1 -0
  78. package/src/templates/next-experiments/lib/utils/json-ld.tsx +199 -0
  79. package/src/templates/next-experiments/lib/utils/viewport.ts +11 -5
  80. package/src/templates/next-experiments/next.config.ts +0 -1
  81. package/src/templates/next-experiments/package.json +11 -22
  82. package/src/templates/next-experiments/postcss.config.mjs +0 -14
  83. package/src/templates/next-experiments/tsconfig.json +1 -0
  84. package/src/templates/next-experiments/tsconfig.tsbuildinfo +1 -0
  85. package/src/templates/next-webgl/README.md +30 -200
  86. package/src/templates/next-webgl/app/layout.tsx +20 -3
  87. package/src/templates/next-webgl/biome.json +1 -14
  88. package/src/templates/next-webgl/components/layout/theme/index.tsx +2 -5
  89. package/src/templates/next-webgl/components/layout/wrapper/index.tsx +1 -2
  90. package/src/templates/next-webgl/components/ui/README.md +2 -3
  91. package/src/templates/next-webgl/components/ui/image/index.tsx +3 -3
  92. package/src/templates/next-webgl/lib/README.md +3 -3
  93. package/src/templates/next-webgl/lib/hooks/use-device-detection.ts +4 -3
  94. package/src/templates/next-webgl/lib/hooks/use-media-breakpoint.ts +11 -4
  95. package/src/templates/next-webgl/lib/hooks/use-media.ts +29 -0
  96. package/src/templates/next-webgl/lib/scripts/dev.ts +9 -29
  97. package/src/templates/next-webgl/lib/styles/README.md +7 -58
  98. package/src/templates/next-webgl/lib/styles/fonts.ts +7 -15
  99. package/src/templates/next-webgl/lib/styles/global.css +198 -0
  100. package/src/templates/next-webgl/lib/styles/index.css +3 -0
  101. package/src/templates/next-webgl/lib/styles/tokens.css +179 -0
  102. package/src/templates/next-webgl/lib/utils/global-css.d.ts +1 -0
  103. package/src/templates/next-webgl/lib/utils/json-ld.tsx +199 -0
  104. package/src/templates/next-webgl/lib/utils/viewport.ts +11 -5
  105. package/src/templates/next-webgl/next.config.ts +0 -1
  106. package/src/templates/next-webgl/package.json +11 -20
  107. package/src/templates/next-webgl/postcss.config.mjs +0 -14
  108. package/src/templates/next-webgl/tsconfig.json +1 -0
  109. package/src/templates/next-webgl/tsconfig.tsbuildinfo +1 -0
  110. package/plugins/no-anchor-element.grit +0 -11
  111. package/plugins/no-relative-parent-imports.grit +0 -6
  112. package/plugins/no-unnecessary-forwardref.grit +0 -5
  113. package/src/template-hooks/use-media.ts +0 -33
  114. package/src/templates/next-default/components/ui/image/image.module.css +0 -5
  115. package/src/templates/next-default/lib/scripts/generate-component.ts +0 -322
  116. package/src/templates/next-default/lib/scripts/generate-page.ts +0 -193
  117. package/src/templates/next-default/lib/scripts/generate.ts +0 -79
  118. package/src/templates/next-default/lib/store/app.ts +0 -11
  119. package/src/templates/next-default/lib/store/index.ts +0 -11
  120. package/src/templates/next-default/lib/styles/colors.ts +0 -63
  121. package/src/templates/next-default/lib/styles/config.ts +0 -34
  122. package/src/templates/next-default/lib/styles/css/global.css +0 -85
  123. package/src/templates/next-default/lib/styles/css/index.css +0 -6
  124. package/src/templates/next-default/lib/styles/css/reset.css +0 -166
  125. package/src/templates/next-default/lib/styles/css/root.css +0 -68
  126. package/src/templates/next-default/lib/styles/css/tailwind.css +0 -132
  127. package/src/templates/next-default/lib/styles/easings.ts +0 -21
  128. package/src/templates/next-default/lib/styles/index.ts +0 -12
  129. package/src/templates/next-default/lib/styles/layout.mjs +0 -27
  130. package/src/templates/next-default/lib/styles/scripts/README.md +0 -29
  131. package/src/templates/next-default/lib/styles/scripts/generate-root.ts +0 -57
  132. package/src/templates/next-default/lib/styles/scripts/generate-tailwind.ts +0 -162
  133. package/src/templates/next-default/lib/styles/scripts/postcss-functions.mjs +0 -168
  134. package/src/templates/next-default/lib/styles/scripts/setup-styles.ts +0 -24
  135. package/src/templates/next-default/lib/styles/scripts/utils.ts +0 -20
  136. package/src/templates/next-default/lib/styles/typography.ts +0 -36
  137. package/src/templates/next-default/lib/utils/css.d.ts +0 -21
  138. package/src/templates/next-default/lib/utils/math.test.ts +0 -221
  139. package/src/templates/next-default/lib/utils/strings.test.ts +0 -166
  140. package/src/templates/next-default/lib/utils/viewport.test.ts +0 -256
  141. package/src/templates/next-default/public/fonts/geist/Geist-Mono.woff2 +0 -0
  142. package/src/templates/next-experiments/components/ui/image/image.module.css +0 -5
  143. package/src/templates/next-experiments/lib/scripts/generate-component.ts +0 -322
  144. package/src/templates/next-experiments/lib/scripts/generate-page.ts +0 -193
  145. package/src/templates/next-experiments/lib/scripts/generate.ts +0 -79
  146. package/src/templates/next-experiments/lib/store/app.ts +0 -11
  147. package/src/templates/next-experiments/lib/store/index.ts +0 -11
  148. package/src/templates/next-experiments/lib/styles/colors.ts +0 -63
  149. package/src/templates/next-experiments/lib/styles/config.ts +0 -34
  150. package/src/templates/next-experiments/lib/styles/css/global.css +0 -85
  151. package/src/templates/next-experiments/lib/styles/css/index.css +0 -6
  152. package/src/templates/next-experiments/lib/styles/css/reset.css +0 -166
  153. package/src/templates/next-experiments/lib/styles/css/root.css +0 -68
  154. package/src/templates/next-experiments/lib/styles/css/tailwind.css +0 -132
  155. package/src/templates/next-experiments/lib/styles/easings.ts +0 -21
  156. package/src/templates/next-experiments/lib/styles/index.ts +0 -12
  157. package/src/templates/next-experiments/lib/styles/layout.mjs +0 -27
  158. package/src/templates/next-experiments/lib/styles/scripts/README.md +0 -29
  159. package/src/templates/next-experiments/lib/styles/scripts/generate-root.ts +0 -57
  160. package/src/templates/next-experiments/lib/styles/scripts/generate-tailwind.ts +0 -162
  161. package/src/templates/next-experiments/lib/styles/scripts/postcss-functions.mjs +0 -168
  162. package/src/templates/next-experiments/lib/styles/scripts/setup-styles.ts +0 -24
  163. package/src/templates/next-experiments/lib/styles/scripts/utils.ts +0 -20
  164. package/src/templates/next-experiments/lib/styles/typography.ts +0 -36
  165. package/src/templates/next-experiments/lib/utils/css.d.ts +0 -21
  166. package/src/templates/next-experiments/lib/utils/math.test.ts +0 -221
  167. package/src/templates/next-experiments/lib/utils/strings.test.ts +0 -166
  168. package/src/templates/next-experiments/lib/utils/viewport.test.ts +0 -256
  169. package/src/templates/next-experiments/public/fonts/geist/Geist-Mono.woff2 +0 -0
  170. package/src/templates/next-webgl/components/ui/image/image.module.css +0 -5
  171. package/src/templates/next-webgl/lib/scripts/generate-component.ts +0 -322
  172. package/src/templates/next-webgl/lib/scripts/generate-page.ts +0 -193
  173. package/src/templates/next-webgl/lib/scripts/generate.ts +0 -79
  174. package/src/templates/next-webgl/lib/store/app.ts +0 -11
  175. package/src/templates/next-webgl/lib/store/index.ts +0 -11
  176. package/src/templates/next-webgl/lib/styles/colors.ts +0 -63
  177. package/src/templates/next-webgl/lib/styles/config.ts +0 -34
  178. package/src/templates/next-webgl/lib/styles/css/global.css +0 -85
  179. package/src/templates/next-webgl/lib/styles/css/index.css +0 -6
  180. package/src/templates/next-webgl/lib/styles/css/reset.css +0 -166
  181. package/src/templates/next-webgl/lib/styles/css/root.css +0 -68
  182. package/src/templates/next-webgl/lib/styles/css/tailwind.css +0 -132
  183. package/src/templates/next-webgl/lib/styles/easings.ts +0 -21
  184. package/src/templates/next-webgl/lib/styles/index.ts +0 -12
  185. package/src/templates/next-webgl/lib/styles/layout.mjs +0 -27
  186. package/src/templates/next-webgl/lib/styles/scripts/README.md +0 -29
  187. package/src/templates/next-webgl/lib/styles/scripts/generate-root.ts +0 -57
  188. package/src/templates/next-webgl/lib/styles/scripts/generate-tailwind.ts +0 -162
  189. package/src/templates/next-webgl/lib/styles/scripts/postcss-functions.mjs +0 -168
  190. package/src/templates/next-webgl/lib/styles/scripts/setup-styles.ts +0 -24
  191. package/src/templates/next-webgl/lib/styles/scripts/utils.ts +0 -20
  192. package/src/templates/next-webgl/lib/styles/typography.ts +0 -36
  193. package/src/templates/next-webgl/lib/utils/css.d.ts +0 -21
  194. package/src/templates/next-webgl/lib/utils/math.test.ts +0 -221
  195. package/src/templates/next-webgl/lib/utils/strings.test.ts +0 -166
  196. package/src/templates/next-webgl/lib/utils/viewport.test.ts +0 -256
  197. package/src/templates/next-webgl/public/fonts/geist/Geist-Mono.woff2 +0 -0
@@ -1,85 +0,0 @@
1
- /* GLOBAL CSS FILE - Contains global styles that shouldn't be reset */
2
-
3
- html {
4
- --scrollbar-gutter: 0px;
5
- scrollbar-gutter: stable; /* This is needed to prevent the scrollbar from jumping */
6
-
7
- &.lenis-stopped {
8
- --scrollbar-gutter: var(--scrollbar-width);
9
- }
10
- }
11
-
12
- html.overflow-hidden {
13
- overflow: hidden;
14
- touch-action: none;
15
- }
16
-
17
- body {
18
- min-height: 100vh;
19
- overscroll-behavior: none;
20
- background-color: var(--color-primary);
21
- color: var(--color-secondary);
22
- display: flex;
23
- flex-direction: column;
24
- -webkit-font-smoothing: antialiased;
25
- -moz-osx-font-smoothing: grayscale;
26
- }
27
-
28
- /* Selection styling */
29
- *::selection {
30
- background-color: var(--color-contrast);
31
- color: var(--color-primary);
32
- }
33
-
34
- /* SVG icon colors */
35
- svg.icon {
36
- path[fill],
37
- rect[fill],
38
- circle[fill] {
39
- fill: currentColor;
40
- }
41
- path[stroke],
42
- rect[stroke],
43
- circle[stroke] {
44
- stroke: currentColor;
45
- }
46
- }
47
-
48
- /* Hover states */
49
- .link {
50
- @media (--hover) {
51
- &:hover {
52
- text-decoration: underline;
53
- }
54
- }
55
- }
56
-
57
- /* Focus states */
58
- *:focus-visible {
59
- outline: 2px solid var(--color-contrast);
60
- }
61
-
62
- html.scrollbar-grabbing,
63
- img {
64
- -webkit-touch-callout: none;
65
- -webkit-user-select: none;
66
- -moz-user-select: none;
67
- -ms-user-select: none;
68
- -o-user-select: none;
69
- user-select: none;
70
- }
71
-
72
- button {
73
- cursor: pointer;
74
- /* Fix vertical text centering by trimming font metric space */
75
- text-box-trim: both;
76
- text-box-edge: cap alphabetic;
77
- user-select: none;
78
- }
79
-
80
- html.screenshot {
81
- *:not(:has(canvas), canvas, :has(#orchestra), #orchestra, #orchestra *) {
82
- /* biome-ignore lint: it's all good */
83
- opacity: 0 !important;
84
- }
85
- }
@@ -1,6 +0,0 @@
1
- /* INDEX CSS FILE - Barrel file for importing all the css files */
2
- @import "./reset.css";
3
- @import "tailwindcss/utilities.css";
4
- @import "./tailwind.css";
5
- @import "./root.css";
6
- @import "./global.css";
@@ -1,166 +0,0 @@
1
- /***
2
- The new CSS reset - version 1.11.3 (last updated 25.08.2024)
3
- GitHub page: https://github.com/elad2412/the-new-css-reset
4
- ***/
5
-
6
- /*
7
- Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property
8
- - The "symbol *" part is to solve Firefox SVG sprite bug
9
- - The "html" element is excluded, otherwise a bug in Chrome breaks the CSS hyphens property (https://github.com/elad2412/the-new-css-reset/issues/36)
10
- */
11
- *:where(
12
- :not(
13
- html,
14
- iframe,
15
- canvas,
16
- img,
17
- svg,
18
- video,
19
- audio,
20
- dialog,
21
- vercel-live-feedback,
22
- nextjs-portal,
23
- :where(select, option)
24
- ):not(svg *, symbol *)
25
- ) {
26
- all: unset;
27
- display: revert;
28
- }
29
-
30
- /* Preferred box-sizing value */
31
- *,
32
- *::before,
33
- *::after {
34
- box-sizing: border-box;
35
- }
36
-
37
- /* Fix mobile Safari increase font-size on landscape mode */
38
- html {
39
- -moz-text-size-adjust: none;
40
- -webkit-text-size-adjust: none;
41
- text-size-adjust: none;
42
- }
43
-
44
- /* Reapply the pointer cursor for anchor tags */
45
- a,
46
- button {
47
- cursor: revert;
48
- }
49
-
50
- /* Remove list styles (bullets/numbers) */
51
- ol,
52
- ul,
53
- menu,
54
- summary {
55
- list-style: none;
56
- }
57
-
58
- /* Firefox: solve issue where nested ordered lists continue numbering from parent (https://bugzilla.mozilla.org/show_bug.cgi?id=1881517) */
59
- ol {
60
- counter-reset: revert;
61
- }
62
-
63
- /* For images to not be able to exceed their container */
64
- img {
65
- max-inline-size: 100%;
66
- max-block-size: 100%;
67
- }
68
-
69
- /* removes spacing between cells in tables */
70
- table {
71
- border-collapse: collapse;
72
- }
73
-
74
- /* Safari - solving issue when using user-select:none on the <body> text input doesn't working */
75
- input,
76
- textarea {
77
- -webkit-user-select: auto;
78
- }
79
-
80
- /* revert the 'white-space' property for textarea elements on Safari */
81
- textarea {
82
- white-space: revert;
83
- }
84
-
85
- /* minimum style to allow to style meter element */
86
- meter {
87
- -webkit-appearance: revert;
88
- appearance: revert;
89
- }
90
-
91
- /* preformatted text - use only for this feature */
92
- :where(pre) {
93
- all: revert;
94
- box-sizing: border-box;
95
- }
96
-
97
- /* reset default text opacity of input placeholder */
98
- ::placeholder {
99
- color: unset;
100
- }
101
-
102
- /* fix the feature of 'hidden' attribute.
103
- display:revert; revert to element instead of attribute */
104
- :where([hidden]) {
105
- display: none;
106
- }
107
-
108
- /* revert for bug in Chromium browsers
109
- - fix for the content editable attribute will work properly.
110
- - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/
111
- :where([contenteditable]:not([contenteditable="false"])) {
112
- -moz-user-modify: read-write;
113
- -webkit-user-modify: read-write;
114
- overflow-wrap: break-word;
115
- -webkit-line-break: after-white-space;
116
- -webkit-user-select: auto;
117
- }
118
-
119
- /* apply back the draggable feature - exist only in Chromium and Safari */
120
- :where([draggable="true"]) {
121
- -webkit-user-drag: element;
122
- }
123
-
124
- /* Revert Modal native behavior */
125
- :where(dialog:modal) {
126
- all: revert;
127
- box-sizing: border-box;
128
- }
129
-
130
- /* Remove details summary webkit styles */
131
- ::-webkit-details-marker {
132
- display: none;
133
- }
134
-
135
- /* Add support for color-scheme */
136
- :root {
137
- color-scheme: light dark;
138
- }
139
-
140
- /* Add support for newer form controls */
141
- :where(input[type="file"]) {
142
- cursor: default;
143
- -webkit-appearance: none;
144
- appearance: none;
145
- }
146
-
147
- /* Improve text rendering */
148
- html {
149
- text-size-adjust: 100%;
150
- -webkit-text-size-adjust: 100%;
151
- -moz-text-size-adjust: 100%;
152
- text-rendering: optimizeLegibility;
153
- }
154
-
155
- /* Remove tap highlight on iOS */
156
- a,
157
- button {
158
- -webkit-tap-highlight-color: transparent;
159
- }
160
-
161
- /* Improve media defaults */
162
- video,
163
- audio {
164
- max-inline-size: 100%;
165
- max-block-size: 100%;
166
- }
@@ -1,68 +0,0 @@
1
- /*
2
- * THIS FILE IS GENERATED BY setup-styles.ts
3
- * DO NOT EDIT IT DIRECTLY.
4
- */
5
-
6
- @custom-media --hover (hover: hover);
7
- @custom-media --reduced-motion (prefers-reduced-motion: reduce);
8
- @custom-media --mobile (width <= 767.98px);
9
- @custom-media --desktop-large (width >= 1920px);
10
- @custom-media --desktop (width >= 1440px);
11
- @custom-media --tablet-lg (width >= 1024px);
12
- @custom-media --tablet (width >= 768px);
13
- @custom-media --mobile (width >= 640px);
14
-
15
- :root {
16
- --device-width: 640;
17
- --device-height: 650;
18
-
19
- --columns: 4;
20
- --gap: 16px;
21
- --safe: 16px;
22
-
23
- --header-height: 58px;
24
-
25
- --layout-width: calc(100vw - (2 * var(--safe)));
26
- --column-width: calc((var(--layout-width) - (var(--columns) - 1) * var(--gap)) / var(--columns));
27
-
28
- --ease-in-quad: cubic-bezier(0.55, 0.085, 0.68, 0.53);
29
- --ease-in-cubic: cubic-bezier(0.55, 0.055, 0.675, 0.19);
30
- --ease-in-quart: cubic-bezier(0.895, 0.03, 0.685, 0.22);
31
- --ease-in-quint: cubic-bezier(0.755, 0.05, 0.855, 0.06);
32
- --ease-in-expo: cubic-bezier(0.95, 0.05, 0.795, 0.035);
33
- --ease-in-circ: cubic-bezier(0.6, 0.04, 0.98, 0.335);
34
- --ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
35
- --ease-out-cubic: cubic-bezier(0.215, 0.61, 0.355, 1);
36
- --ease-out-quart: cubic-bezier(0.165, 0.84, 0.44, 1);
37
- --ease-out-quint: cubic-bezier(0.23, 1, 0.32, 1);
38
- --ease-out-expo: cubic-bezier(0.19, 1, 0.22, 1);
39
- --ease-out-circ: cubic-bezier(0.075, 0.82, 0.165, 1);
40
- --ease-in-out-quad: cubic-bezier(0.455, 0.03, 0.515, 0.955);
41
- --ease-in-out-cubic: cubic-bezier(0.645, 0.045, 0.355, 1);
42
- --ease-in-out-quart: cubic-bezier(0.77, 0, 0.175, 1);
43
- --ease-in-out-quint: cubic-bezier(0.86, 0, 0.07, 1);
44
- --ease-in-out-expo: cubic-bezier(1, 0, 0, 1);
45
- --ease-in-out-circ: cubic-bezier(0.785, 0.135, 0.15, 0.86);
46
- --ease-gleasing: cubic-bezier(0.4, 0, 0, 1);
47
-
48
- --color-black: #000000;
49
- --color-white: #ffffff;
50
- --color-orange: #FF4D00;
51
- --color-blue: #487CFF;
52
- --color-green: #00FF9B;
53
- --color-violet: #F101A5;
54
- --color-pink: #FF73A6;
55
- --color-gray: #666666;
56
-
57
- @variant desktop {
58
- --device-width: 1440;
59
- --device-height: 816;
60
-
61
- --columns: 12;
62
- --gap: 16px;
63
- --safe: 16px;
64
-
65
- --header-height: 98px;
66
- }
67
- }
68
-
@@ -1,132 +0,0 @@
1
- /*
2
- * THIS FILE IS GENERATED BY setup-styles.ts
3
- * DO NOT EDIT IT DIRECTLY.
4
- */
5
-
6
- /** Custom theme **/
7
- @theme {
8
- --breakpoint-*: initial;
9
- --breakpoint-desktop-large: 1920px;
10
- --breakpoint-desktop: 1440px;
11
- --breakpoint-tablet-lg: 1024px;
12
- --breakpoint-tablet: 768px;
13
- --breakpoint-mobile: 640px;
14
-
15
- --color-*: initial;
16
- --color-primary: #ffffff;
17
- --color-secondary: #000000;
18
- --color-contrast: #FF4D00;
19
- --color-black: #000000;
20
- --color-white: #ffffff;
21
- --color-orange: #FF4D00;
22
- --color-blue: #487CFF;
23
- --color-green: #00FF9B;
24
- --color-violet: #F101A5;
25
- --color-pink: #FF73A6;
26
- --color-gray: #666666;
27
-
28
- /* gray */
29
- --color-gray-50: #F5F5F5;
30
- --color-gray-100: #E0E0E0;
31
- --color-gray-200: #C2C2C2;
32
- --color-gray-300: #A3A3A3;
33
- --color-gray-400: #858585;
34
- --color-gray-500: #666666;
35
- --color-gray-600: #4D4D4D;
36
- --color-gray-700: #333333;
37
- --color-gray-800: #1A1A1A;
38
-
39
- --spacing: 0.25rem;
40
- --spacing-0: 0;
41
- --spacing-safe: var(--safe);
42
- --spacing-gap: var(--gap);
43
- --spacing-header-height: var(--header-height);
44
-
45
- --font-*: initial;
46
- --font-mono: var(--geist-mono);
47
-
48
- --ease-*: initial;
49
- --ease-in-quad: cubic-bezier(0.55, 0.085, 0.68, 0.53);
50
- --ease-in-cubic: cubic-bezier(0.55, 0.055, 0.675, 0.19);
51
- --ease-in-quart: cubic-bezier(0.895, 0.03, 0.685, 0.22);
52
- --ease-in-quint: cubic-bezier(0.755, 0.05, 0.855, 0.06);
53
- --ease-in-expo: cubic-bezier(0.95, 0.05, 0.795, 0.035);
54
- --ease-in-circ: cubic-bezier(0.6, 0.04, 0.98, 0.335);
55
- --ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
56
- --ease-out-cubic: cubic-bezier(0.215, 0.61, 0.355, 1);
57
- --ease-out-quart: cubic-bezier(0.165, 0.84, 0.44, 1);
58
- --ease-out-quint: cubic-bezier(0.23, 1, 0.32, 1);
59
- --ease-out-expo: cubic-bezier(0.19, 1, 0.22, 1);
60
- --ease-out-circ: cubic-bezier(0.075, 0.82, 0.165, 1);
61
- --ease-in-out-quad: cubic-bezier(0.455, 0.03, 0.515, 0.955);
62
- --ease-in-out-cubic: cubic-bezier(0.645, 0.045, 0.355, 1);
63
- --ease-in-out-quart: cubic-bezier(0.77, 0, 0.175, 1);
64
- --ease-in-out-quint: cubic-bezier(0.86, 0, 0.07, 1);
65
- --ease-in-out-expo: cubic-bezier(1, 0, 0, 1);
66
- --ease-in-out-circ: cubic-bezier(0.785, 0.135, 0.15, 0.86);
67
- --ease-gleasing: cubic-bezier(0.4, 0, 0, 1);
68
- }
69
-
70
- /** Custom theme overwrites **/
71
- [data-theme=light] {
72
- --color-primary: #ffffff;
73
- --color-secondary: #000000;
74
- --color-contrast: #FF4D00;
75
- }
76
- [data-theme=dark] {
77
- --color-primary: #000000;
78
- --color-secondary: #ffffff;
79
- --color-contrast: #FF4D00;
80
- }
81
-
82
-
83
- /** Custom static utilities **/
84
- @utility test-mono {
85
- font-family: var(--geist-mono);
86
- font-style: normal;
87
- font-weight: 400;
88
- line-height: 90%;
89
- letter-spacing: 0em;
90
- font-size: 20px;
91
- @variant desktop { font-size: 24px; }
92
- }
93
-
94
- @utility desktop-only {
95
- @media (--mobile) {
96
- display: none !important;
97
- }
98
- }
99
-
100
- @utility mobile-only {
101
- @media (--desktop) {
102
- display: none !important;
103
- }
104
- }
105
-
106
- @utility b-grid {
107
- display: grid;
108
- grid-template-columns: repeat(var(--columns), 1fr);
109
- column-gap: var(--gap);
110
- }
111
-
112
- @utility b-layout-block {
113
- margin-inline: auto;
114
- width: calc(100% - 2 * var(--safe));
115
- }
116
-
117
- @utility b-layout-block-inner {
118
- padding-inline: var(--safe);
119
- width: 100%;
120
- }
121
-
122
- @utility b-layout-grid {
123
- @apply b-layout-block b-grid;
124
- }
125
-
126
- @utility b-layout-grid-inner {
127
- @apply b-layout-block-inner b-grid;
128
- }
129
-
130
- /** Custom variants **/
131
- @custom-variant light (&:where([data-theme=light], [data-theme=light] *));
132
- @custom-variant dark (&:where([data-theme=dark], [data-theme=dark] *));
@@ -1,21 +0,0 @@
1
- export const easings = {
2
- "in-quad": "cubic-bezier(0.55, 0.085, 0.68, 0.53)",
3
- "in-cubic": "cubic-bezier(0.55, 0.055, 0.675, 0.19)",
4
- "in-quart": "cubic-bezier(0.895, 0.03, 0.685, 0.22)",
5
- "in-quint": "cubic-bezier(0.755, 0.05, 0.855, 0.06)",
6
- "in-expo": "cubic-bezier(0.95, 0.05, 0.795, 0.035)",
7
- "in-circ": "cubic-bezier(0.6, 0.04, 0.98, 0.335)",
8
- "out-quad": "cubic-bezier(0.25, 0.46, 0.45, 0.94)",
9
- "out-cubic": "cubic-bezier(0.215, 0.61, 0.355, 1)",
10
- "out-quart": "cubic-bezier(0.165, 0.84, 0.44, 1)",
11
- "out-quint": "cubic-bezier(0.23, 1, 0.32, 1)",
12
- "out-expo": "cubic-bezier(0.19, 1, 0.22, 1)",
13
- "out-circ": "cubic-bezier(0.075, 0.82, 0.165, 1)",
14
- "in-out-quad": "cubic-bezier(0.455, 0.03, 0.515, 0.955)",
15
- "in-out-cubic": "cubic-bezier(0.645, 0.045, 0.355, 1)",
16
- "in-out-quart": "cubic-bezier(0.77, 0, 0.175, 1)",
17
- "in-out-quint": "cubic-bezier(0.86, 0, 0.07, 1)",
18
- "in-out-expo": "cubic-bezier(1, 0, 0, 1)",
19
- "in-out-circ": "cubic-bezier(0.785, 0.135, 0.15, 0.86)",
20
- gleasing: "cubic-bezier(0.4, 0, 0, 1)",
21
- }
@@ -1,12 +0,0 @@
1
- /**
2
- * Styling System
3
- *
4
- * Import from barrel:
5
- * import { colors, themes, breakpoints } from '@/styles'
6
- */
7
-
8
- export { colors, type Themes, themeNames, themes } from "./colors"
9
- export type { ThemeName } from "./config"
10
- export { breakpoints, customSizes, layout, screens } from "./config"
11
- export { easings } from "./easings"
12
- export { fontsVariable } from "./fonts"
@@ -1,27 +0,0 @@
1
- // THIS FILE HAS TO STAY .mjs AS ITS CONSUMED BY POSTCSS
2
- // EDIT THIS AS NEEDED
3
-
4
- const breakpoints = {
5
- "desktop-large": 1920,
6
- desktop: 1440,
7
- "tablet-lg": 1024,
8
- tablet: 768,
9
- mobile: 640,
10
- }
11
-
12
- const screens = {
13
- mobile: { width: breakpoints.mobile, height: 650 },
14
- desktop: { width: breakpoints.desktop, height: 816 },
15
- }
16
-
17
- const layout = {
18
- columns: { mobile: 4, desktop: 12 },
19
- gap: { mobile: 16, desktop: 16 },
20
- safe: { mobile: 16, desktop: 16 },
21
- }
22
-
23
- const customSizes = {
24
- "header-height": { mobile: 58, desktop: 98 },
25
- }
26
-
27
- export { breakpoints, customSizes, layout, screens }
@@ -1,29 +0,0 @@
1
- # Style Generation Scripts
2
-
3
- Generate CSS from TypeScript config. Run with `bun setup:styles`.
4
-
5
- ## Scripts
6
-
7
- | Script | Output |
8
- |--------|--------|
9
- | `setup-styles.ts` | Orchestrates all generation |
10
- | `generate-root.ts` | → `css/root.css` |
11
- | `generate-tailwind.ts` | → `css/tailwind.css` |
12
- | `generate-scale.ts` | Scale utilities |
13
- | `postcss-functions.mjs` | `tovw()`, `torem()`, `toem()`, `columns()` |
14
-
15
- ## Build Flow
16
-
17
- ```
18
- TypeScript Config → Generation Scripts → CSS Variables → PostCSS → Output
19
- ```
20
-
21
- 1. Edit `colors.ts`, `typography.ts`, etc.
22
- 2. Run `bun setup:styles`
23
- 3. Generated CSS is used by PostCSS
24
-
25
- ## Best Practices
26
-
27
- - Always run `bun setup:styles` after config changes
28
- - Never edit `css/root.css` or `css/tailwind.css` directly
29
- - Use `bun dev` for development (includes style watching)
@@ -1,57 +0,0 @@
1
- import type { Config } from "../config"
2
- import { formatObject } from "./utils"
3
-
4
- export function generateRoot({
5
- breakpoints,
6
- colors,
7
- customSizes,
8
- easings,
9
- layout,
10
- screens,
11
- }: Pick<
12
- Config,
13
- "breakpoints" | "colors" | "customSizes" | "easings" | "layout" | "screens"
14
- >) {
15
- return `@custom-media --hover (hover: hover);
16
- @custom-media --reduced-motion (prefers-reduced-motion: reduce);
17
- @custom-media --mobile (width <= ${breakpoints.tablet - 0.02}px);
18
- ${formatObject(breakpoints, ([name, value]) => `@custom-media --${name} (width >= ${value}px);`, "\n")}
19
-
20
- :root {
21
- --device-width: ${screens.mobile.width};
22
- --device-height: ${screens.mobile.height};
23
-
24
- ${formatObject(layout, ([name, { mobile }]) => {
25
- if (name === "columns") return `--columns: ${mobile};`
26
-
27
- return `--${name}: ${mobile}px;`
28
- })}
29
-
30
- ${formatObject(customSizes, ([name, { mobile }]) => `--${name}: ${mobile}px;`)}
31
-
32
- --layout-width: calc(100vw - (2 * var(--safe)));
33
- --column-width: calc((var(--layout-width) - (var(--columns) - 1) * var(--gap)) / var(--columns));
34
-
35
- ${formatObject(easings, ([name, value]) => `--ease-${name}: ${value};`)}
36
-
37
- ${formatObject(colors, ([name, value]) => `--color-${name}: ${value};`)}
38
-
39
- @variant desktop {
40
- --device-width: ${screens.desktop.width};
41
- --device-height: ${screens.desktop.height};
42
-
43
- ${formatObject(
44
- layout,
45
- ([name, { desktop }]) => {
46
- if (name === "columns") return `--columns: ${desktop};`
47
-
48
- return `--${name}: ${desktop}px;`
49
- },
50
- "\n\t\t"
51
- )}
52
-
53
- ${formatObject(customSizes, ([name, { desktop }]) => `--${name}: ${desktop}px;`, "\n\t\t")}
54
- }
55
- }
56
- `
57
- }