mirror of
https://github.com/noodlapp/noodl-docs.git
synced 2026-01-11 23:02:54 +01:00
Initial commit
Co-Authored-By: kotte <14197736+mrtamagotchi@users.noreply.github.com> Co-Authored-By: mikaeltellhed <2311083+mikaeltellhed@users.noreply.github.com> Co-Authored-By: Tore Knudsen <18231882+torekndsn@users.noreply.github.com> Co-Authored-By: Michael Cartner <32543275+michaelcartner@users.noreply.github.com>
This commit is contained in:
@@ -0,0 +1,26 @@
|
||||
---
|
||||
title: Media Query Setup
|
||||
hide_title: true
|
||||
---
|
||||
|
||||
# Media Query Setup
|
||||
|
||||
This component sets up all media queries for your app. It should be placed in you home component. Your project should only include one **Media Query Setup** node.
|
||||
|
||||
<div className="ndl-image-with-background xl">
|
||||
|
||||

|
||||
|
||||
</div>
|
||||
|
||||
## Changing the breakpoints
|
||||
|
||||
This component comes with a prediefined set of commonly used breakpoints:
|
||||
|
||||
- **Small Mobile**: 400px and smaller
|
||||
- **Regular Mobile**: 401px to 700px
|
||||
- **Tablet**: 701px to 1200px
|
||||
- **Regular Desktop**: 1201px to 1800px
|
||||
- **Large Desktop**: 1801px and above
|
||||
|
||||
If you want to change the recommended defaults, this can be done at the top of the **Register media queries** Script node.
|
||||
Reference in New Issue
Block a user