fix(website): correct docs edit links, API source links, and UI polish#82
Conversation
|
Claude finished @PrzemyslawKlys's task —— View job Code Review Complete ✅Todo List:
Review FindingsThis PR makes several focused improvements to the website documentation and API integration. Overall, the changes are well-implemented and align with the stated objectives. Here's my detailed analysis: ✅ Positive Aspects1. Documentation Link Fixes (Website/site.json:50-51) "Template": "https://github.com/EvotecIT/CodeGlyphX/edit/master/{path}",
"PathBase": "Website"
2. API Source Mapping (Website/pipeline.json:73-74) "sourceRoot": "../CodeGlyphX",
"sourceUrl": "https://github.com/EvotecIT/CodeGlyphX/blob/master/{path}#L{line}",
3. Enhanced Image Loading (Website/content/pages/index.scripts.html:210-218) img.decoding = 'async';
if (item.width && item.height) {
img.width = item.width;
img.height = item.height;
} else {
img.width = 400;
img.height = 400;
}
4. Comprehensive Style Board Metadata
🎨 CSS Improvements (Website/static/css/api.css)Enhanced UX Elements:
Responsive Design:
🔍 Potential Areas for Improvement1. Minor Performance Consideration
2. Error Handling Enhancement // Current fallback in lines 216-218 could be more robust
} else {
img.width = 400;
img.height = 400;
}
3. Code Style
🛡️ Security Assessment
🚀 Performance Considerations
🧪 Test Coverage
SummaryThis is a high-quality PR that makes targeted improvements to documentation UX and API integration. The implementation follows best practices, maintains consistency with the existing codebase, and delivers tangible user experience improvements. Recommendation: ✅ Approve The changes are focused, well-implemented, and provide clear value to users navigating the documentation and API reference. |
|
There was a problem hiding this comment.
Pull request overview
This pull request fixes several website configuration and UI polish issues. It corrects the "Edit on GitHub" links to point to the correct CodeGlyphX repository instead of the PSPublishModule samples, enables API source mapping so API documentation pages can link to exact source code lines, improves the visual styling of API type pages with a new source action button and custom checkbox styling, and enhances the style-board image rendering by adding explicit width/height metadata and the decoding="async" attribute for better performance.
Changes:
- Fixed Edit on GitHub links to use
EvotecIT/CodeGlyphXrepository withWebsitepath base - Added API source mapping configuration (
sourceRootandsourceUrl) to enable links to source code - Added CSS styling for new API type page elements (source action button, custom checkbox styling)
- Added explicit width/height dimensions to all 42 style-board JSON entries
- Enhanced style-board image rendering with
decoding="async"and dimension attributes
Reviewed changes
Copilot reviewed 5 out of 5 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
| Website/site.json | Updated EditLinks configuration to point to correct repository (EvotecIT/CodeGlyphX) and path base (Website) |
| Website/pipeline.json | Added sourceRoot and sourceUrl for API documentation source mapping to GitHub |
| Website/static/data/style-board.json | Added width and height metadata to all 42 style entries for better image rendering |
| Website/content/pages/index.scripts.html | Added decoding="async" attribute and applied width/height dimensions to dynamically created images |
| Website/static/css/api.css | Added styling for type-source-action button and custom checkbox styling for member-toggle, including light theme overrides |
| border-color: color-mix(in srgb, var(--border) 80%, #fff); | ||
| background: #fff; | ||
| } | ||
|
|
There was a problem hiding this comment.
The custom checkbox styling for .member-toggle input includes styles for the default theme and [data-theme="light"], but is missing corresponding styles for [data-theme="auto"] when prefers-color-scheme: light. This creates an inconsistency where the checkbox will not have the correct light theme styling when users have their theme set to "auto" and their system preference is light mode. You should add a matching rule within the @media (prefers-color-scheme: light) block similar to the [data-theme="light"] rule on line 1260-1262.
| [data-theme="auto"] .member-toggle input { | |
| border-color: color-mix(in srgb, var(--border) 80%, #fff); | |
| background: #fff; | |
| } |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: f757307701
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| .member-toggle input { | ||
| accent-color: var(--primary); | ||
| -webkit-appearance: none; | ||
| appearance: none; |
There was a problem hiding this comment.
Add visible focus state for custom member toggle
Replacing the native checkbox with appearance: none removes the browser’s default keyboard focus ring, but the new styles only define :hover and :checked states. On API type pages, keyboard users can tab to the inherited-members toggle without any visible focus indicator, which is an accessibility regression introduced by this change.
Useful? React with 👍 / 👎.
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## master #82 +/- ##
==========================================
- Coverage 59.75% 59.74% -0.01%
==========================================
Files 448 448
Lines 57814 57814
Branches 16563 16563
==========================================
- Hits 34544 34543 -1
Misses 17565 17565
- Partials 5705 5706 +1 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|



Summary
Edit on GitHubto point toEvotecIT/CodeGlyphX(Website/...) instead ofPSPublishModule/Samples/...sourceRoot+sourceUrl) so API pages link to exact.cslinesdecoding="async"for style-board runtime imagesValidation
./build.ps1(Website)