Design

Theme layout

https://ionicframework.com/docs/theming/basics

Ionic v.4 comes with a turnkey UI Components library, based on Google's Material Design Library, which offers a lot of flexibility to customize the theme with our company's colors.

Doc	Details
Layout structure	<ion-header> & <ion-footer> ; <ion-tabs> ; <ion-menu> ; <ion-split-pane>
Responsive grid layout	How <ion-grid><ion-row><ion-col> works — Default xs,sm,md,lg,xl breakpoint values — Customizing the grid using layout variables — <ion-col size="*">
CSS utility classes	"ion-text-*" ; "ion-float-*" ; "ion-hide" ; "ion-padding" ; "ion-margin" ; "ion-no-border" — Flex containers and Flex items

Development

Local development

https://ionicframework.com/docs/installation/cli#start-an-app

Running ionic on localhost

$ ionic serve

API Components

https://ionicframework.com/docs/api

List of only grouped components

• …
• -- !!depricated!! ion-anchor --
• ion-app: Single main container
• …
• ion-button, ion-buttons
• ion-card, ion-card-content, ion-card-header, ion-card-subtitle, ion-card-title
• …
• ion-content, ion-footer, ion-header
• …
• ion-fab, ion-fab-button, ion-fab-list
• ion-grid, ion-row, ion-col,
• …
• ion-infinite-scroll, ion-infinite-scroll-content
• …
• ion-item, ion-item-divider, ion-item-group, ion-item-option, ion-item-options, ion-item-sliding
• …
• ion-list, ion-list-header
• ion-loading, ion-loading-controller
• ion-menu, ion-menu-button, ion-menu-controller, ion-menu-toggle
• ion-modal, ion-modal-controller
• ion-nav, ion-nav-pop, ion-nav-push, ion-nav-set-root
• …
• ion-picker, ion-picker-controller
• ion-popover, ion-popover-controller
• …
• ion-radio, ion-radio-group
• …
• ion-refresher, ion-refresher-content
• ion-reorder, ion-reorder-group
• ion-ripple-effect : How to « code ripple effect without Javascript ».
• ion-route, ion-route-redirect
• ion-router, ion-router-link, ion-router-outlet
• …
• ion-segment, ion-segment-button
• ion-select, ion-select-option
• …
• ion-slide, ion-slides
• …
• ion-tab, ion-tab-bar, ion-tab-button, ion-tabs
• …
• ion-toast, ion-toast-controller
• …