accessibility-widgets 2.0.6 → 2.0.7
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 +78 -34
- package/package.json +1 -1
- package/widget.js +1 -1
package/README.md
CHANGED
|
@@ -157,28 +157,35 @@ window.ACCESSIBILITY_WIDGET_CONFIG = {
|
|
|
157
157
|
|
|
158
158
|
```javascript
|
|
159
159
|
window.ACCESSIBILITY_WIDGET_CONFIG = {
|
|
160
|
-
// ===== Feature Toggles =====
|
|
161
|
-
enableHighContrast: true,
|
|
162
|
-
enableBiggerText: true,
|
|
163
|
-
enableTextSpacing: true,
|
|
164
|
-
enablePauseAnimations: true,
|
|
165
|
-
enableHideImages: true,
|
|
166
|
-
enableDyslexiaFont: true,
|
|
167
|
-
enableBiggerCursor: true,
|
|
168
|
-
enableLineHeight: true,
|
|
169
|
-
enableTextAlign: true,
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
160
|
+
// ===== Core Feature Toggles =====
|
|
161
|
+
enableHighContrast: true, // 3-level high contrast mode
|
|
162
|
+
enableBiggerText: true, // 4-level text size control
|
|
163
|
+
enableTextSpacing: true, // 3-level text spacing
|
|
164
|
+
enablePauseAnimations: true, // Pause animations & reduced motion
|
|
165
|
+
enableHideImages: true, // Hide images toggle
|
|
166
|
+
enableDyslexiaFont: true, // Dyslexia-friendly fonts
|
|
167
|
+
enableBiggerCursor: true, // Large cursor
|
|
168
|
+
enableLineHeight: true, // 3-level line height (2em, 3em, 4em)
|
|
169
|
+
enableTextAlign: true, // Text alignment (left, center, right)
|
|
170
|
+
|
|
171
|
+
// ===== Advanced Features =====
|
|
172
|
+
enableScreenReader: true, // Built-in text-to-speech
|
|
173
|
+
enableVoiceControl: true, // Voice command control
|
|
174
|
+
enableFontSelection: true, // Font family selection
|
|
175
|
+
enableColorFilter: true, // Color blindness filters
|
|
174
176
|
|
|
175
177
|
// ===== Widget Layout =====
|
|
176
178
|
widgetWidth: '440px',
|
|
177
|
-
|
|
179
|
+
|
|
180
|
+
// ===== Grid Configuration =====
|
|
181
|
+
gridLayout: {
|
|
182
|
+
columns: '1fr 1fr', // Default 2-column grid
|
|
183
|
+
gap: '10px' // Gap between grid items
|
|
184
|
+
},
|
|
178
185
|
|
|
179
186
|
// ===== Position =====
|
|
180
187
|
widgetPosition: {
|
|
181
|
-
side: 'right',
|
|
188
|
+
side: 'right', // 'left' or 'right'
|
|
182
189
|
right: '20px',
|
|
183
190
|
left: '20px',
|
|
184
191
|
bottom: '20px'
|
|
@@ -186,11 +193,11 @@ window.ACCESSIBILITY_WIDGET_CONFIG = {
|
|
|
186
193
|
|
|
187
194
|
// ===== Colors =====
|
|
188
195
|
colors: {
|
|
189
|
-
primary: '#1663d7',
|
|
190
|
-
secondary: '#ffffff',
|
|
191
|
-
optionBg: '#ffffff',
|
|
192
|
-
optionText: '#333333',
|
|
193
|
-
optionIcon: '#000000'
|
|
196
|
+
primary: '#1663d7', // Header bg, main button, active borders
|
|
197
|
+
secondary: '#ffffff', // Main button icon, header text
|
|
198
|
+
optionBg: '#ffffff', // Option button background
|
|
199
|
+
optionText: '#333333', // Option button text
|
|
200
|
+
optionIcon: '#000000' // Option button icons
|
|
194
201
|
},
|
|
195
202
|
|
|
196
203
|
// ===== Button Styling =====
|
|
@@ -201,17 +208,37 @@ window.ACCESSIBILITY_WIDGET_CONFIG = {
|
|
|
201
208
|
shadow: '0 4px 8px rgba(0, 0, 0, 0.2)'
|
|
202
209
|
},
|
|
203
210
|
|
|
211
|
+
// ===== Menu Styling =====
|
|
212
|
+
menu: {
|
|
213
|
+
headerHeight: '70px',
|
|
214
|
+
padding: '0 10px 10px 10px',
|
|
215
|
+
optionPadding: '20px 10px',
|
|
216
|
+
optionMargin: '10px',
|
|
217
|
+
borderRadius: '8px',
|
|
218
|
+
fontSize: '16px',
|
|
219
|
+
titleFontSize: '16px',
|
|
220
|
+
closeButtonSize: '44px'
|
|
221
|
+
},
|
|
222
|
+
|
|
204
223
|
// ===== Typography =====
|
|
205
224
|
typography: {
|
|
206
225
|
fontFamily: 'Arial, sans-serif',
|
|
207
226
|
fontSize: '17px',
|
|
208
227
|
titleFontSize: '22px',
|
|
209
|
-
titleFontWeight: '700'
|
|
228
|
+
titleFontWeight: '700',
|
|
229
|
+
lineHeight: '1'
|
|
230
|
+
},
|
|
231
|
+
|
|
232
|
+
// ===== Animation =====
|
|
233
|
+
animation: {
|
|
234
|
+
transition: '0.2s',
|
|
235
|
+
hoverScale: '1.05'
|
|
210
236
|
},
|
|
211
237
|
|
|
212
238
|
// ===== Internationalization (i18n) =====
|
|
213
239
|
lang: {
|
|
214
240
|
accessibilityMenu: 'Accessibility Menu',
|
|
241
|
+
closeAccessibilityMenu: 'Close Accessibility Menu',
|
|
215
242
|
accessibilityTools: 'Accessibility Tools',
|
|
216
243
|
resetAllSettings: 'Reset All Settings',
|
|
217
244
|
screenReader: 'Screen Reader',
|
|
@@ -226,21 +253,38 @@ window.ACCESSIBILITY_WIDGET_CONFIG = {
|
|
|
226
253
|
colorFilter: 'Color Filter',
|
|
227
254
|
textAlign: 'Text Align',
|
|
228
255
|
textSize: 'Text Size',
|
|
229
|
-
highContrast: 'High Contrast'
|
|
256
|
+
highContrast: 'High Contrast',
|
|
257
|
+
defaultFont: 'Default Font',
|
|
258
|
+
noFilter: 'No Filter',
|
|
259
|
+
default: 'Default',
|
|
260
|
+
screenReaderOn: 'Screen reader on',
|
|
261
|
+
screenReaderOff: 'Screen reader off',
|
|
262
|
+
voiceControlActivated: 'Voice control activated',
|
|
263
|
+
notSupportedBrowser: 'is not supported in this browser',
|
|
264
|
+
close: 'Close',
|
|
265
|
+
reset: 'Reset',
|
|
266
|
+
saturation: 'Saturation',
|
|
267
|
+
selectLanguage: 'Select Language'
|
|
230
268
|
},
|
|
231
269
|
|
|
232
|
-
// ===== Voice Commands =====
|
|
270
|
+
// ===== Voice Commands (Multi-language Support) =====
|
|
233
271
|
voiceCommands: {
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
272
|
+
en: {
|
|
273
|
+
showMenu: ['show menu', 'open menu', 'accessibility menu', 'access menu'],
|
|
274
|
+
highContrast: ['high contrast', 'contrast', 'dark mode', 'increase contrast'],
|
|
275
|
+
biggerText: ['bigger text', 'large text', 'text size', 'increase text', 'bigger', 'larger text', 'text bigger', 'make text bigger', 'enlarge text'],
|
|
276
|
+
textSpacing: ['text spacing', 'spacing', 'letter spacing', 'text space'],
|
|
277
|
+
pauseAnimations: ['pause animations', 'stop animations', 'disable animations', 'no animations'],
|
|
278
|
+
hideImages: ['hide images', 'remove images', 'no images'],
|
|
279
|
+
dyslexiaFont: ['dyslexia friendly', 'dyslexia font', 'readable font', 'easy font'],
|
|
280
|
+
biggerCursor: ['bigger cursor', 'large cursor', 'cursor size', 'big cursor'],
|
|
281
|
+
lineHeight: ['line height', 'line spacing', 'space between lines', 'line space'],
|
|
282
|
+
textAlign: ['align text', 'text align', 'center text', 'alignment'],
|
|
283
|
+
screenReader: ['screen reader', 'read aloud', 'voice reader'],
|
|
284
|
+
voiceControl: ['voice command', 'voice control', 'voice commands'],
|
|
285
|
+
resetAll: ['reset all', 'reset everything', 'clear all', 'reset settings', 'reset']
|
|
286
|
+
},
|
|
287
|
+
// Additional languages: de, es, it, fr, ru, tr, ar, hi, zh-cn, jp available in widget
|
|
244
288
|
}
|
|
245
289
|
};
|
|
246
290
|
```
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "accessibility-widgets",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.7",
|
|
4
4
|
"description": "A comprehensive, lightweight accessibility widget that enhances web accessibility for all users. Provides multiple accessibility features including screen reader support, voice control, high contrast mode, and more.",
|
|
5
5
|
"main": "widget.js",
|
|
6
6
|
"scripts": {
|
package/widget.js
CHANGED