✨(react) add responsive helper
This helper provides handy functions to make components responsive.
This commit is contained in:
13
packages/react/src/utils/_responsive.scss
Normal file
13
packages/react/src/utils/_responsive.scss
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
@use "sass:map";
|
||||||
|
@use "../cunningham-tokens" as *;
|
||||||
|
|
||||||
|
@function breakpoint($name, $tokens: $themes) {
|
||||||
|
@return map.get($tokens, 'default', 'theme', 'breakpoints', $name);
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin container($name, $tokens: $themes) {
|
||||||
|
$breakpoint: breakpoint($name, $tokens);
|
||||||
|
@container (max-width: #{$breakpoint}) {
|
||||||
|
@content;
|
||||||
|
}
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user