Screens
This guide explains how to use the ready-made screens provided in Nectar and modify them as per your needs.
Nectar provides over 50 carefully crafted, commonly needed, ready-to-use, functional screens for building beautiful and intuitive user interfaces.
Each screen is designed using Google's Material Design System for Android, Apple's Cupertino Design System for iOS, and Framework7's Aurora Design System for Desktops.
Each screen is designed upon a Grid System for responsiveness, and therefore looks perfect on mobiles, tablets and desktop.
These screens are built using various Components, with some JavaScript code and HTML5 Web APIs for business logic and functionalities.
The data in these screens is populated using fake data generation library Faker.js and some JSON files with dummy data located in
/www/assets/custom/dataset/ folder.You can take this as a reference and populate the screens with your own data coming from an REST API.
You can access the code for screens in
/www/partials/screens/ folder. The code is pretty much self-explanatory and therefore can be modified easily as per your needs.These screens strictly follows the Framework7's Router Component structure. Therefore it is highly advised to learn about them at https://framework7.io/docs/router-component
Last modified 7d ago