Stylelint polaris rule docs #7878
Closed
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
chloerice
force-pushed
the
stylelint-polaris-rule-docs
branch
from
f4cb391
to
daa461e
Compare
9 tasks
sam-b-rose
added
the
stylelint-polaris
chloerice
force-pushed
the
stylelint-polaris-rule-docs
branch
from
8ee6480
to
01c70fd
Compare
size-limit report 📦
|
chloerice
force-pushed
the
stylelint-polaris-rule-docs
branch
from
982e46c
to
80e4aa9
Compare
chloerice
added a commit
that referenced
this pull request
Dec 13, 2022
### WHY are these changes introduced? Closes #7506 #### To do - [x] Bring in changes from https://github.com/Shopify/polaris/pull/7814/files - [ ] ~Finish adding examples to coverage/README.md~ (handling in separate [PR](#7878)) - [x] Update screenshots to reflect current approach - [x] Update/add comments to notable changes/fixes/open questions ### WHAT is this pull request doing? This pull request adds support for configuring `stylelint-polaris/coverage` rules with custom messages and metadata, so that error and warning messages tell admin builders how to resolve the problem and VS Code diagnostics link to the `@shopify/stylelint-polaris` documentation. For example: <img width="610" alt="Screenshot 2022-12-09 at 1 41 40 PM" src="https://user-images.githubusercontent.com/18447883/206791342-cc12ccab-9d36-44db-a619-d7c59dd2b265.png"> This PR also includes a bit of polish: - Added typing and descriptions to `polaris/coverage` plugin so that primary options are clear in the config and in the plugin's code - Updated plugin names to be singular instead of plural ```diff - custom-properties-allowed-list + custom-property-allowed-list - media-queries-allowed-list + media-query-allowed-list ``` <!-- Summary of the changes committed. Before / after screenshots are appreciated for UI changes. Make sure to include alt text that describes the screenshot. If you include an animated gif showing your change, wrapping it in a details tag is recommended. Gifs usually autoplay, which can cause accessibility issues for people reviewing your PR: <details> <summary>Summary of your gif(s)</summary> <img src="..." alt="Description of what the gif shows"> </details> --> <!-- ℹ️ Delete the following for small / trivial changes --> ### How to 🎩 🖥 [Local development instructions](https://github.com/Shopify/polaris/blob/main/README.md#local-development) 🗒 [General tophatting guidelines](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting.md) 📄 [Changelog guidelines](https://github.com/Shopify/polaris/blob/main/.github/CONTRIBUTING.md#changelog) <!-- Give as much information as needed to experiment with the component in the playground. --> <details> <summary>Copy-paste this code in <code>playground/Playground.tsx</code>:</summary> ```jsx import React from 'react'; import {Page} from '../src'; export function Playground() { return ( <Page title="Playground"> {/* Add the code you want to test in here */} </Page> ); } ``` </details> ### 🎩 checklist - [ ] Tested on [mobile](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting.md#cross-browser-testing) - [ ] Tested on [multiple browsers](https://help.shopify.com/en/manual/shopify-admin/supported-browsers) - [ ] Tested for [accessibility](https://github.com/Shopify/polaris/blob/main/documentation/Accessibility%20testing.md) - [ ] Updated the component's `README.md` with documentation changes - [ ] [Tophatted documentation](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting%20documentation.md) changes in the style guide
chloerice
force-pushed
the
stylelint-polaris-rule-docs
branch
from
a20f5f9
to
fc06ab5
Compare
…eries, z-index, layout, and legacy (#7917) ### WHY are these changes introduced? Part of #7878 Adds Polaris-specific documentation for each of the reported coverage rules ### WHAT is this pull request doing? Tophat formatted markdown [here](https://github.com/Shopify/polaris/blob/2201e6ae68a3c0ee1e2c46aecf292515f67f028c/stylelint-polaris/README.md) Adds rule docs for: * Depth * Media queries * Z-index * Layout * Legacy
chloerice
force-pushed
the
stylelint-polaris-rule-docs
branch
from
7b0238f
to
e8038c1
Compare
juzser
added a commit
to juzser/polaris
that referenced
this pull request
Jul 27, 2023
Closes Shopify#7506 - [x] Bring in changes from https://github.com/Shopify/polaris/pull/7814/files - [ ] ~Finish adding examples to coverage/README.md~ (handling in separate [PR](Shopify#7878)) - [x] Update screenshots to reflect current approach - [x] Update/add comments to notable changes/fixes/open questions This pull request adds support for configuring `stylelint-polaris/coverage` rules with custom messages and metadata, so that error and warning messages tell admin builders how to resolve the problem and VS Code diagnostics link to the `@shopify/stylelint-polaris` documentation. For example: <img width="610" alt="Screenshot 2022-12-09 at 1 41 40 PM" src="https://user-images.githubusercontent.com/18447883/206791342-cc12ccab-9d36-44db-a619-d7c59dd2b265.png"> This PR also includes a bit of polish: - Added typing and descriptions to `polaris/coverage` plugin so that primary options are clear in the config and in the plugin's code - Updated plugin names to be singular instead of plural ```diff - custom-properties-allowed-list + custom-property-allowed-list - media-queries-allowed-list + media-query-allowed-list ``` <!-- Summary of the changes committed. Before / after screenshots are appreciated for UI changes. Make sure to include alt text that describes the screenshot. If you include an animated gif showing your change, wrapping it in a details tag is recommended. Gifs usually autoplay, which can cause accessibility issues for people reviewing your PR: <details> <summary>Summary of your gif(s)</summary> <img src="..." alt="Description of what the gif shows"> </details> --> <!-- ℹ️ Delete the following for small / trivial changes --> 🖥 [Local development instructions](https://github.com/Shopify/polaris/blob/main/README.md#local-development) 🗒 [General tophatting guidelines](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting.md) 📄 [Changelog guidelines](https://github.com/Shopify/polaris/blob/main/.github/CONTRIBUTING.md#changelog) <!-- Give as much information as needed to experiment with the component in the playground. --> <details> <summary>Copy-paste this code in <code>playground/Playground.tsx</code>:</summary> ```jsx import React from 'react'; import {Page} from '../src'; export function Playground() { return ( <Page title="Playground"> {/* Add the code you want to test in here */} </Page> ); } ``` </details> - [ ] Tested on [mobile](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting.md#cross-browser-testing) - [ ] Tested on [multiple browsers](https://help.shopify.com/en/manual/shopify-admin/supported-browsers) - [ ] Tested for [accessibility](https://github.com/Shopify/polaris/blob/main/documentation/Accessibility%20testing.md) - [ ] Updated the component's `README.md` with documentation changes - [ ] [Tophatted documentation](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting%20documentation.md) changes in the style guide
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
WHAT is this pull request doing?
Adds Polaris-specific documentation for each of the reported coverage rules
🎩 checklist
README.mdwith documentation changes