Resolved : Mobile device style groups incorrect order

[tejash-wagento]

Description

Style groups for mobile devices (max-width) are specified in the wrong order.

In lib/web/css/source/lib/_responsive.less the style groups run breakpoint-size ascending: 319px, 479px, 639px, 767px, which leads to outputting max-width media queries breakpoint-size ascending - the last-defined breakpoint overrides smaller screen size breakpoints...

Fixed Issues (if relevant)

Style groups for mobile devices (max-width) are specified in the wrong order.

1. magento/magento2Mobile device style groups incorrect order in _responsive.less #14476: Mobile device style groups incorrect order in _responsive.less
2. ...

Expected result

CSS should be output as follows:

@media only screen and (max-width: 479px) {
  .logo {
    max-width: 140px;
  }
}
@media only screen and (max-width: 639px) {
  .logo {
    max-width: 165px;
  }
}

Actual result

CSS is output as follows:

@media only screen and (max-width: 639px) {
  .logo {
    max-width: 165px;
  }
}
@media only screen and (max-width: 479px) {
  .logo {
    max-width: 140px;
  }
}

Contribution checklist

• Pull request has a meaningful description of its purpose
• All commits are accompanied by meaningful commit messages
• All new or changed code is covered with unit/integration tests (if applicable)
• All automated tests passed successfully (all builds on Travis CI are green)

[magento-engcom-team]

Hi @tejash-wagento. Thank you for your contribution
Here is some useful tips how you can test your changes using Magento test environment.
Add the comment under your pull request to deploy test or vanilla Magento instance:

• @magento-engcom-team give me test instance - deploy test instance based on PR changes
• @magento-engcom-team give me {$VERSION} instance - deploy vanilla Magento instance

For more details, please, review the Magento Contributor Assistant documentation

[magento-engcom-team]

Hi @tejash-wagento. Thank you for your contribution.
We will aim to release these changes as part of 2.2.6.
Please check the release notes for final confirmation.

Please, consider to port this solution to 2.3 release line.
You may use Porting tool to port commits automatically.