In order to install this package, you can use the Install tab in the now familiar Settings View.
Open up the Settings View using Ctrl+, click on the "Install" tab and type your Materialize css into the box under Install Packages.
Some examples on how to use this plugin.
Press tab after typing the following snippet codes
CDN
Component
Snippet code
CDN Link(both CSS & JS)
m-cdn
CDN link (CSS only)
m-cdn:css
CDN link (JS only)
m-cdn:js
Templates
Component
Snippet code
HTML5 Template Layout
m-template:html
HTML5 Parallax Template Layout
m-template:parallax
HTML5 starter Template Layout
m-template:starter
Forms
Component
Snippet code
Form
m-form
Registation form
m-form:register
Tables
Component
Snippet code
Table
m-table
Bordered Table
m-table:bordered
Center Table
m-table:centered
Hover Table
m-table:hover
Responsive Table
m-table:responsive
Striped Table
m-table:striped
Input Fields (Form fields)
Component
Snippet code
Input with custom input error and success messages
m-input:textarea
Text-Area Input
m-input:textarea
Text-area Input Icon
m-input:textarea-icon
Text Input
m-input:text
Text Input Icon
m-input:text-icon
Checkbox
m-input:checkbox
Checkbox filled
m-input:checkbox-fill
Date Picker
m-input:date
File Input
m-input:file
Radio Button
m-input:radio
Radio Button with Gap
m-input:radio-gap
Radio Button group
m-input:radio-group
Range Input
m-input:range
Select Box
m-input:select
Select Box-disabled
m-input:select-disabled
Select Box browser default
m-input:select-default
Select Box browser default-disabled
m-input:select-default-disabled
Select Box group
m-input:select-group
Select Box with image icon
m-input:select-icon
Select Box with left image icon
m-input:select-icon-left
Select Box multiselect
m-input:select-multiple
Switch
m-input:switch
Switch-disabled
m-input:switch-disabled
Badges
Component
Snippet code
Badge
m-badge
Buttons
Component
Snippet code
Button-disabled
m-button:disabled
Fixed Floating Button
m-fixed-floating-button
Fixed Floating Button - horizontal
m-fixed-floating-button:horizontal
Flat Button
m-button:flat
Floating Button
m-button:floating
Large Button
m-lg-button
Raised Button
m-raised-button
Raised Button Icon
m-raised-button:icon
Submit Button
m-submit-button
Cards
Component
Snippet code
Default card
m-card
Image card
m-image-card
Panel card
m-panel-card
Revile card
m-revile-card
Default card(large)
m-card:lg
Default card(medium)
m-card:md
Default card(small)
m-card:sm
Revile card(large)
m-revile-card:lg
Revile card(medium)
m-revile-card:md
Revile card(small)
m-revile-card:sm
Collapsible
Component
Snippet code
Collapsible(single select)
m-collapsible
Collapsible(multiple select)
m-collapsible:expandable
Collapsible(default active)
m-collapsible:selected
Collections
Component
Snippet code
Basic Collection
m-collection
Collection with avatar
m-collection:avatar
Collection(Swipe to Dismiss)
m-collection:dismiss
Collection with links
m-collection:sec
Dialogs
Component
Snippet code
Toast
m-toast
Toast(Action)
m-toast:action
Tooltip
m-tooltip
Dropdown
Component
Snippet code
Dropdown
m-dropdown
Dropdown(hover)
m-dropdown:hover
Footer
Component
Snippet code
Footer
m-footer
Sticky footer
m-sticky-footer:css
Sticky footer contains CSS code for implementing a sticky footer.
Grid
Component
Snippet code
Column(Promo)
m-col:promo
Column
m-col
Column 1
m-col:1
Column 2
m-col:2
Column 3
m-col:3
Column 4
m-col:4
Column 5
m-col:5
Column 6
m-col:6
Column 7
m-col:7
Column 8
m-col:8
Column 9
m-col:9
Column 10
m-col:10
Column 11
m-col:11
Column 12
m-col:12
Helpers
Component
Snippet code
Align
m-align
Align Right
m-align:right
Align Left
m-align:left
Align Center
m-align:center
Align Vertical
m-valign
Vertical Align Wrapper
m-valign-wrapper
Float Right
m-right
Float Left
m-left
Hidden for Desktop Only
m-hide:desktop
Hidden for Tablet and Below
m-hide:tablet-down
Hidden for Tablet and Above
m-hide:tablet-up
Hidden for Tablet Only
m-hide:tablet
Hidden for Mobile Only
m-hide:mobile
Hidden for all Devices
m-hide
Truncate
m-truncate
Icons
Component
Snippet code
Icon
m-icon
Icon(large)
m-icon:lg
Icon(medium)
m-icon:md
Icon(small)
m-icon:sm
Icon(tiny)
m-icon:tiny
JS
Component
Snippet code
Scrollfire
m-scrollfire
Pushpin
m-pushpin
Navbar-slideout-js
m-navbar:slideout-js
Remember to precede Navbar-slideout-js with the "$" sign
Media
Component
Snippet code
Material Box
m-materialbox
Material Box(caption)
m-materialbox:caption
Slider
m-slider
Modal
Component
Snippet code
Modal
m-modal
Modal(fixed-footer)
m-modal:fixed-footer
Navbar
Component
Snippet code
Navbar
m-navbar
Navbar(center)
m-navbar:center
Navbar(collapse)
m-navbar:collapse
Navbar(fixed)
m-navbar:fixed
Navbar-icon
m-navbar:icon
Navbar-text-icon
m-navbar:icon-text
Navbar(left)
m-navbar:left
Navbar(right)
m-navbar:right
Navbar(search)
m-navbar:search
Navbar(slideout)
m-navbar:slideout
Navbar(slideout-dropdown)
m-navbar:slideout-dropdown
Navbar(slideout-fixed)
m-navbar:slideout-fixed
Navbar(slideout-fullscreen)
m-navbar:slideout-fullscreen
Pagination
Component
Snippet code
Basic Pagination
m-pagination
Parallax
Component
Snippet code
Parallax
m-parallax
Progress Bar
Component
Snippet code
Circular progress bar
m-progress-bar:circular
Determinate progress bar
m-progress-bar:determinate
Indeterminate progress bar
m-progress-bar:indeterminate
Rainbow progress bar
m-progress-bar:rainbow
Scroll
Component
Snippet code
Scroll Spy
m-scrollspy
Toast
Component
Snippet code
Toast dialog
m-toast
Toast dialog js (programatically call a toast)
m-toast-js
Tab
Component
Snippet code
Tab
m-tab
Typography
Component
Snippet code
Text-flow
m-flow-text
Breadcrumps
Component
Snippet code
Breadcrumps
m-breadcrumps
Chips
for tags and contacts
Component
Snippet code
Contacts chip
m-chip:contact
Tags chip
m-chip:tag
Very Important
Most content for v0.97.0 are no longer available
For material v0.97.0 and below, append -o
eg. m-lg-button-o will produce the old icon implementation <button type="button" class="waves-effect waves-light btn-large"><i class="mdi-file-cloud right"></i></button>.
