ctrl+shift+p filters: :st2 :st3 :win :osx :linux
Browse

Ionic Snippets

by TenthGeek ST2/ST3

A sublime plugin complete with ionic framework snippets

Labels snippets, markup

Details

Installs

  • Total 15K
  • Win 9K
  • OS X 4K
  • Linux 2K
Apr 23 Apr 22 Apr 21 Apr 20 Apr 19 Apr 18 Apr 17 Apr 16 Apr 15 Apr 14 Apr 13 Apr 12 Apr 11 Apr 10 Apr 9 Apr 8 Apr 7 Apr 6 Apr 5 Apr 4 Apr 3 Apr 2 Apr 1 Mar 31 Mar 30 Mar 29 Mar 28 Mar 27 Mar 26 Mar 25 Mar 24 Mar 23 Mar 22 Mar 21 Mar 20 Mar 19 Mar 18 Mar 17 Mar 16 Mar 15 Mar 14 Mar 13 Mar 12 Mar 11 Mar 10 Mar 9
Windows 6 7 11 18 17 16 17 9 9 8 12 8 11 21 9 8 18 18 20 18 25 7 11 44 15 13 38 13 17 10 17 15 21 22 21 13 15 11 22 10 18 19 7 13 14 14
OS X 0 2 5 1 5 3 4 4 2 1 7 2 6 3 2 3 5 5 5 2 4 6 0 2 4 2 5 3 0 3 3 6 8 5 3 3 4 4 1 4 2 4 3 4 8 7
Linux 4 5 1 4 3 5 1 2 3 3 7 1 4 2 0 1 6 3 3 4 3 2 3 2 8 7 4 4 0 2 2 7 2 2 4 2 2 4 3 2 5 3 1 1 1 0

Readme

Source
raw.​githubusercontent.​com

Ionic Snippets - Sublime Plugin

A sublime plugin complete with ionic framework snippets

Feel free to let me know what else you want added via:

Installation

There are 3 methods for installing this plugin.

  1. Search for “ionic 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

  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

JS Snippets

CSS Snippets

ionic css snippets are prefixed with ion-

Header

Component Snippet code
bar-light ion-bar-light
bar-stable ion-bar-balanced
bar-positive ion-bar-positive
bar-calm ion-bar-calm
bar-balanced ion-bar-balanced
bar-energized ion-bar-energized
bar-assertive ion-bar-assertive
bar-royal ion-bar-royal
bar-dark ion-bar-dark
Sub Header ion-bar-subheader

Footer

Component Snippet code
bar-footer ion-bar-footer
bar-footer-left-right ion-bar-footer-left-right
bar-footer-pull-left ion-bar-footer-pull-left
bar-footer-pull-right ion-bar-footer-pull-right

Buttons

Component Snippet code
button ion-button
button-block ion-button-block
button-light ion-button-light
button-stable ion-button-stable
button-positive ion-button-positive
button-calm ion-button-calm
button-balanced ion-button-balanced
button-energized ion-button-energized
button-assertive ion-button-assertive
button-royal ion-button-royal
button-dark ion-button-dark
button-fullwidth ion-button-full
button-smallsize ion-button-small
button-largesize ion-button-large
button-outline ion-button-outline
button-clear ion-button-clear
button-home ion-button-home
button-star ion-button-star
button-chevron-left ion-button-chevron-left
button-chevron-right ion-button-chevron-right
button-gear ion-button-gear
button-setting ion-button-setting
button-navicon ion-button-navicon
button-clear ion-button-clear
button-bar ion-button-bar

List

Component Snippet code
list ion-list-ul
list-divider ion-item-divider
list-icons-email ion-list-icon-email
list-icons-chatBubble ion-list-icon-chatbubble
list-icons-mic ion-list-icon-mic
list-icons-person ion-list-icon-person
list-button ion-list-button-positive
list-item-avatar ion-list-item-avatar
list-item-thumbnail ion-list-item-thumbnail
list-inset ion-item-inset

Cards

Component Snippet code
card ion-card
card-header-footer ion-card-header-footer
card-list ion-list-card
card-showcase ion-list-card-showcase
card-images ion-list-card-img

Forms

Component Snippet code
form ion-form
form-placeholder-label ion-form-placeholder-label
form-inline-label ion-form-inline-label
form-stacked-label ion-form-stacked-label
form-floating-label ion-form-floating-label
inset-form ion-form-inset
form-input-icon ion-form-input-icon
form-inline-label ion-form-inline-label
form-header-input ion-form-header-input

Toggle

Component Snippet code
toggle ion-toggle
toggle-item ion-item-toggle

Checkbox

Component Snippet code
Checkbox ion-item-checkbox

RadioButtons

Component Snippet code
RadioButton ion-item-radio

Range

Component Snippet code
range ion-range
range-list ion-range-list

Select

Component Snippet code
select ion-item-select

Tabs

Component Snippet code
tabs ion-tabs
tabs-icon ion-tabs-icon
tabs-top-icon ion-tabs-icon-top
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.