Skip to content

Commit 5322784

Browse files
nextlevelshitnextlevelshit
committed
style: remove emojis and make titles professional
1 parent 2fc6f28 commit 5322784

File tree

3 files changed

+41
-41
lines changed

3 files changed

+41
-41
lines changed

‎.parcel-cache/data.mdb‎

48 KB
Binary file not shown.

‎.parcel-cache/lock.mdb‎

0 Bytes
Binary file not shown.

‎.pugrc‎

Lines changed: 41 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -6,18 +6,18 @@
66
"description": "Master native HTML capabilities and progressive enhancement patterns. This guide demonstrates how leveraging built-in browser features reduces complexity, improves performance, and creates more maintainable codebases."
77
},
88
"hero": {
9-
"title": "🚀 HTML Fundamentals",
10-
"subtitle": "Master native HTML capabilities and progressive enhancement patterns. This guide demonstrates how leveraging built-in browser features reduces complexity, improves performance, and creates more maintainable codebases."
9+
"title": "HTML Over JavaScript",
10+
"subtitle": "Native HTML elements solve 90% of common UI problems. This guide demonstrates how leveraging built-in browser features reduces complexity, improves performance, and creates more maintainable codebases."
1111
},
1212
"sections": {
1313
"disclosure": {
14-
"title": "🎯 Details/Summary Patterns",
14+
"title": "Details/Summary Patterns",
1515
"js_title": "JavaScript-Dependent Implementation",
1616
"js_badge": "COMPLEX",
1717
"js_warning": "Implementation Overhead: Manual ARIA state management, keyboard event handling, focus management, and screen reader compatibility.",
1818
"js_content1": "Custom collapsible implementations require comprehensive event handling, state synchronization across components, and careful attention to accessibility requirements including proper ARIA attributes and keyboard navigation patterns.",
1919
"js_content2": "Managing state across multiple collapsible sections introduces complexity in event coordination, memory management, and performance optimization, particularly when dealing with dynamic content loading.",
20-
"js_cons_title": "❌ Architecture Complexity:",
20+
"js_cons_title": "Issues: Architecture Complexity:",
2121
"js_cons": [
2222
"Event delegation and memory leak prevention",
2323
"ARIA state synchronization and keyboard trap management",
@@ -32,15 +32,15 @@
3232
"native_enhancement_content": "Starting with functional HTML ensures graceful degradation across all environments. CSS and JavaScript become enhancement layers rather than functional requirements, improving reliability and reducing technical debt.",
3333
"native_performance_title": "Performance Characteristics",
3434
"native_performance_content": "Native elements eliminate bundle size overhead, reduce runtime memory consumption, and leverage browser optimizations unavailable to custom implementations. Hardware acceleration and efficient event handling come built-in.",
35-
"native_pros_title": "✅ Platform Advantages:",
35+
"native_pros_title": "Benefits: Platform Advantages:",
3636
"native_pros": [
3737
"Zero JavaScript footprint with full accessibility compliance",
3838
"Browser-native performance optimizations and hardware acceleration",
3939
"Consistent cross-platform behavior with no maintenance overhead"
4040
]
4141
},
4242
"modals": {
43-
"title": "🪟 Modal Dialog Patterns",
43+
"title": "Modal Dialog Patterns",
4444
"js_title": "Custom Modal Implementation",
4545
"js_badge": "BRITTLE",
4646
"js_warning": "Critical Requirements: Focus trapping, inert background content, ESC key handling, backdrop click management, and ARIA modal semantics.",
@@ -49,7 +49,7 @@
4949
"js_modal_content": "This approach requires managing the modal stack, preventing background interaction, coordinating focus management, and ensuring proper cleanup to avoid memory leaks and accessibility violations.",
5050
"js_modal_issue": "Critical Issue: Background content remains accessible to screen readers and keyboard navigation without explicit inert management.",
5151
"js_modal_close": "Close Modal",
52-
"js_cons_title": "❌ Implementation Challenges:",
52+
"js_cons_title": "Issues: Implementation Challenges:",
5353
"js_cons": [
5454
"Focus trap implementation and restoration complexity",
5555
"Modal stack management and z-index coordination",
@@ -63,15 +63,15 @@
6363
"native_dialog_content": "The HTML5 dialog element provides robust modal functionality with automatic focus management, backdrop interaction handling, and proper accessibility semantics built into the browser engine.",
6464
"native_dialog_advantage": "Key Advantage: Background content becomes automatically inert, preventing interaction and screen reader access without additional implementation.",
6565
"native_dialog_close": "Close Dialog",
66-
"native_pros_title": "✅ Engine-Level Features:",
66+
"native_pros_title": "Benefits: Engine-Level Features:",
6767
"native_pros": [
6868
"Automatic focus trapping with proper restoration",
6969
"Built-in ESC key handling and backdrop click support",
7070
"Modal semantics and inert background management"
7171
]
7272
},
7373
"validation": {
74-
"title": "📝 Constraint Validation Patterns",
74+
"title": "Constraint Validation Patterns",
7575
"js_title": "Custom Validation Logic",
7676
"js_badge": "FRAGILE",
7777
"js_warning": "Validation Complexity: Custom error messaging, timing coordination, accessibility announcements, and server-client synchronization.",
@@ -80,7 +80,7 @@
8080
"js_regex_label": "Pattern Matching (UUID)",
8181
"js_regex_error": "UUID format required: 8-4-4-4-12 hex digits",
8282
"js_submit": "Validate Form",
83-
"js_cons_title": "❌ Validation Brittleness:",
83+
"js_cons_title": "Issues: Validation Brittleness:",
8484
"js_cons": [
8585
"Regex patterns miss edge cases and internationalization",
8686
"Error timing and accessibility announcement coordination",
@@ -97,21 +97,21 @@
9797
"native_api_label": "API Endpoint URL",
9898
"native_api_placeholder": "https://api.example.org/v1",
9999
"native_submit": "Submit Form",
100-
"native_pros_title": "✅ Specification Compliance:",
100+
"native_pros_title": "Benefits: Specification Compliance:",
101101
"native_pros": [
102102
"RFC-compliant validation patterns with internationalization",
103103
"Automatic error messaging in user's preferred language",
104104
"CSS pseudo-classes (:valid, :invalid) for styling integration"
105105
]
106106
},
107107
"progress": {
108-
"title": "📊 Progress Indication Patterns",
108+
"title": "Progress Indication Patterns",
109109
"js_title": "Custom Progress Implementation",
110110
"js_badge": "SEMANTIC-VOID",
111111
"js_warning": "Accessibility Gap: No semantic meaning without explicit ARIA implementation and screen reader progress announcements.",
112112
"js_text": "Build Progress:",
113113
"js_button": "Start Build Process",
114-
"js_cons_title": "❌ Semantic Limitations:",
114+
"js_cons_title": "Issues: Semantic Limitations:",
115115
"js_cons": [
116116
"No inherent semantic meaning for assistive technologies",
117117
"Manual ARIA live region management for progress updates",
@@ -126,22 +126,22 @@
126126
"native_indeterminate_text": "Processing dependencies...",
127127
"native_dynamic": "Dynamic Progress:",
128128
"native_button": "Start Process",
129-
"native_pros_title": "✅ Semantic Advantages:",
129+
"native_pros_title": "Benefits: Semantic Advantages:",
130130
"native_pros": [
131131
"Built-in progress role with automatic value announcements",
132132
"Indeterminate state support for unknown duration operations",
133133
"Platform-optimized rendering and animation performance"
134134
]
135135
},
136136
"temporal": {
137-
"title": "📅 Temporal Input Patterns",
137+
"title": "Temporal Input Patterns",
138138
"js_title": "Custom Date Picker",
139139
"js_badge": "HEAVYWEIGHT",
140140
"js_warning": "Implementation Scope: Calendar widget architecture, keyboard navigation, internationalization, timezone handling, and mobile touch optimization.",
141141
"js_label": "Deployment Date (Custom)",
142142
"js_placeholder": "YYYY-MM-DD",
143143
"js_picker_content": "[Calendar widget implementation]\nRequires: Date manipulation library, internationalization,\nkeyboard navigation, mobile gesture handling,\ntimezone calculations, accessibility compliance.",
144-
"js_cons_title": "❌ Implementation Overhead:",
144+
"js_cons_title": "Issues: Implementation Overhead:",
145145
"js_cons": [
146146
"Large JavaScript libraries and complex calendar logic",
147147
"Mobile UX inconsistency with platform date pickers",
@@ -153,19 +153,19 @@
153153
"native_release_label": "Release Date",
154154
"native_timestamp_label": "Build Timestamp",
155155
"native_window_label": "Deployment Window",
156-
"native_pros_title": "✅ Platform Integration:",
156+
"native_pros_title": "Benefits: Platform Integration:",
157157
"native_pros": [
158158
"Zero-bundle impact with native OS picker integration",
159159
"Automatic validation and internationalization support",
160160
"Consistent UX aligned with platform conventions"
161161
]
162162
},
163163
"fieldset": {
164-
"title": "📋 Form Grouping Patterns",
164+
"title": "Form Grouping Patterns",
165165
"js_title": "Custom Form Section",
166166
"js_badge": "SEMANTIC-VOID",
167167
"js_warning": "Accessibility Gap: No semantic grouping of related form controls without explicit ARIA group roles.",
168-
"js_cons_title": "❌ Implementation Overhead:",
168+
"js_cons_title": "Issues: Implementation Overhead:",
169169
"js_cons": [
170170
"No inherent semantic grouping of form controls",
171171
"Manual ARIA group role and labeling required",
@@ -174,19 +174,19 @@
174174
"native_title": "Native Fieldset Element",
175175
"native_badge": "SEMANTIC",
176176
"native_note": "Form Semantics: Built-in grouping with legend, automatic disabled state propagation, and screen reader support.",
177-
"native_pros_title": "✅ Semantic Advantages:",
177+
"native_pros_title": "Benefits: Semantic Advantages:",
178178
"native_pros": [
179179
"Semantic grouping with legend as accessible name",
180180
"Disabled attribute propagates to all child controls",
181181
"Screen readers announce group and legend relationship"
182182
]
183183
},
184184
"output": {
185-
"title": "🔢 Output & Calculation Patterns",
185+
"title": "Output & Calculation Patterns",
186186
"js_title": "Custom Calculation Display",
187187
"js_badge": "SEMANTIC-VOID",
188188
"js_warning": "Accessibility Gap: No semantic indication that content is a calculated result without explicit ARIA live regions.",
189-
"js_cons_title": "❌ Implementation Overhead:",
189+
"js_cons_title": "Issues: Implementation Overhead:",
190190
"js_cons": [
191191
"No semantic indication of calculated result",
192192
"Manual ARIA live region setup for updates",
@@ -196,19 +196,19 @@
196196
"native_badge": "SEMANTIC",
197197
"native_note": "Form Integration: Built-in calculation result semantics, automatic form association, and screen reader announcement.",
198198
"native_calc_label": "Price Calculator",
199-
"native_pros_title": "✅ Semantic Advantages:",
199+
"native_pros_title": "Benefits: Semantic Advantages:",
200200
"native_pros": [
201201
"Semantic indication of calculated/computed result",
202202
"Automatic form association via 'for' attribute",
203203
"Screen readers announce as calculation output"
204204
]
205205
},
206206
"meter": {
207-
"title": "📏 Meter & Gauge Patterns",
207+
"title": "Meter & Gauge Patterns",
208208
"js_title": "Custom Gauge Implementation",
209209
"js_badge": "SEMANTIC-VOID",
210210
"js_warning": "Accessibility Gap: No semantic distinction between progress and measurement without explicit ARIA roles.",
211-
"js_cons_title": "❌ Implementation Overhead:",
211+
"js_cons_title": "Issues: Implementation Overhead:",
212212
"js_cons": [
213213
"No semantic distinction from progress bars",
214214
"Manual color coding for low/high/optimum ranges",
@@ -220,19 +220,19 @@
220220
"native_disk_label": "Disk Usage (70%)",
221221
"native_battery_label": "Battery Level (25% - Low)",
222222
"native_score_label": "Performance Score (92% - Optimal)",
223-
"native_pros_title": "✅ Semantic Advantages:",
223+
"native_pros_title": "Benefits: Semantic Advantages:",
224224
"native_pros": [
225225
"Semantic distinction from progress (measurement vs task)",
226226
"Automatic color changes for low/high/optimum ranges",
227227
"Screen readers announce value context appropriately"
228228
]
229229
},
230230
"figure": {
231-
"title": "🖼️ Figure & Caption Patterns",
231+
"title": "Figure & Caption Patterns",
232232
"js_title": "Custom Image Caption",
233233
"js_badge": "SEMANTIC-VOID",
234234
"js_warning": "Accessibility Gap: No semantic association between image and caption without explicit ARIA attributes.",
235-
"js_cons_title": "❌ Semantic Limitations:",
235+
"js_cons_title": "Issues: Semantic Limitations:",
236236
"js_cons": [
237237
"No inherent association between content and caption",
238238
"Manual ARIA labeling required for accessibility",
@@ -241,20 +241,20 @@
241241
"native_title": "Native Figure Element",
242242
"native_badge": "SEMANTIC",
243243
"native_note": "Semantic Association: Built-in content-caption relationship, proper accessibility, works for images, code, quotes, and more.",
244-
"native_pros_title": "✅ Semantic Advantages:",
244+
"native_pros_title": "Benefits: Semantic Advantages:",
245245
"native_pros": [
246246
"Automatic content-caption semantic association",
247247
"Works for images, code blocks, diagrams, quotes",
248248
"Screen readers announce figure and caption relationship"
249249
]
250250
},
251251
"popover": {
252-
"title": "💬 Popover & Tooltip Patterns",
252+
"title": "Popover & Tooltip Patterns",
253253
"js_title": "Custom Popover Implementation",
254254
"js_badge": "COMPLEX",
255255
"js_warning": "Implementation Scope: Positioning logic, viewport collision, z-index management, click-outside detection, and focus management.",
256256
"js_button": "Show Custom Tooltip",
257-
"js_cons_title": "❌ Implementation Overhead:",
257+
"js_cons_title": "Issues: Implementation Overhead:",
258258
"js_cons": [
259259
"Complex positioning algorithms for viewport collision",
260260
"Manual click-outside and ESC key dismissal logic",
@@ -266,20 +266,20 @@
266266
"native_button": "Show Native Popover",
267267
"native_popover_title": "Native Popover",
268268
"native_popover_content": "This popover uses the native popover API. Click outside or press ESC to dismiss.",
269-
"native_pros_title": "✅ Native Advantages:",
269+
"native_pros_title": "Benefits: Native Advantages:",
270270
"native_pros": [
271271
"Zero JavaScript with automatic light dismiss behavior",
272272
"Built-in top-layer positioning (no z-index issues)",
273273
"Keyboard accessible with ESC to close"
274274
]
275275
},
276276
"color": {
277-
"title": "🎨 Color Picker Patterns",
277+
"title": "Color Picker Patterns",
278278
"js_title": "Custom Color Picker",
279279
"js_badge": "HEAVYWEIGHT",
280280
"js_warning": "Implementation Scope: Color space math, gradient rendering, hue/saturation controls, alpha channel, and format conversion (hex, rgb, hsl).",
281281
"js_label": "Theme Color (Custom)",
282-
"js_cons_title": "❌ Implementation Overhead:",
282+
"js_cons_title": "Issues: Implementation Overhead:",
283283
"js_cons": [
284284
"Complex color space mathematics and conversions",
285285
"Custom UI for hue wheels, gradients, and alpha sliders",
@@ -291,20 +291,20 @@
291291
"native_primary_label": "Primary Color",
292292
"native_accent_label": "Accent Color",
293293
"native_bg_label": "Background Color",
294-
"native_pros_title": "✅ Native Advantages:",
294+
"native_pros_title": "Benefits: Native Advantages:",
295295
"native_pros": [
296296
"Zero JavaScript with full OS color picker integration",
297297
"Eyedropper tool on supported browsers (Chrome, Edge)",
298298
"Automatic hex value handling with form integration"
299299
]
300300
},
301301
"range": {
302-
"title": "🎚️ Range Slider Patterns",
302+
"title": "Range Slider Patterns",
303303
"js_title": "Custom Slider Implementation",
304304
"js_badge": "COMPLEX",
305305
"js_warning": "Implementation Scope: Drag handling, touch events, value interpolation, track/thumb styling, and ARIA slider semantics.",
306306
"js_label": "Volume Control (Custom)",
307-
"js_cons_title": "❌ Implementation Overhead:",
307+
"js_cons_title": "Issues: Implementation Overhead:",
308308
"js_cons": [
309309
"Complex mouse/touch event coordination and drag handling",
310310
"Manual ARIA slider implementation with value announcements",
@@ -316,21 +316,21 @@
316316
"native_volume_label": "Volume Level",
317317
"native_brightness_label": "Brightness",
318318
"native_quality_label": "Quality (with ticks)",
319-
"native_pros_title": "✅ Native Advantages:",
319+
"native_pros_title": "Benefits: Native Advantages:",
320320
"native_pros": [
321321
"Zero JavaScript with full keyboard and touch support",
322322
"Built-in ARIA slider role with automatic announcements",
323323
"Datalist integration for tick marks and snap points"
324324
]
325325
},
326326
"autocomplete": {
327-
"title": "🔍 Autocomplete Patterns",
327+
"title": "Autocomplete Patterns",
328328
"js_title": "Custom Autocomplete",
329329
"js_badge": "INTERACTION-HEAVY",
330330
"js_warning": "Interaction Complexity: Dropdown positioning, keyboard navigation, ARIA combobox implementation, and mobile touch handling.",
331331
"js_label": "Framework Search (Custom)",
332332
"js_placeholder": "Type framework name...",
333-
"js_cons_title": "❌ Interaction Management:",
333+
"js_cons_title": "Issues: Interaction Management:",
334334
"js_cons": [
335335
"Complex ARIA combobox implementation and state management",
336336
"Dropdown positioning and viewport collision detection",
@@ -343,7 +343,7 @@
343343
"native_framework_placeholder": "Select or type framework...",
344344
"native_language_label": "Programming Language",
345345
"native_language_placeholder": "Choose language...",
346-
"native_pros_title": "✅ Zero-Configuration Benefits:",
346+
"native_pros_title": "Benefits: Zero-Configuration Benefits:",
347347
"native_pros": [
348348
"Native combobox semantics with automatic ARIA support",
349349
"Platform-consistent keyboard and interaction patterns",

0 commit comments

Comments
 (0)