-
Notifications
You must be signed in to change notification settings - Fork 1k
Update DataTables tutorial: migrate from gulp to heft commands #10608
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: main
Are you sure you want to change the base?
Update DataTables tutorial: migrate from gulp to heft commands #10608
Conversation
PoliCheck Scan ReportThe following report lists PoliCheck issues in PR files. Before you merge the PR, you must fix all severity-1 and severity-2 issues. The AI Review Details column lists suggestions for either removing or replacing the terms. If you find a false positive result, mention it in a PR comment and include this text: #policheck-false-positive. This feedback helps reduce false positives in future scans. ✅ No issues foundMore information about PoliCheckInformation: PoliCheck | Severity Guidance | Term |
|
Learn Build status updates of commit ed6130c: ✅ Validation status: passed
For more details, please refer to the build report. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@andrewconnell, I’ve kept the width the same as before. Please review and let me know if this aligns with the standards.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks for being aware of this, but let me use this op to explain this a bit more (something that's emphasized by MSDocs & MSLearn... I don't have the link to their guidelines as I'm waiting for my v- to get re-enabled, but it is in the MSLearn contrib docs).
The point of the size comment is to make sure the image focuses on WHAT the point of the image is. Also... so the reader sees the maximum amount of relevant information with their viewport (desktop browser maximized/windowed, on tablet, on mobile, etc). When there's unused negative space, it takes away from the usable viewport.
For example, look at the red boxes in this (taken from one of your images... I added the boxes):
A "better" version of this image would be to horizontally resize the image so that negative (ie: unused) space wasn't there). IOW, the effect would be:
- the blue box would move flush against the left
- the green boxes would move left in response to resizing the browser (ie: grab the RIGHT edge of the browser and resize to the left to shrink the width until the web part is flush against the left or at least as far to the left without focuring a mobile rendering to kick in)
The benefit/result: MSDOCS/MSLEARN will add the image to fill the viewport, making the content area bigger and more readable to the consumer of the page.
Does that make sense?
This rule should apply to all images in the docs. No, they all don't do that now because there's a LOT of legacy content, but trying to enforce this when we do edit/update docs.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@andrewconnell, thank you so much for the detailed explanation and guidance on image sizing standards for MS Docs/MS Learn. Your breakdown of the viewport optimization principles really helped clarify the requirements.
Could you please review the updated image when you have a moment? I want to make sure I've correctly implemented the horizontal resizing you described and that it now aligns with the MS Docs/MS Learn standards.
I really appreciate you taking the time to explain the rationale behind these guidelines - it helps me understand how to apply these principles consistently across all documentation images going forward.
PoliCheck Scan ReportThe following report lists PoliCheck issues in PR files. Before you merge the PR, you must fix all severity-1 and severity-2 issues. The AI Review Details column lists suggestions for either removing or replacing the terms. If you find a false positive result, mention it in a PR comment and include this text: #policheck-false-positive. This feedback helps reduce false positives in future scans. ✅ No issues foundMore information about PoliCheckInformation: PoliCheck | Severity Guidance | Term |
|
Learn Build status updates of commit d826f71:
|
| File | Status | Preview URL | Details |
|---|---|---|---|
| docs/spfx/web-parts/guidance/migrate-jquery-datatables-script-to-spfx.md | View | Details | |
| docs/images/datatables-spfx-list-configured.png | ✅Succeeded | View | |
| docs/images/datatables-spfx.png | ✅Succeeded | n/a (file deleted or renamed) |
docs/spfx/web-parts/guidance/migrate-jquery-datatables-script-to-spfx.md
- Line 381, Column 1: [Warning: file-not-found - See documentation]
Invalid file link: '../../../images/datatables-spfx.png'.
For more details, please refer to the build report.
Note: Your PR may contain errors or warnings or suggestions unrelated to the files you changed. This happens when external dependencies like GitHub alias, Microsoft alias, cross repo links are updated. Please use these instructions to resolve them.
PoliCheck Scan ReportThe following report lists PoliCheck issues in PR files. Before you merge the PR, you must fix all severity-1 and severity-2 issues. The AI Review Details column lists suggestions for either removing or replacing the terms. If you find a false positive result, mention it in a PR comment and include this text: #policheck-false-positive. This feedback helps reduce false positives in future scans. ✅ No issues foundMore information about PoliCheckInformation: PoliCheck | Severity Guidance | Term |
|
Learn Build status updates of commit f495bcb: ✅ Validation status: passed
For more details, please refer to the build report. |
PoliCheck Scan ReportThe following report lists PoliCheck issues in PR files. Before you merge the PR, you must fix all severity-1 and severity-2 issues. The AI Review Details column lists suggestions for either removing or replacing the terms. If you find a false positive result, mention it in a PR comment and include this text: #policheck-false-positive. This feedback helps reduce false positives in future scans. ✅ No issues foundMore information about PoliCheckInformation: PoliCheck | Severity Guidance | Term |
|
Learn Build status updates of commit bc45004: ✅ Validation status: passed
For more details, please refer to the build report. |
PoliCheck Scan ReportThe following report lists PoliCheck issues in PR files. Before you merge the PR, you must fix all severity-1 and severity-2 issues. The AI Review Details column lists suggestions for either removing or replacing the terms. If you find a false positive result, mention it in a PR comment and include this text: #policheck-false-positive. This feedback helps reduce false positives in future scans. ✅ No issues foundMore information about PoliCheckInformation: PoliCheck | Severity Guidance | Term |
|
Learn Build status updates of commit 629614a: ✅ Validation status: passed
For more details, please refer to the build report. |
Category
Related issues
What's in this Pull Request?
This PR updates the jQuery and DataTables migration tutorial to align with modern SharePoint Framework practices and improves overall documentation quality.
Changes Made:
Gulp to Heft Migration: