For use this plugin you should install before Emmet Everywhere plugin
An IntelliJ plugin containing Zurb foundation 6 live templates! This plugin works for the following JetBrains products:
- IntelliJ IDEA 14,15,16
- WebStorm 9,10,11
- PyCharm 4,5
- RubyMine 7,8
- PhpStorm 8,9,10
- Open the Settings/Preferences dialog (OSX/Unix: ⌘,, Windows: Ctrl+Alt+S)
- In the left-hand pane, select Plugins.
- Click Browse repositories... and search for
Zurb Foundation 6 - Click Install plugin and confirm your intention to download and install the plugin.
- Click OK in the Settings dialog and restart.
HTML
- CDN from CloudFlare
- LAYOUT
- TYPOGRAPHY
- CONTROLS
- LIBRARIES
- NAVIGATION
- CONTAINERS
- MEDIA
- PLUGIN
- UTILITY
- MISCELLANEOUS
- TEMPLATE
Component:group zf-cdn Ctrl + Space |
Snippet code |
|---|---|
| CDN css flex, rtl | zf-cdn-css |
| CDN CSS Motion UI | zf-cdn-motion-ui-css |
| CDN JS | zf-cdn-js |
| CDN JS Motion UI | zf-cdn-motion-ui-js |
| CDN JS Wow | zf-cdn-wow-js |
| CDN LIB | zf-cdn-lib |
| CDN ICONS | zf-cdn-icons |
| CDN JQUERY | zf-cdn-jquery |
| CDN DATEPICKER JS | zf-cdn-datepiker.js |
| CDN DATEPICKER CSS | zf-cdn-datepiker.css |
| CDN LIB-UTIL | zf-cdn-lib-util |
| CDN JSSOR-SLIDER | zf-cdn-jssor-slider |
| CDN Initialize | zf-cdn-initialize |
Component:group zf-lt Ctrl + Space |
Snippet code |
|---|---|
Row emmet |
zf-ltro |
Row Flex emmet |
zf-ltrof |
| Row Source Ordering | zf-ltso |
| Row Collapse/Uncollapse | zf-ltcu |
Row Block Grids emmet |
zf-ltbg |
| QUICK ADDITIONAL: | |
| -- Grid XY options x | gx |
| -- Grid XY options y | gy |
| -- Flexbox options | fx |
| -- small columns | sc |
| -- medium columns | mc |
| -- large columns | lc |
Component:group zf-ty Ctrl + Space |
Snippet code |
|---|---|
| -- Text Alignment | txta |
Component:group zf-cr Ctrl + Space |
Snippet code |
|---|---|
| Button (All options) | zf-crbt |
| Button (All options dropdown) | zf-crbtd |
| Button Accessibility (actions) | zf-crbtc |
| Button Anchors (links) | zf-crbta |
| Button group (All options) | zf-crbtg |
| Button close | zf-crcbt |
Component:group zf-lb Ctrl + Space |
Snippet code |
|---|---|
| Motion UI | zf-lbmu |
| Libraries Utility | triggers |
|---|---|
| Data-animation In & Out | mo-data-animation |
| Motion UI In & Out | mo-in-out |
| Motion UI In | mo-in |
| Motion UI Out | mo-out |
| Panini Utility | |
|---|---|
| Helpers | {#h |
| Front Matter Block | ---: and ---:: |
| {{# }} | {# |
| {{> }} | {> |
Component:group zf-nv Ctrl + Space |
Snippet code |
|---|---|
Basic Menus emmet |
zf-nvbm |
Icons Menus emmet |
zf-nvim |
Dropdown Menus emmet |
zf-nvdm JS |
Drilldown Menus emmet |
zf-nvdl JS |
-- Sub Drop&drilldown Menus emmet |
sub-dropdown-drilldown JS |
Top Bar emmet |
zf-nvtb |
-- Sub Top Bar emmet |
sub-top-bar |
Responsive Menus emmet |
zf-nvrm JS |
-- Sub Responsive Menus emmet |
sub-responsive JS |
Responsive Toggle Menus emmet |
zf-nvrt JS |
Breadcrumbs emmet |
zf-nvbr |
Pagination emmet |
zf-nvpg |
Component:group zf-ct Ctrl + Space |
Snippet code |
|---|---|
Accordion emmet |
zf-ctac JS |
| -- Adding accordion | ADDaccordion JS |
Accordion Responsiveemmet |
zf-ctar JS |
| Callout | zf-ctcl |
| Callout Closable | zf-ctcc |
| Dropdown | zf-ctdp JS |
Card emmet |
zf-ctcd |
| Media Object | zf-ctmo |
| -- Sup Media Object Section | sup-media-object-section |
| Off-canvas | zf-ctof JS |
| Reveal Modal | zf-ctmd Motion UI JS |
Tables emmet |
zf-cttb |
Tabs Panel emmet |
zf-cttp |
Tabs Vertical Panel emmet |
zf-cttv |
-- Sup Panel Tabs emmet |
sup-panel-tabs |
Component:group zf-md Ctrl + Space |
Snippet code |
|---|---|
| Badge | zf-mdba |
| Flex Video | zf-mdfv |
| Label | zf-mdla |
Orbit Slider Motion UI emmet |
zf-mdos Motion UI JS |
Tooltips emmet |
zf-mdtp JS |
Component:group zf-pl Ctrl + Space |
Snippet code |
|---|---|
| Abide | zf-plab JS |
Equalizer Basics emmet |
zf-pleq JS |
Equalizer Responsive emmet |
zf-pleqr JS |
Interchange Img emmet |
zf-plit-img JS |
Interchange Div emmet |
zf-plit-div JS |
Interchange Html emmet |
zf-plit-html JS |
Toggler Animate Motion UI |
zf-pltga JS |
Toggler Closable Animate Motion UI |
zf-pltgc JS |
| Sticky | zf-plst JS |
Adding Abide 10 snippets in one |
ADDabide |
|---|---|
1 Number abide |
abd-number |
2 Text abide |
abd-text |
3 Password-match abide |
abd-password-match |
4 Url abide |
abd-url |
5 Email abide |
abd-email |
6 Select abide emmet |
abd-select |
7 Radio abide |
abd-radio |
8 Checkbox abide |
abd-checkbox |
9 Custom Pattern |
abd-custom |
10 Button abide (Submit or Reset) |
abd-button |
| ressources: regexlib | |
| JavaScript Regular Expression Visualizer |
| Utility | Trigger |
|---|---|
| Image Placeholder LOREMPIXEL | imgpl |
| Gallery Placeholder LOREMPIXEL | imgpg |
| Image Placeholder PLACEHOLD.IT | imgpi |
| Image Placeholder PLACEKITTEN | imgpk |
| Icon font (283 Foundation icons in i tag ) | icon-font |
| fi-icon-name (283 Foundation icons ) | fi- |
| data-icon (283 Foundation icons data ) | data-icon |
| -- CSS snippet for data-icon | css-data-icon |
| (just for fun, but can be useful!) | Snippet code |
|---|---|
Sticky Menu MagellanemmetInspired by Rafi |
sticky-magellan |
| Component | Snippet code |
|---|
| Inception in (live template) | Trigger |
|---|---|
| add small column | ADDsmall-column-item |
| add large column | ADDlarge-column-item |
| add medium column | ADDmedium-column-item |
| add small medium large column | ADDsmall-medium-large-column-item |
Foundation 6 - Intellij Plugin is open-sourced software licenced under the MIT:Licence