Refactor and use variables for CSS break size

[sapk]

Like defined here: #10301 (comment)
On many part of our less code there is various size for break size definition. We should regroup them and the use same values everywhere and based on variables.

I open an issue because we should keep this in our TODO list.

Related #10348

[stale]

This issue has been automatically marked as stale because it has not had recent activity. I am here to help clear issues left open even if solved or waiting for more insight. This issue will be closed if no further activity occurs during the next 2 weeks. If the issue is still valid just add a comment to keep it alive. Thank you for your contributions.

[wxiaoguang]

The UI part (CSS) has been improved a lot, and we don't use "less" anymore.

In most cases, it's better to just "wrap", use "grid" and "flex", do not use too many unnecessary "break sizes"