skynexui_responsive_stylesheet 1.7.9 skynexui_responsive_stylesheet: ^1.7.9 copied to clipboard
You don't need to be worried just because you have to support multiple screens
@skynexui/responsive_stylesheet: #
You don't need to be worried just because you have to support multiple screens πΊ π₯ π» π±
It's a set of common utility strategies to work with responsive styles with CSS in JS and Flutter
Contributing #
Want to contribute with the project? Check our guide with how and our code guidelines
How to report a bug? #
Please just open an issue with a link do a small reproduction of the bug and let's discuss about it
Summary #
Dart/Flutter π¦ #
How to install? #
flutter pub add skynexui_responsive_stylesheet
Get started #
Demo #
body: Container(
color: responsive.value({
Breakpoints.xs: Colors.red.shade200,
Breakpoints.sm: Colors.yellow.shade200,
Breakpoints.md: Colors.green.shade200,
Breakpoints.lg: Colors.blue.shade200,
Breakpoints.xl: Colors.purple.shade200,
}),
)
Other demos
JavaScript/React β #
How to install? #
yarn add @skynexui/responsive_stylesheet
Get started #
Demo #
Docs #
What are the default values for the breakpoints? #
xs: 0
From 0 screen width until 479sm: 480
From 480 screen width until 767md: 768
From 768 screen width until 991lg: 992
From 992 screen width until 1199xl: 1200
From 1200 and beyond
All values from here came from other libraries and responsive Front End frameworks.
Can I customize the breakpoints? #
Today, no. But it's in the have a way to do this but the names xs
...xl
will remain part of the library to make easier to use the abstractions.
Resources and features #
Feature. | Dart/Flutter | JavaScript/React |
---|---|---|
Responsive | β | β |
breakpoints | β | β |
GridItem | β | π§ |
parseStylesheet | π§ | β |
BreakpointsProvider | π§ | π§ |
β Ready, π§ WIP, β Not in roadmap by now, πΊοΈ Inside roadmap