8ee6f3dd0a
fix: resolve initialization bugs breaking level indicator and expected preview
...
- Fix renderLesson to handle null inputEl (CodeMirror replaces textarea)
- Fix renderExpectedPreview to use 'solution' property instead of 'solutionCode'
- These fixes restore level indicator, expected preview, and auto-run functionality
2025-12-22 10:04:41 +01:00
0169c8c9a9
fix: use One Dark theme for CodeMirror syntax highlighting
...
- Replace custom highlight styles with @codemirror/theme-one-dark
- Cleaner implementation with official CodeMirror theme
- Keep custom font and padding overrides
2025-12-22 01:17:10 +01:00
238853d2e1
feat: add CodeMirror 6 editor with Emmet support
...
- Replace textarea with CodeMirror 6 for syntax highlighting
- Add Emmet abbreviation expansion (Tab to expand)
- Support HTML and CSS language modes with autocomplete
- Add dark theme matching app design
- Tab indentation with Shift-Tab for outdent
- Update help modal with Emmet shortcuts
2025-12-21 23:37:14 +01:00
60017aa1ba
refactor: redesign layout to Flexbox Froggy style with slide-out sidebar
...
- Implement 50/50 split layout (left: instructions + editor, right: preview)
- Replace always-visible sidebar with slide-out drawer menu
- Move footer, progress, and settings into sidebar
- Add toggleable expected result overlay (hidden by default)
- Create new hint system with step progress indicators
- Add ghost button styles for modal and text button for sidebar reset
- Fix HTML lesson task instruction and typo ("important" not "importing")
- Add padding to preview frames to prevent corner clipping
- Optimize layout for iPadOS and tablet devices
2025-12-21 23:20:07 +01:00
50c4d51523
feat: add HTML lessons mode and side-by-side comparison UI
...
- Add HTML mode support with new validation types (element_exists,
element_count, attribute_value, element_text, parent_child, sibling)
- Create 3 HTML lesson modules: Elements, Forms Basic, Forms Validation
- Implement side-by-side preview comparison (Your Output vs Expected)
- Add merge animation with "Perfect Match!" overlay on validation success
- Render expected output from solutionCode field in lesson JSON
- Update schema to support HTML mode and solutionCode
- Reorder modules: HTML first, then CSS, then Tailwind
- Update tests for new functionality
2025-12-21 22:12:00 +01:00
Michael Czechowski
671b6cc813
refactor: clean up unused lesson imports and improve code consistency
2025-06-10 23:45:46 +02:00
Michael Czechowski
0f55403b86
fix: update validation message for clarity and consistency
2025-06-05 23:38:00 +02:00
Michael Czechowski
0ff032439f
fix: update success background color for improved visibility and remove unused color variables
2025-06-05 23:37:25 +02:00
Michael Czechowski
72ad162a73
feat: update instruction styles with new colors and enhanced readability
2025-06-05 23:31:19 +02:00
Michael Czechowski
7c9daa413c
feat: enhance LessonEngine to manage user progress and code storage
2025-06-05 23:31:13 +02:00
Michael Czechowski
e30bb40b1a
feat: enhance lesson functionality with user code storage and progress tracking
2025-06-05 14:05:35 +02:00
10fce10033
feat: implement tailwind validations and basic example
2025-06-01 22:34:55 +02:00
Michael Czechowski
6e4b3a141c
wip
2025-05-23 14:35:05 +02:00
Michael Czechowski
17da3eb647
feat: add CSS carousels module and update lesson imports
2025-05-23 08:12:23 +02:00
Michael Czechowski
5b3068898d
feat: add advanced selectors module and update lesson imports accordingly and release
2025-05-23 08:05:00 +02:00
Michael Czechowski
6995ab94e4
feat: add extended CSS examples and update lesson imports
2025-05-23 07:47:48 +02:00
Michael Czechowski
5a8df62c2c
feat: add footer with links to project repository and author website
2025-05-20 19:42:17 +02:00
Michael Czechowski
9a562c46fd
feat: make sure to scroll to the top when navigating to lesson
2025-05-20 18:49:39 +02:00
Michael Czechowski
868015f344
fix: update scroll behavior for lesson navigation and adjust lesson description width for better scrolling
2025-05-20 18:29:40 +02:00
Michael Czechowski
3cb2b9c412
fix: correct casing in validation message for consistency
2025-05-20 02:18:10 +02:00
Michael Czechowski
dcb4f77c09
style: organize CSS with section headers and sort rules
2025-05-20 01:51:50 +02:00
Michael Czechowski
0065cf497e
feat: enhance module list rendering with expandable lessons and active lesson tracking
2025-05-20 01:43:57 +02:00
Michael Czechowski
7ffd6f92a0
fix: adjust hamburger menu animation for improved visual effect
2025-05-20 00:54:34 +02:00
Michael Czechowski
edf737092a
feat: implement responsive hamburger menu and enhance header layout
2025-05-20 00:52:23 +02:00
Michael Czechowski
c00cac389c
feat: update progress bar styling to increase height and change background color
2025-05-20 00:39:54 +02:00
Michael Czechowski
0f368b7373
feat: add toggle switch for disabling error feedback and persist user settings
2025-05-20 00:37:36 +02:00
Michael Czechowski
7cdbf0807f
feat: update validation message to enhance user feedback
2025-05-20 00:26:47 +02:00
Michael Czechowski
d05a70fb08
feat: enhance styling for lesson components and improve kbd element appearance
2025-05-20 00:17:55 +02:00
Michael Czechowski
1f50963028
feat: enhance lesson preview functionality and improve run button interaction; change lesson indicator to percentage; split preview css for better isolation
2025-05-19 23:30:22 +02:00
Michael Czechowski
1e81d0e66b
feat: add kbd css styles and make sidebar transparent for better focus on lessons
2025-05-19 22:14:18 +02:00
Michael Czechowski
49e5d2d458
fix: race condition closing error feedback to early when next should appear
2025-05-19 22:13:42 +02:00
Michael Czechowski
e644ee2c6a
feat: increase logo size for better visibility and add shadow to logo
2025-05-19 20:27:17 +02:00
Michael Czechowski
2c8174d1a0
feat: implement better progress tracking and user feedback, run code after some idle time
2025-05-19 20:21:53 +02:00
Michael Czechowski
dc1da0ffd6
feat: refine lessons
2025-05-19 20:20:49 +02:00
Michael Czechowski
bd695c973f
feat: add new logos and color schema
2025-05-19 20:20:23 +02:00
Michael Czechowski
ee8a8d6649
feat: enhance validation feedback in code editor, improve layout and reset functionality
2025-05-19 13:20:40 +02:00
Michael Czechowski
f8172644dc
WIP: enhance validation feedback in code editor, add support for multiple validation indicators and new validation types
2025-05-19 12:55:43 +02:00
Michael Czechowski
1ce1f6cd2f
feat: update localStorage keys for user progress and last module ID, enhance editor layout with validation indicator
2025-05-18 23:22:17 +02:00
Michael Czechowski
10094e36dc
WIP: enhance code editor layout and implement live preview functionality
2025-05-18 21:55:49 +02:00
Michael Czechowski
d2be51ac49
feat: add basic selectors module and update layout styles
2025-05-14 12:07:34 +02:00
Michael Czechowski
b742d90e93
feat: enhance CSS variables and styles for improved layout and theming
2025-05-14 11:28:51 +02:00
Michael Czechowski
b7ed260867
feat: update module titles and enhance button styles
2025-05-14 03:40:15 +02:00
Michael Czechowski
ea0edbc7ef
style: adjust spacing and font size in main.css for improved layout
2025-05-14 02:52:52 +02:00
Michael Czechowski
c391f6a96b
feat: restructure lesson files and update success indicators
2025-05-14 00:51:10 +02:00
Michael Czechowski
7817528f4f
feat: enhance success indicators and update favicon path
2025-05-13 21:35:16 +02:00
Michael Czechowski
19188f1415
style: run format first time
2025-05-13 21:08:18 +02:00
Michael Czechowski
94bd7ba0cb
refactor: reorganize project structure and update import paths
2025-05-13 20:29:59 +02:00
Michael Czechowski
26ac9c57f2
refactor: reorganize project structure and update import paths
2025-05-13 20:29:52 +02:00
Michael Czechowski
d8e55b23ac
feat: add Tailwind CSS lessons and refactor lesson configuration
2025-05-13 20:02:57 +02:00
Michael Czechowski
f49541d610
feat: enhance lesson progress tracking and UI feedback
2025-05-13 19:57:27 +02:00
