chore: fix off-by-one min-width: 1023px media queries
#15974
Merged
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
mdjermanovic
added
documentation
✅ Deploy Preview for docs-eslint ready!
To edit notification comments on pull requests, go to your Netlify site settings. |
|
@SaraSoueidan can you comment on this? Is this intentional? |
|
@nzakas It was intentional, yes. It's not a new practice. It ensures the “desktop” media queries aren't triggered on a 1024p-wide viewport, which has typically been a tablet (such as iPad) size. This practice has been carved in my brain for years that it comes naturally now. If @mdjermanovic has tested the site on medium-size displays and found no issues, then this PR LGTM. |
I'm confused now. If we don't want these styles to apply on 1024px, then shouldn't this actually be Before & after this change are same on 1024px: 1024px before & after this change
But different on 1023px, because both 1023px before this change
1023px after this change
|
|
I followed up with Sara (she’s been extremely busy) and she said to go ahead and merge this. |
nzakas
approved these changes
Aug 26, 2022
crapStone
pushed a commit
to Calciumdibromid/CaBr2
that referenced
this pull request
Sep 1, 2022
This PR contains the following updates: | Package | Type | Update | Change | |---|---|---|---| | [eslint](https://eslint.org) ([source](https://github.com/eslint/eslint)) | devDependencies | minor | [`8.22.0` -> `8.23.0`](https://renovatebot.com/diffs/npm/eslint/8.22.0/8.23.0) | --- ### Release Notes <details> <summary>eslint/eslint</summary> ### [`v8.23.0`](https://github.com/eslint/eslint/releases/tag/v8.23.0) [Compare Source](eslint/eslint@v8.22.0...v8.23.0) #### Features - [`3e5839e`](eslint/eslint@3e5839e) feat: Enable eslint.config.js lookup from CLI ([#​16235](eslint/eslint#16235)) (Nicholas C. Zakas) - [`30b1a2d`](eslint/eslint@30b1a2d) feat: add `allowEmptyCase` option to no-fallthrough rule ([#​15887](eslint/eslint#15887)) (Amaresh S M) - [`43f03aa`](eslint/eslint@43f03aa) feat: no-warning-comments support comments with decoration ([#​16120](eslint/eslint#16120)) (Lachlan Hunt) #### Documentation - [`b1918da`](eslint/eslint@b1918da) docs: package.json conventions ([#​16206](eslint/eslint#16206)) (Patrick McElhaney) - [`0e03c33`](eslint/eslint@0e03c33) docs: remove word immediately ([#​16217](eslint/eslint#16217)) (Strek) - [`c6790db`](eslint/eslint@c6790db) docs: add anchor link for "migrating from jscs" ([#​16207](eslint/eslint#16207)) (Percy Ma) - [`7137344`](eslint/eslint@7137344) docs: auto-generation edit link ([#​16213](eslint/eslint#16213)) (Percy Ma) #### Chores - [`2e004ab`](eslint/eslint@2e004ab) chore: upgrade [@​eslint/eslintrc](https://github.com/eslint/eslintrc)[@​1](https://github.com/1).3.1 ([#​16249](eslint/eslint#16249)) (Milos Djermanovic) - [`d35fbbe`](eslint/eslint@d35fbbe) chore: Upgrade to espree@9.4.0 ([#​16243](eslint/eslint#16243)) (Milos Djermanovic) - [`ed26229`](eslint/eslint@ed26229) test: add no-extra-parens tests with rest properties ([#​16236](eslint/eslint#16236)) (Milos Djermanovic) - [`deaf69f`](eslint/eslint@deaf69f) chore: fix off-by-one `min-width: 1023px` media queries ([#​15974](eslint/eslint#15974)) (Milos Djermanovic) - [`63dec9f`](eslint/eslint@63dec9f) refactor: simplify `parseListConfig` ([#​16241](eslint/eslint#16241)) (Milos Djermanovic) </details> --- ### Configuration 📅 **Schedule**: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined). 🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied. ♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox. 🔕 **Ignore**: Close this PR and you won't be reminded about this update again. --- - [ ] <!-- rebase-check -->If you want to rebase/retry this PR, click this checkbox. --- This PR has been generated by [Renovate Bot](https://github.com/renovatebot/renovate). <!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiIzMi4xNzcuMSIsInVwZGF0ZWRJblZlciI6IjMyLjE4MS4wIn0=--> Co-authored-by: cabr2-bot <cabr2.help@gmail.com> Reviewed-on: https://codeberg.org/Calciumdibromid/CaBr2/pulls/1527 Reviewed-by: Epsilon_02 <epsilon_02@noreply.codeberg.org> Co-authored-by: Calciumdibromid Bot <cabr2_bot@noreply.codeberg.org> Co-committed-by: Calciumdibromid Bot <cabr2_bot@noreply.codeberg.org>
eslint-github-bot
bot
added
the
archived due to age
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
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.
Prerequisites checklist
What is the purpose of this pull request? (put an "X" next to an item)
[ ] Documentation update
[ ] Bug fix (template)
[ ] New rule (template)
[ ] Changes an existing rule (template)
[ ] Add autofix to a rule
[ ] Add a CLI option
[ ] Add something to the core
[x] Other, please explain:
Updates css for the new docs site.
We have
min-width: 1023pxin several media queries. This seems like an off-by-one error as it matches >= 1023px which was probably not the intention.What changes did you make? (Give an overview)
Changed
min-width: 1023pxtomin-width: 1024pxin media queries.Is there anything you'd like reviewers to focus on?
max-width: 800pxin multiple places also looks suspicious, but I wasn't sure about that one so I left it out from this PR.