ultimate-jekyll-manager 0.0.56 → 0.0.57

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/README.md CHANGED
@@ -60,6 +60,11 @@ npm start -- --debug=true
60
60
  npm start -- --ujPluginDevMode=true
61
61
  ```
62
62
 
63
+ ### Other ENV variables
64
+ ```bash
65
+ UJ_PURGECSS=true # Enables PurgeCSS to remove unused CSS (normally only happens in production builds)
66
+ ```
67
+
63
68
  ## Running Specific Tasks
64
69
  You can run specific tasks using the `npm run gulp` command with the appropriate task name.
65
70
 
@@ -81,6 +86,14 @@ npx uj audit -- --lighthouseUrl="/contact" --autoExit=false
81
86
 
82
87
  ### Run the `translation` task:
83
88
  ```bash
89
+ # Test translation with GitHub cache (requires GH_TOKEN and GITHUB_REPOSITORY)
90
+ GH_TOKEN=XXX \
91
+ GITHUB_REPOSITORY=XXX \
92
+ UJ_TRANSLATION_CACHE=true \
93
+ npx uj translation
94
+
95
+ # Test with only 1 file
96
+ UJ_TRANSLATION_ONLY="index.html" \
84
97
  GH_TOKEN=XXX \
85
98
  GITHUB_REPOSITORY=XXX \
86
99
  UJ_TRANSLATION_CACHE=true \
@@ -13,6 +13,7 @@
13
13
  border-radius: 50%;
14
14
  right: 20px;
15
15
  bottom: 20px;
16
+ bottom: max(20px, calc(20px + env(safe-area-inset-bottom, 0px)));
16
17
  transition: background 0.5s;
17
18
  z-index: 11;
18
19
  box-shadow: rgba(0, 0, 0, 0.16) 0px 2px 10px 0px;
@@ -42,5 +43,6 @@
42
43
  @media (max-width: 768px) {
43
44
  #prechat-btn {
44
45
  bottom: 15px;
46
+ bottom: max(15px, calc(15px + env(safe-area-inset-bottom, 0px)));
45
47
  }
46
48
  }
@@ -25,16 +25,19 @@
25
25
  // Position variants
26
26
  &.cookie-consent-bottom-left {
27
27
  bottom: 1rem;
28
+ bottom: max(1rem, calc(1rem + env(safe-area-inset-bottom, 0px)));
28
29
  left: 1rem;
29
30
  }
30
31
 
31
32
  &.cookie-consent-bottom-right {
32
33
  bottom: 1rem;
34
+ bottom: max(1rem, calc(1rem + env(safe-area-inset-bottom, 0px)));
33
35
  right: 1rem;
34
36
  }
35
37
 
36
38
  &.cookie-consent-bottom {
37
39
  bottom: 1rem;
40
+ bottom: max(1rem, calc(1rem + env(safe-area-inset-bottom, 0px)));
38
41
  left: 50%;
39
42
  transform: translateX(-50%) translateY(1rem);
40
43
  max-width: 90%;
@@ -193,18 +196,21 @@
193
196
  // Bottom position variants
194
197
  &.cookie-consent-minimized-bottom-left {
195
198
  bottom: 0;
199
+ bottom: env(safe-area-inset-bottom, 0px);
196
200
  left: 2rem;
197
201
  border-radius: 0.5rem 0.5rem 0 0;
198
202
  }
199
203
 
200
204
  &.cookie-consent-minimized-bottom-right {
201
205
  bottom: 0;
206
+ bottom: env(safe-area-inset-bottom, 0px);
202
207
  right: 2rem;
203
208
  border-radius: 0.5rem 0.5rem 0 0;
204
209
  }
205
210
 
206
211
  &.cookie-consent-minimized-bottom-center {
207
212
  bottom: 0;
213
+ bottom: env(safe-area-inset-bottom, 0px);
208
214
  left: 50%;
209
215
  transform: translateX(-50%) translateY(100%);
210
216
  border-radius: 0.5rem 0.5rem 0 0;
@@ -2,6 +2,17 @@
2
2
  Initialize styles for the application.
3
3
  */
4
4
 
5
+ // Enable safe area insets for mobile browsers
6
+ html {
7
+ // Ensure viewport-fit=cover works properly
8
+ padding: env(safe-area-inset-top, 0) env(safe-area-inset-right, 0) env(safe-area-inset-bottom, 0) env(safe-area-inset-left, 0);
9
+ }
10
+
11
+ // Reset body padding to prevent double safe area spacing
12
+ body {
13
+ padding: 0;
14
+ }
15
+
5
16
  @font-face {
6
17
  font-display: auto;
7
18
  }
@@ -5,6 +5,7 @@
5
5
  .navbar-wrapper {
6
6
  position: fixed;
7
7
  top: 1rem;
8
+ top: max(1rem, env(safe-area-inset-top, 1rem));
8
9
  left: 0;
9
10
  right: 0;
10
11
  z-index: 1030;
@@ -19,6 +20,13 @@
19
20
  padding-right: var(--bs-gutter-x, 0.75rem);
20
21
  padding-left: var(--bs-gutter-x, 0.75rem);
21
22
 
23
+ // XS screens (less than 576px) - maintain margin
24
+ @media (max-width: 575.98px) {
25
+ max-width: calc(100% - 2rem);
26
+ margin-left: auto;
27
+ margin-right: auto;
28
+ }
29
+
22
30
  @media (min-width: 576px) {
23
31
  max-width: 540px;
24
32
  }
@@ -106,34 +106,69 @@ function sass(complete) {
106
106
  // Apply PurgeCSS if enabled
107
107
  if (ENABLE_PURGECSS) {
108
108
  logger.log('PurgeCSS enabled - removing unused CSS');
109
- stream = stream.pipe(postcss([
110
- purgeCss({
111
- content: [
112
- // All Ultimate Jekyll defaults EXCEPT themes subdirectories
113
- `${rootPathPackage}/dist/defaults/**/*.{html,liquid,md}`,
114
109
 
115
- // Explicitly exclude ALL theme directories, then include only the active theme
116
- `!${rootPathPackage}/dist/defaults/**/_includes/themes/**`,
117
- `!${rootPathPackage}/dist/defaults/**/_layouts/themes/**`,
110
+ // Define content patterns for PurgeCSS
111
+ const contentPatterns = [
112
+ // All Ultimate Jekyll defaults EXCEPT themes subdirectories
113
+ `${rootPathPackage}/dist/defaults/**/*.{html,liquid,md}`,
114
+
115
+ // Explicitly exclude ALL theme directories, then include only the active theme
116
+ `!${rootPathPackage}/dist/defaults/**/_includes/themes/**`,
117
+ `!${rootPathPackage}/dist/defaults/**/_layouts/themes/**`,
118
+
119
+ // Exclude test pages that include all components (would prevent PurgeCSS from working)
120
+ `!${rootPathPackage}/dist/defaults/**/pages/test/**/*.{html,liquid,md}`,
121
+
122
+ // Include ONLY the active theme's files
123
+ `${rootPathPackage}/dist/defaults/**/_includes/themes/${config.theme.id}/**/*.{html,liquid,md}`,
124
+ `${rootPathPackage}/dist/defaults/**/_layouts/themes/${config.theme.id}/**/*.{html,liquid,md}`,
118
125
 
119
- // Include ONLY the active theme's files
120
- `${rootPathPackage}/dist/defaults/**/_includes/themes/${config.theme.id}/**/*.{html,liquid,md}`,
121
- `${rootPathPackage}/dist/defaults/**/_layouts/themes/${config.theme.id}/**/*.{html,liquid,md}`,
126
+ // Project HTML
127
+ 'src/**/*.{html,liquid,md}',
128
+ 'dist/**/*.{html,liquid,md}',
122
129
 
123
- // Project HTML
124
- 'src/**/*.{html,liquid,md}',
125
- 'dist/**/*.{html,liquid,md}',
130
+ // Main JS
131
+ `${rootPathPackage}/dist/assets/js/**/*.js`,
132
+ `${rootPathPackage}/node_modules/web-manager/**/*.js`,
126
133
 
127
- // Main JS
128
- `${rootPathPackage}/dist/assets/js/**/*.js`,
129
- `${rootPathPackage}/node_modules/web-manager/**/*.js`,
134
+ // Theme JS
135
+ `${rootPathPackage}/dist/assets/themes/${config.theme.id}/**/*.js`,
130
136
 
131
- // Theme JS
132
- `${rootPathPackage}/dist/assets/themes/${config.theme.id}/**/*.js`,
137
+ // Project JS
138
+ 'src/assets/js/**/*.js',
139
+ ];
133
140
 
134
- // Project JS
135
- 'src/assets/js/**/*.js',
136
- ],
141
+ // Log the files that will be analyzed
142
+ logger.log('PurgeCSS content patterns:', contentPatterns);
143
+
144
+ // Separate inclusion and exclusion patterns for glob
145
+ const includePatterns = contentPatterns.filter(p => !p.startsWith('!'));
146
+ const excludePatterns = contentPatterns.filter(p => p.startsWith('!')).map(p => p.substring(1));
147
+
148
+ // Use glob to get the actual files (respecting exclusions)
149
+ const allFiles = glob(includePatterns, { ignore: excludePatterns });
150
+
151
+ logger.log(`PurgeCSS will analyze ${allFiles.length} total files:`);
152
+
153
+ // Group files by type for better readability
154
+ const fileGroups = {
155
+ 'HTML/Liquid/MD files': allFiles.filter(f => /\.(html|liquid|md)$/.test(f)),
156
+ 'JavaScript files': allFiles.filter(f => /\.js$/.test(f))
157
+ };
158
+
159
+ Object.entries(fileGroups).forEach(([groupName, files]) => {
160
+ if (files.length > 0) {
161
+ logger.log(` ${groupName}: ${files.length} files`);
162
+ // Show first 5 files as examples
163
+ files.forEach(file => {
164
+ logger.log(` - ${file}`);
165
+ });
166
+ }
167
+ });
168
+
169
+ stream = stream.pipe(postcss([
170
+ purgeCss({
171
+ content: contentPatterns,
137
172
  // Safelist patterns for dynamic classes
138
173
  safelist: {
139
174
  standard: [
@@ -175,9 +210,6 @@ function sass(complete) {
175
210
  /^animate-/,
176
211
  /^animation-/,
177
212
 
178
- // Spinner
179
- /^spinner-/,
180
-
181
213
  // Utilities that might be added dynamically
182
214
  /^[mp][trblxy]?-[0-9]+$/,
183
215
  /^text-/,
@@ -199,13 +231,12 @@ function sass(complete) {
199
231
  /^min-/,
200
232
  /^max-/,
201
233
  ],
202
- deep: [
203
- // For third-party libraries that might inject styles
204
- /^ck-/, // CKEditor
205
- /^tox-/, // TinyMCE
206
- /^swal2-/, // SweetAlert2
207
- ],
208
- greedy: []
234
+ deep: [],
235
+ greedy: [],
236
+ // Preserve keyframe animations
237
+ keyframes: [
238
+ /^spinner-/
239
+ ]
209
240
  },
210
241
  // Don't remove CSS variables
211
242
  variables: true,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ultimate-jekyll-manager",
3
- "version": "0.0.56",
3
+ "version": "0.0.57",
4
4
  "description": "Ultimate Jekyll dependency manager",
5
5
  "main": "dist/index.js",
6
6
  "exports": {