ovh-angular-responsive-tabs with angular-ui
Wrapper for Angular UI Bootstrap directive "Tabs", that works with Angular UI Router.
Dynamically calculate the size of the tabs and push it into a dropdown.
Installation
Bower
bower install ovh-angular-responsive-tabs --save
NPM
npm install ovh-angular-responsive-tabs --save
Get the sources
git clone https://github.com/ovh-ux/ovh-angular-responsive-tabs.git cd ovh-angular-responsive-tabs npm install bower install
You've developed a new cool feature ? Fixed an annoying bug ? We'd be happy to hear from you !
Have a look in CONTRIBUTING.md
Related links
- Contribute: https://github.com/ovh-ux/ovh-angular-responsive-tabs/blob/master/CONTRIBUTING.md
- Report bugs: https://github.com/ovh-ux/ovh-angular-responsive-tabs/issues
- Get latest version: https://github.com/ovh-ux/ovh-angular-responsive-tabs
License
See https://github.com/ovh-ux/ovh-angular-responsive-tabs/blob/master/LICENSE
Requirements
jQuery
ui.router
ui.bootstrap
Usage
There are 3 directives:
ovh-angular-responsive-tabs
The container which contains the tabs.
Options:
justified
(optional) : Justify align the tabs (NOT TESTED)vertical
(optional) : Verticaly align the tabs (NOT TESTED)immovable
(optional) : If true, prevent the directive to always display the active tab.
responsive-tab
A regular tab.
Options:
disabled
(optional) : Tab is disabled? (true/false)select
(optional) : Function called on selectdropdown
(optional) : Add this if the tab is an angular-ui dropdownstate
(optional) : ui.router statestateParams
(optional) : ui.router paramsstateOptions
(optional) : ui.router optionsdropdownTitle
(optional) : (text) Text for this tab in the "more tab" dropdowndropdownTitleTemplate
(optional) : (url) Text for this tab in the "more tab" dropdown
ovh-angular-responsive-tabs
MANDATORY The "more" tab dropdown (should be the last)
Example
Home Hub <!-- Should always be the last -->