Foundation
Foundation for APPS
introduction
webapp prototyping framework
+
=
features
- Dynamic routing (ui-router)
- Responsive grid (foundation)
- Components (foundation)
- Motion UI (AngularJS)
dynamic routing
- based on ui-router
- easy config through metadata
---
name: home
url: /
animationIn: slideInRight
animationOut: slideOutLeft
---
<div class="grid-content">
...
</div>responsive grid
- mediaqueries
- optimized for webapps
- flexbox
<div class="grid-block">
<div class="grid-content small-12 medium-4">
yellow
</div>
<div class="grid-content small-12 medium-4">
blue
</div>
<div class="grid-content small-12 medium-4">
green
</div>
</div>components
- off-canvas
- modal
- forms & buttons
- UI elements
- accordion
- tabs
- etc. - more, more, more
All implemented as Angular directives
motion UI
- easy transitions
- integrated in all components
- set via HTML for components
- set via config metadata for routing
<div zf-panel="" animation-in="slideInRight" animation-out="slideOutUp">
<!-- ... -->
</div>---
name: home
url: /
animationIn: slideInRight
animationOut: slideOutLeft
---
<div class="grid-content">
...
</div>more...
