diff --git a/README.md b/README.md index 89d2aa9..40fc8b3 100644 --- a/README.md +++ b/README.md @@ -9,7 +9,22 @@ Feel free to let me know what else you want added via: - [Issues](https://github.com/PixelDropInc/ionic-snippets-sublime-plugin/issues) +### Installation + +There are 3 methods for installing this plugin. + +1. Search for "ionic framework snippets" via the "Package Control: Install Packages" menu. +**Note:** If you don't have Sublime Package Control installed, you can find out how to install it here [https://sublime.wbond.net/installation](https://sublime.wbond.net/installation) + +2. Clone the repository into your Sublime Text 2/3 packages directory. +`git clone https://github.com/PixelDropInc/ionic-snippets-sublime-plugin.git + +3. Download the .zip file and unzip it into your Sublime Text 2/3 packages directory. +**Note:** You can find your Sublime Text 2/3 packages directory by going to Preferences > Browse Packages. + ## What's included - contents +### CSS Snippets +- [Installation](#installation) - [Installation](#installation) - [Header](#header) - [Content](#content) @@ -25,23 +40,30 @@ Feel free to let me know what else you want added via: - [Select](#select) - [Tabs](#tabs) - [Utility](#utility) -- [License](#license) +### JS Snippets +- [Tabs](#jstabs) +- [SideMenu](#sidemenu) +- [Navigation](#navigation) +- [HeadersFooters](#headersfooters) +- [Content](#content) +- [Scroll](#scroll) +- [Lists](#lists) +- [Form Input](#forminput) +- [Slide Box](#slidebox) +- [Modal](#modal) +- [Popover](#popover) +- [ActionSheet](#actionsheet) +- [Popup](#popup) +- [Loading](#loading) +- [Events](#events) +- [Backdrop](#backdrop) +- [TapClick](#tapclick) +- [Keyboard](#keyboard) +- [License](#license) -### Installation - -There are 3 methods for installing this plugin. - -1. Search for "ionic framework snippets" via the "Package Control: Install Packages" menu. -**Note:** If you don't have Sublime Package Control installed, you can find out how to install it here [https://sublime.wbond.net/installation](https://sublime.wbond.net/installation) - -2. Clone the repository into your Sublime Text 2/3 packages directory. -`git clone https://github.com/PixelDropInc/ionic-snippets-sublime-plugin.git - -3. Download the .zip file and unzip it into your Sublime Text 2/3 packages directory. -**Note:** You can find your Sublime Text 2/3 packages directory by going to Preferences > Browse Packages. -# +### CSS Snippets ionic css snippets are prefixed with ion- ### Header @@ -190,12 +212,194 @@ ionic css snippets are prefixed with ion- | tabs-left-icon | ion-tabs-icon-left | + ### Utility | Component | Snippet code | |------------------------------- | :-----------------------------:| | icons | ion-star | + +# + +### JsTabs + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| tabs | ion-js-tabs | +| tab | ion-js-tab | +| ionictabsdelegate(html) | ion-js-$ionictabsdelegate-html | +| ionictabsdelegate(angular) | ion-js-$ionictabsdelegate-ng | + +### SideMenu + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| SideMenus | ion-js-side-menus-html | +| SideMenu | ion-js-side-menu-html | +| SideMenu(angular) | ion-js-side-menu-ng | +| SideMenu-Content | ion-js-side-menu-content-html | +| Menu-toggle | ion-js-menu-toggle | +| Menu-close | ion-js-menu-close | +| SideMenu-Content | ion-js-side-menu-content | +| Ionic-sidemenu-delegate(html) | ion-js-$ionicsidemenudelegate-html | +| Ionic-sidemenu-delegate(angular)| ion-js-$ionicSideMenuDelegate-ng | + +### Navigation + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| Nav-view | ion-js-nav-view | +| View | ion-js-view | +| Nav-bar | ion-js-nav-bar | +| Nav-button | ion-js-nav-button | +| Nav-backButton | ion-js-nav-back-button | +| Nav-clear | ion-js-nav-clear | +| Nav-bar-Delegate(html) | ion-js-$ionicnavbardelegate-html | +| Nav-bar-Delegate(angular) | ion-js-$ionicnavbardelegate-ng | + + +### HeadersFooters + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| Header | ion-js-header-bar | +| Footer | ion-js-footer-bar | + +### Content + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| Content | ion-js-content | +| Refresher | ion-js-refresher | +| Pane | ion-js-pane | + +### Scroll + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| Scroll | ion-js-scroll | +| Infinite-Scroll | ion-js-infinite-scroll | +| Ionic-scroll-delegate(html) | ion-js-$ionicScrollDelegate-html| +| Ionic-scroll-delegate(angular) | ion-js-$ionicScrollDelegate-ng | + +### Lists + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| list | ion-js-list | +| item | ion-js-item | +| DeleteButton | ion-js-delete-button | +| ReorderButton(html) | ion-js-reorder-button-html | +| ReorderButton(angular) | ion-js-reorder-button-ng | +| OptionButton | ion-js-option-button | +| CollectionRepeat(html) | ion-js-collection-repeat-html | +| CollectionRepeat(angular) | ion-js-collection-repeat-ng | +| ListDelegate(html) | ion-js-$ioniclistdelegate-html | +| ListDelegate(angular) | ion-js-$ioniclistdelegate-ng | + + +### FormInput + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| Checkbox | ion-js-checkbox | +| Radio | ion-js-radion | +| Toggle | ion-js-toggle | + + +### SlideBox + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| SlideBox | ion-js-slidebox | +| SlideboxDelegate (html) | ion-js-$ionicslideboxdelegate-html| +| SlideboxDelegate (angular) | ion-js-$ionicslideboxdelegate-ng| + +### Modal + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| Modal (html) | ion-js-$ionicmodal-html | +| Modal (angular) | ion-js-$ionicmodal-ng | + +### Popover + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| Popover (html) | ion-js-$ionicpopover-html | +| Popover (angular) | ion-js-$ionicpopover-ng | + +### ActionSheet + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| ActionSheet | ion-js-$ionicactionsheet-ng | + +### Popup + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| PopupAlert | ion-js-$ionicpopup-alert-ng | +| PopupConfirm | ion-js-$ionicpopup-confirm-ng | + +### Loading + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| Loading | ion-js-$ionicLoading-ng | +| LoadingConfig | ion-js-$ionicLoadingConfig-ng | + + +### Events + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| on-hold | ion-js-on-hold | +| on-tap | ion-js-on-tap | +| on-tap | ion-js-on-tap | +| on-touch | ion-js-on-touch | +| on-release | ion-js-on-release | +| on-drag | ion-js-on-drag | +| on-drag-up | ion-js-on-drag-up | +| on-drag-right | ion-js-on-drag-right | +| on-drag-down | ion-js-on-drag-down | +| on-drag-left | ion-js-on-drag-left | +| on-swipe | ion-js-on-swipe | +| on-drag-up | ion-js-on-swipe-up | +| on-drag-right | ion-js-on-swipe-right | +| on-drag-down | ion-js-on-swipe-down | +| on-drag-left | ion-js-on-swipe-left | + + +### BackDrop + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| backdrop | ion-js-$ionicbackdrop-ng | + +### Events + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| on-hold | ion-js-on-hold | + + +### TapClick + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| tap | ion-js-tap | + + +### Keyboard + +| Component | Snippet code | +|------------------------------- | :-----------------------------:| +| keyboard | ion-js-keyboard | +| keyboard-attach | ion-js-keyboard-attach | + + ### License Ionic Snippets - Sublime Plugin is open-sourced software licensed under the [GNU GPL license](http://www.gnu.org/copyleft/gpl.html).