Skip to content

fivethree-team/vscode-fivethree-snippets

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

76 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Fivethree Snippets for VS Code

Visual Studio Marketplace

Visual Studio Code Extension adds TypeScript and HTML snippets for Fivethree Web Components.

All code snippets are based on and follow the Angular style guide Fivethree Web Components.

Using Snippets for Fivethree Web Components

Type part of a snippet, press enter, and the snippet unfolds.

Table of Content

Snippets Documentation

Prefix Description
s- Svelte Snippets

Ruby

Prefix Description
f-version fiv fastlane action for versioning
f-version-update update the version number in config.xml
f-version-and-build-no-update update the version adn build number in config.xml
f-inc-build update the version number in config.xml
f-bump-version bump current version and push to remote
f-transparent_statusbar add transparent statusbar to ios or android
f-ionic add transparent statusbar to ios or android
f-select-branding select branding key from branding folder
f-select-branding-w-path select branding key from branding folder with path to branding folder
f-select-brandings select branding keys from branding folder
f-select-brandings-w-path select branding keys from branding folder with path to branding folder
f-selected-branding-key-env selected branding key from ENV
f-selected-branding-path-env selected branding path from ENV
f-sign-android add transparent statusbar to ios or android

Html

Prefix Description
f-app-bar
f-bottom-sheet
f-bottom-sheet-content
f-center [fiv-center] directive to center horizontal and vertical
f-collapse-menu [fivCollapseMenu] directive to collapse your menu, add this to
f-collapsable-menu-button add this to in the menu
f-expandable w/ and
f-expandable-ripple-header w/ and
f-expandable-indicator
f-gallery
f-gallery-w-image
f-gallery-image
f-gallery-toolbar
f-icon
f-loading-button
f-loading-content
f-loading-fab
f-loading-progress-bar
f-password-input
f-ripple effect for any component
f-router-item works great in IonMenu w/ active state highlight of the current route
f-step
f-step-loop w/ *ngFor
f-step-full
f-stepper w/
f-stepper-loop w/
f-toolbar-search w/

Scss

Prefix Description
f-loading-button-props Loading Button CSS custom properties
f-loading-progress-bar-props Loading Progress Bar CSS custom properties
f-router-item-props Router Item CSS custom properties

Typescript

Prefix Description
f-loading-button-click method for (fivButtonClick)
f-loading-content-do-refresh output handler method

⬆ back to top