astro-accelerator 6.0.11 → 6.0.13

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
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "6.0.11",
2
+ "version": "6.0.13",
3
3
  "author": "Steve Fenton",
4
4
  "name": "astro-accelerator",
5
5
  "description": "A super-lightweight, accessible, SEO-friendly starter project for Astro",
@@ -37,7 +37,7 @@
37
37
  "@astrojs/mdx": "^5.0.3",
38
38
  "@img/sharp-linux-x64": "^0.34.5",
39
39
  "astro": "^6.1.5",
40
- "astro-accelerator-utils": "^0.3.79",
40
+ "astro-accelerator-utils": "^0.3.80",
41
41
  "csv": "^6.5.1",
42
42
  "hast-util-from-selector": "^3.0.1",
43
43
  "html-to-text": "^9.0.5",
@@ -59,6 +59,7 @@ function sanitise(string) {
59
59
  string
60
60
  .trim()
61
61
  .normalize('NFD')
62
+ .replace(/./g, ' ')
62
63
  .replace(/[\u0300-\u036f]/g, '')
63
64
  .toLowerCase()
64
65
  .replace(/-/g, '');
@@ -358,40 +358,11 @@ function initializeSearch() {
358
358
 
359
359
  const path = document.createElement('div');
360
360
  path.className = 'result-path';
361
-
362
- // Split the path into segments, filter out empty segments (in case of leading slash)
363
- const segments = address.pathname.split('/').filter(Boolean);
364
-
365
- segments.forEach((segment, index) => {
366
- const words = segment.replace(/-/g, ' ').split(' ');
367
- const processedSegment = words
368
- .map((word, index) =>
369
- index === 0
370
- ? word.charAt(0).toUpperCase() +
371
- word.slice(1).toLowerCase()
372
- : word.toLowerCase()
373
- )
374
- .join(' ');
375
-
376
- const segmentSpan = document.createElement('span');
377
- segmentSpan.className = 'result-path-segment';
378
- segmentSpan.textContent = processedSegment;
379
- path.appendChild(segmentSpan);
380
-
381
- if (index < segments.length - 1) {
382
- const svgIcon = document.createElement('span');
383
- svgIcon.className = 'result-path-icon';
384
- svgIcon.innerHTML = `
385
- <svg xmlns="http://www.w3.org/2000/svg" width="6" height="10" viewBox="0 0 6 10">
386
- <path d="M1 9L5 5L1 1" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
387
- </svg>
388
- `;
389
- path.appendChild(svgIcon);
390
- }
391
- });
361
+ path.innerText = address.pathname;
392
362
 
393
363
  const listElementDescription = document.createElement('p');
394
364
  listElementDescription.className = 'result-description';
365
+
395
366
  // Only highlight user query terms, not stemmed terms
396
367
  listElementDescription.innerHTML = highlight(
397
368
  needle.description,
@@ -489,8 +460,8 @@ function initializeSearch() {
489
460
  throw new Error('Cannot find .site-search-query');
490
461
  }
491
462
 
492
- // Words chained with . are combined, i.e. System.Text is "systemtext"
493
- var s = input.value.replace(/\./g, '').trim();
463
+ // Words chained with . are exploded, i.e. System.Text is "system text"
464
+ var s = input.value.replace(/\./g, ' ').trim();
494
465
 
495
466
  if (!s) {
496
467
  const address = window.location.href.split('?')[0];
@@ -36,56 +36,112 @@ const accelerator = new Accelerator(SITE);
36
36
  </div>
37
37
 
38
38
  <style is:global>
39
+ .site-search-wrapper {
40
+ width: 100%;
41
+ }
42
+
39
43
  .site-search-wrapper fieldset {
40
44
  height: 100%;
41
45
  display: flex;
42
- align-items: center;
46
+ gap: 0.75rem;
47
+ align-items: stretch;
43
48
  padding: 0;
44
49
  }
45
50
 
46
51
  .site-search-wrapper input {
47
52
  background-color: var(--aft-block);
48
53
  border-radius: var(--block-radius);
54
+ border: 2px solid var(--fore-link);
49
55
  color: var(--fore);
50
- font-size: 1.3rem;
51
- padding: 0.5em;
56
+ font-size: 1.1rem;
57
+ font-family: var(--content-font);
58
+ padding: 0.75em 1em;
59
+ flex: 1;
60
+ transition: border-color 0.2s ease, box-shadow 0.2s ease;
52
61
  }
53
62
 
54
- .site-search-wrapper input {
55
- width: calc(100% - 110px);
63
+ .site-search-wrapper input::placeholder {
64
+ color: var(--fore-block);
65
+ opacity: 0.7;
56
66
  }
57
67
 
58
68
  .site-search-wrapper button {
59
- width: 80px;
69
+ width: 100px;
70
+ border-radius: var(--block-radius);
71
+ background-color: var(--fore-link);
72
+ color: var(--aft);
73
+ font-family: var(--content-font);
74
+ font-size: 1rem;
75
+ font-weight: 600;
76
+ border: none;
77
+ cursor: pointer;
78
+ transition: background-color 0.2s ease, transform 0.1s ease;
79
+ }
80
+
81
+ .site-search-wrapper button:hover {
82
+ background-color: var(--fore-link-alt);
83
+ }
84
+
85
+ .site-search-wrapper button:active {
86
+ transform: scale(0.98);
87
+ }
88
+
89
+ .site-search-results {
90
+ margin-top: 2rem;
60
91
  }
61
92
 
62
93
  .site-search-results ul.site-search-results-list {
63
94
  list-style-type: none;
64
- margin-block: 1rem;
95
+ margin-block: 0;
65
96
  margin-inline: 0;
97
+ padding: 0;
98
+ display: flex;
99
+ flex-direction: column;
100
+ gap: 1.5rem;
66
101
  }
67
102
 
68
103
  .site-search-results li.site-search-results-item {
69
104
  list-style-type: none;
70
- margin: var(--block-gap-l) 0 var(--block-gap-l) 0;
105
+ padding: var(--paragraph-margin);
106
+ background-color: var(--aft-block);
107
+ border-radius: var(--block-radius);
108
+ box-shadow: var(--box-shadow-slight);
109
+ color: var(--fore-block);
110
+ transition: box-shadow 0.2s ease, transform 0.2s ease;
111
+ }
112
+
113
+ .site-search-results li.site-search-results-item:hover {
114
+ box-shadow: var(--box-shadow);
115
+ transform: translateY(-2px);
71
116
  }
72
117
 
73
118
  .site-search-results-item a {
74
119
  text-decoration: none;
120
+ display: block;
75
121
  }
76
122
 
77
123
  .site-search-results .show-more {
78
- margin-block-start: 1rem;
79
124
  display: inline-block;
80
- font-size: 1.2rem;
125
+ font-size: 1rem;
126
+ font-family: var(--content-font);
81
127
  border-radius: 100px;
82
128
  text-decoration: none;
83
129
  text-align: center;
84
- padding: 0.2em 0.6em 0.3em 0.6em;
85
- color: var(--aft-link-alt);
130
+ padding: 0.6em 1.5em;
131
+ margin-top: 1.5rem;
132
+ color: var(--aft);
86
133
  background-color: var(--fore-link);
87
134
  cursor: pointer;
88
135
  width: auto;
136
+ transition: background-color 0.2s ease, transform 0.1s ease;
137
+ }
138
+
139
+ .site-search-results .show-more:hover {
140
+ background-color: var(--fore-link-alt);
141
+ }
142
+
143
+ .site-search-results .show-more:active {
144
+ transform: scale(0.98);
89
145
  }
90
146
 
91
147
  .result-wrapper mark,
@@ -96,36 +152,74 @@ const accelerator = new Accelerator(SITE);
96
152
  }
97
153
 
98
154
  .result-path {
99
- display: none;
100
- }
101
-
102
- .result-path-icon {
103
- stroke: var(--fore);
155
+ font-size: 0.85rem;
156
+ color: var(--fore-block);
157
+ opacity: 0.7;
158
+ margin-bottom: 0.25rem;
159
+ white-space: nowrap;
160
+ overflow: hidden;
161
+ text-overflow: ellipsis;
104
162
  }
105
163
 
106
164
  .result-path-segment:last-child {
107
165
  color: var(--fore-link);
166
+ font-weight: 600;
167
+ }
168
+
169
+ .result-path-icon {
170
+ stroke: var(--fore-block);
171
+ opacity: 0.5;
108
172
  }
109
173
 
110
174
  .result-title {
111
175
  color: var(--fore-link);
112
- font-size: 1.5rem;
176
+ font-size: 1.35rem;
113
177
  font-weight: 700;
178
+ font-family: var(--heading-font);
179
+ line-height: 1.3;
180
+ margin-bottom: 0.5rem;
114
181
  }
115
182
 
116
183
  .result-description {
117
184
  color: var(--fore-block);
118
185
  font-size: 1rem;
119
186
  font-weight: 400;
187
+ font-family: var(--content-font);
120
188
  margin: 0;
189
+ line-height: 1.6;
121
190
  }
122
191
 
123
192
  .result-headings {
124
193
  list-style: none;
125
- font-size: 1rem;
194
+ font-size: 0.95rem;
195
+ margin-top: 0.5rem;
196
+ padding-inline-start: 0;
197
+ }
198
+
199
+ .result-headings li {
200
+ padding: 0 0 calc(var(--paragraph-margin) / 2) 0;
201
+ list-style-type: '➜ ';
126
202
  }
127
203
 
128
- .result-headings li:not(:last-child) {
129
- text-align: left;
204
+ @media (max-width: 600px) {
205
+ .site-search-wrapper fieldset {
206
+ flex-direction: column;
207
+ }
208
+
209
+ .site-search-wrapper input {
210
+ width: unset;
211
+ }
212
+
213
+ .site-search-wrapper button {
214
+ width: 100%;
215
+ }
216
+
217
+ .site-search-results li.site-search-results-item {
218
+ padding: 1rem;
219
+ }
220
+
221
+ .result-title {
222
+ font-size: 1.2rem;
223
+ }
130
224
  }
131
225
  </style>