Skip to content
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.

Sign up for GitHub

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

Jump to bottom

Enforce using rems/ems in stylesheets #153

Closed
alisonhall opened this issue Jun 25, 2024 · 2 comments · Fixed by #204
Closed

Enforce using rems/ems in stylesheets #153

alisonhall opened this issue Jun 25, 2024 · 2 comments · Fixed by #204
Assignees
@seyilonge-ps
Labels
internal development Not user-facing work - developer experience

Comments

@alisonhall
Copy link
Collaborator

alisonhall commented Jun 25, 2024 •
edited
Loading

We would like to have a linting/formatting rule to help enforce using responsive units (rems or ems) in our styles. This would help ensure code quality and help make sure that new code is responsive.

One way to do this may be to include the stylelint package in our code and include the stylelint-rem-over-px plugin. If using this approach, we would need to make sure that stylelint doesn't conflict with our existing prettier and eslint settings. stylelint-config-prettier may help with that.

We should investigate if there are better or easier ways to enforce this rule.
@alisonhall alisonhall added the internal development Not user-facing work - developer experience label Jun 25, 2024
@seyilonge-ps seyilonge-ps self-assigned this Jul 22, 2024
@seyilonge-ps seyilonge-ps mentioned this issue Aug 9, 2024
Closed
@seyilonge-ps
Copy link
Collaborator

seyilonge-ps commented Aug 9, 2024 •
edited
Loading

Stylelint does not exist in the project currently. It will have to be installed first before this plugin can be used within the project. I have opened a ticket #196 which has to be completed before this issue is resolved.

Tasks

seyilonge-ps pushed a commit that referenced this issue Aug 15, 2024
(#153) Enforce using rems/ems in stylesheets
d12c058 
Closes #153

* Added and enabled `stylelint-rem-over-px`
* Fixed console errors
@seyilonge-ps seyilonge-ps mentioned this issue Aug 15, 2024
Merged
seyilonge-ps pushed a commit that referenced this issue Aug 17, 2024
(#153) Enforce using rems/ems in stylesheets
ea9cb3a 
Closes #153

* Added and enabled `stylelint-rem-over-px`
* Fixed console errors
* Removed `stylelint-rem-over-px` for `stylelint`'s `declaration-property-unit-allowed-list` rule which allows for greater flexibility
* Cleaned up console errors
@seyilonge-ps
Copy link
Collaborator

seyilonge-ps commented Aug 19, 2024 •
edited
Loading

Stylelint does not exist in the project currently. It will have to be installed first before this plugin can be used within the project. I have opened a ticket #196 which has to be completed before this issue is resolved.

Tasks

The plugin stylelint-rem-over-px was eventually ditched in PR #204 for the stylelint rule declaration-property-unit-allowed-list which provided more flexibility and control, and less overhead since it's already part of stylelint.

seyilonge-ps pushed a commit that referenced this issue Aug 19, 2024
(#153) Enforce using rems/ems in stylesheets
9170f89 
Closes #153

* Added and enabled `stylelint-rem-over-px`
* Fixed console errors
* Removed `stylelint-rem-over-px` for `stylelint`'s `declaration-property-unit-allowed-list` rule which allows for greater flexibility
* Cleaned up console errors
seyilonge-ps pushed a commit that referenced this issue Sep 3, 2024
(#153) Enforce using rems/ems in stylesheets
61e753f 
Closes #153

* Added and enabled `stylelint-rem-over-px`
* Fixed console errors
* Removed `stylelint-rem-over-px` for `stylelint`'s `declaration-property-unit-allowed-list` rule which allows for greater flexibility
* Cleaned up console errors
seyilonge-ps pushed a commit that referenced this issue Sep 12, 2024
(#153) Enforce using rems/ems in stylesheets
a54f653 
Closes #153

* Added and enabled `stylelint-rem-over-px`
* Fixed console errors
* Removed `stylelint-rem-over-px` for `stylelint`'s `declaration-property-unit-allowed-list` rule which allows for greater flexibility
* Cleaned up console errors
* Separated `stylelint` into it's own task for `lint-staged`
* Fxied up font-size calculations
zoltan-dulac added a commit that referenced this issue Oct 9, 2024
@zoltan-dulac
Merge pull request #204 from PublicisSapient/ticket/153-enforce-rem-e…
3313377 
…m-use

(#153) Enforce using rems/ems in stylesheets
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@seyilonge-ps seyilonge-ps

Labels
internal development Not user-facing work - developer experience
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

(#153) Enforce using rems/ems in stylesheets PublicisSapient/enable-a11y
2 participants
@alisonhall @seyilonge-ps