[Enhancement] Media Query Range -> Based on Material "you" 3 (Compatible MaterializeWeb)

[Kam3leoN]

Before submitting...

• I have searched for duplicate or closed issues.
• I have read the CONTRIBUTING document and my issue is following the guidelines.
• I have read the template completely before filling it in.

Context

// Media Query Ranges $small-screen-up: 601px !default; $medium-screen-up: 993px !default; $large-screen-up: 1201px !default; $small-screen: 600.99px !default; $medium-screen: 992.99px !default; $large-screen: 1200.99px !default; $medium-and-up: "only screen and (min-width : #{$small-screen-up})" !default; $large-and-up: "only screen and (min-width : #{$medium-screen-up})" !default; $extra-large-and-up: "only screen and (min-width : #{$large-screen-up})" !default; $small-and-down: "only screen and (max-width : #{$small-screen})" !default; $medium-and-down: "only screen and (max-width : #{$medium-screen})" !default; $medium-only: "only screen and (min-width : #{$small-screen-up}) and (max-width : #{$medium-screen})" !default;

Current Behavior

No response

Expected behavior

No response

Possible Solutions or Causes

// Media Query Ranges 'Material you 3' $extra-small-screen-up: 0px !default; $small-screen-up: 600px !default; $medium-screen-up: 840px !default; $large-screen-up: 1200px !default; $extra-large-screen-up: 1600px !default; $extra-small-screen: 599.99px !default; $small-screen: 839.99px !default; $medium-screen: 1199.99px !default; $large-screen: 1599.99px !default; // ...-and-up : min-width $small-and-up: "only screen and (min-width : #{$small-screen-up})" !default; $medium-and-up: "only screen and (min-width : #{$medium-screen-up})" !default; $large-and-up: "only screen and (min-width : #{$large-screen-up})" !default; $extra-large-and-up: "only screen and (min-width : #{$extra-large-screen-up})" !default; // ...-and-down : max-width $extra-small-and-down: "only screen and (max-width : #{$extra-small-screen})" !default; $small-and-down: "only screen and (max-width : #{$small-screen})" !default; $medium-and-down: "only screen and (max-width : #{$medium-screen})" !default; $large-and-down: "only screen and (max-width : #{$large-screen})" !default; // ...-only : min-width & max-width $extra-small-only: "only screen and (min-width : #{$extra-small-screen-up}) and (max-width : #{$extra-small-screen})" !default; $small-only: "only screen and (min-width : #{$small-screen-up}) and (max-width : #{$small-screen})" !default; $medium-only: "only screen and (min-width : #{$medium-screen-up}) and (max-width : #{$medium-screen})" !default; $large-only: "only screen and (min-width : #{$large-screen-up}) and (max-width : #{$large-screen})" !default;

Your Environment

• Version used: 2.2.2
• Browser Name and version: Chrome Latest
• Operating System and version (desktop or mobile): All
• Additional information you want to tell us: