Materialize, a CSS Framework based on Material Design

Overview

MaterializeCSS

Materialize, a CSS Framework based on material design.
-- Browse the docs --

Travis CI badge npm version badge CDNJS version badge dependencies Status badge devDependency Status badge Gitter badge

Table of Contents

Quickstart:

Read the getting started guide for more information on how to use materialize.

  • Download the latest release of materialize directly from GitHub. (Beta)
  • Clone the repo: git clone https://github.com/Dogfalo/materialize.git (Beta: git clone -b v1-dev https://github.com/Dogfalo/materialize.git)
  • Include the files via cdnjs. More here. (Beta)
  • Install with npm: npm install materialize-css (Beta: npm install materialize-css@next)
  • Install with Bower: bower install materialize (DEPRECATED)
  • Install with Atmosphere: meteor add materialize:materialize (Beta: meteor add materialize:materialize@=1.0.0-beta)

Documentation

The documentation can be found at http://materializecss.com. To run the documentation locally on your machine, you need Node.js installed on your computer.

Running documentation locally

Run these commands to set up the documentation:

git clone https://github.com/Dogfalo/materialize
cd materialize
npm install

Then run grunt monitor to compile the documentation. When it finishes, open a new browser window and navigate to localhost:8000. We use BrowserSync to display the documentation.

Documentation for previous releases

Previous releases and their documentation are available for download.

Supported Browsers:

Materialize is compatible with:

  • Chrome 35+
  • Firefox 31+
  • Safari 9+
  • Opera
  • Edge
  • IE 11+

Changelog

For changelogs, check out the Releases section of materialize or the CHANGELOG.md.

Testing

We use Jasmine as our testing framework and we're trying to write a robust test suite for our components. If you want to help, here's a starting guide on how to write tests in Jasmine.

Contributing

Check out the CONTRIBUTING document in the root of the repository to learn how you can contribute. You can also browse the help-wanted tag in our issue tracker to find things to do.

Copyright and license

Code Copyright 2018 Materialize. Code released under the MIT license.

Comments
  • Changes for v1.0.0

    Changes for v1.0.0

    v1 Updates

    1.0.0-alpha.1 is here! Check out the announcement post on Medium

    Big Changes

    • [x] Rewrite Datepicker to no longer use pickadate.js which is no longer in development
    • [x] Remove jQuery as a dependency

    Enhancements

    • [x] Refactor plugins into Classes
      • [x] Dropdown
      • [x] Select
      • [x] Tooltip
      • [x] Toast
      • [x] Modal
      • [x] Collapsible
      • [x] Carousel
      • [x] Parallax
      • [x] Pushpin
      • [x] Materialbox
      • [x] Sidenav
      • [x] Slider
      • [x] Chips
      • [x] Autocomplete
      • [x] Feature Discovery
      • [x] Timepicker
    • [x] All Plugins have
      • [x] this.el
      • [x] this.destroy()
      • [x] this.getInstance()
      • [x] upgrade guide
      • [x] update changelog
      • [x] update documentation
      • [x] In / Out transition options where applicable
    • [x] getInstance takes in nodeList as well as single elem
    • [ ] ~~Remove styling on base HTML elements (pushed to a later release)~~
    • [x] Form reworks
      • [x] Rework input field validation styling
      • [x] Rework labels to wrap Checkboxes and Radio Buttons

    Slimming Down

    • [x] Remove jQuery Easing plugin as a dependency
    • [x] Remove HammerJs as a dependency
    • [x] Remove transitions.js
    • [x] Remove scrollfire
    • [x] Remove automatic initialization for plugins
    • [x] Remove options as HTML attributes on plugins
    • [x] Unbundle Roboto from Materialize(#4798)

    Clean Up

    • [x] Remove the deprecated.userView class (#5037)
    • [ ] ~~Prefix plugin names (M_pluginname)?~~

    Meta Items

    • [x] Create 1.0.0 upgrade guide
    • [x] Drop IE 10 Support
    • [x] Drop Safari 7 + 8 Support
    • [x] Archived Documentation

    New Features

    • [ ] Youtube-like PiP
    Discussion meta 
    opened by Dogfalo 218
  • Translate docs for other languages

    Translate docs for other languages

    Well, I'm like very much Materialize and maybe is very cool if the project can be translated for other languages like mine (pt-br) and a pack for translation the docs can be closer for other peoples starting this fantastic world of development, but some not be able to read in English.

    Thanks for your attention and this project is Gorgeous!

    help-wanted Transifex 
    opened by thebergamo 127
  • Bug when used with AMD (require.js)

    Bug when used with AMD (require.js)

    the company i am working with likes material design, so i told them about materialize, and they said ok use it , no problem , but currently i am stuck with this so please help !

    when i try to require materialize , no errors are shown, but when i actually use it with jquery, it tells me that the method that i am trying to use on that element is undefined here is my code (js):

    requirejs.config({
      paths: {
        'materialize': '../../bower_components/materialize/dist/js/materialize',
        'jquery': '../../bower_components/jquery/dist/jquery'
      },
      shim: {
        'materialize': {
          deps: ['jquery']
        },
        'jquery': {
          exports: '$'
        }
      }
    });
    
    require(['jquery', 'materialize'], function($) {
      $('select').material_select();
    });
    

    Screen Shot: image

    enhancement 
    opened by max1011 96
  • Multi select with opt groups does not render checkboxes

    Multi select with opt groups does not render checkboxes

    If you create a multiple dropdown and add optgroups it does not render the checkboxes.

    <select name="children[]" multiple id="multi_select_dropdown">
        <option value="" disabled selected>Choose Routes</option>
        <optgroup label="assigned">
            <option value="3" selected>Option 2</option>
            <option value="3" selected>Option 4</option>
        </optgroup>
        <optgroup label="Unassigned">
            <option value="3" selected>Option 3</option>
            <option value="3" selected>Option 5</option>
        </optgroup>
    </select>
    
    opened by christiaanEbit 80
  • npm require misses hammerjs, then picker.js, etc ...

    npm require misses hammerjs, then picker.js, etc ...

    When I use the npm module,

    a) I cannot require it directly as referenced in my package.json file - I need to use a path to the node_modules/materialize-css/bin folder.

    b) then when I require the materialize.js file from that node_modules location, it misses hammerjs

    c) then I get hammerjs, then it is missing picker.js etc ...

    I'm not sure where I am going wrong here, but I am finding it impossible to require('materialize-css') in my browserify app ... :(

    Am I doing something wrong?

    bug 
    opened by joergd 62
  • Migrate to a flexbox grid

    Migrate to a flexbox grid

    Flexbox is the future and it's what Angular uses in angular-material (which to me is a terrible implementation). It would be great to see Materialize be the only other UI framework that uses flexbox. :-)

    opened by lee-40square 54
  • Cannot install Materialize meteor package

    Cannot install Materialize meteor package

    Description

    Installing the meteor package materialize:materialize even on an empty repo fails. I reinstalled Meteor, it didn't solve my issue.

    Repro Steps

    meteor create test To create a basic empty meteor app. meteor add materialize:materialize

    Very long error message :

     => Errors while adding packages:                                                                  
                                                                                                       
    While loading package materialize:[email protected]:                                              
    error: Command failed:                                                                             
    C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\bi
    n\npm.cmd                                                                                          
    rebuild --update-binary                                                                            
    node-pre-gyp ERR! Tried to download:                                                               
    https://fsevents-binaries.s3-us-west-2.amazonaws.com/v1.0.15/fse-v1.0.15-node-v46-win32-ia32.tar.gz
                                                                                                       
    node-pre-gyp ERR! Pre-built binaries not found for [email protected] and [email protected] (node-v46        
    ABI) (falling back to source compile with node-gyp)                                                
    Traceback (most recent call last):                                                                 
    File                                                                                               
    "C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\l
    ib\node_modules\node-gyp\gyp\gyp_main.py",                                                         
    line 16, in <module>                                                                               
    sys.exit(gyp.script_main())                                                                        
    File                                                                                               
    "C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\l
    ib\node_modules\node-gyp\gyp\pylib\gyp\__init__.py",                                               
    line 545, in script_main                                                                           
    return main(sys.argv[1:])                                                                          
    File                                                                                               
    "C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\l
    ib\node_modules\node-gyp\gyp\pylib\gyp\__init__.py",                                               
    line 538, in main                                                                                  
    return gyp_main(args)                                                                              
    File                                                                                               
    "C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\l
    ib\node_modules\node-gyp\gyp\pylib\gyp\__init__.py",                                               
    line 523, in gyp_main                                                                              
    generator.GenerateOutput(flat_list, targets, data, params)                                         
    File                                                                                               
    "C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\l
    ib\node_modules\node-gyp\gyp\pylib\gyp\generator\msvs.py",                                         
    line 2003, in GenerateOutput                                                                       
    sln_projects, project_objects, flat=msvs_version.FlatSolution())                                   
    File                                                                                               
    "C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\l
    ib\node_modules\node-gyp\gyp\pylib\gyp\generator\msvs.py",                                         
    line 1762, in _GatherSolutionFolders                                                               
    return _DictsToFolders('', root, flat)                                                             
    File                                                                                               
    "C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\l
    ib\node_modules\node-gyp\gyp\pylib\gyp\generator\msvs.py",                                         
    line 1715, in _DictsToFolders                                                                      
    for folder, contents in bucket.iteritems():                                                        
    AttributeError: 'MSVSProject' object has no attribute 'iteritems'                                  
    gyp ERR! configure error                                                                           
    gyp ERR! stack Error: `gyp` failed with exit code: 1                                               
    gyp ERR! stack     at ChildProcess.onCpExit                                                        
    (C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\l
    ib\node_modules\node-gyp\lib\configure.js:305:16)                                                  
    gyp ERR! stack     at emitTwo (events.js:87:13)                                                    
    gyp ERR! stack     at ChildProcess.emit (events.js:172:7)                                          
    gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:211:12)       
    gyp ERR! System Windows_NT 10.0.14393                                                              
    gyp ERR! command                                                                                   
    "C:\\Users\\Ilan\\AppData\\Local\\.meteor\\packages\\meteor-tool\\1.4.2_3\\mt-os.windows.x86_32\\de
    v_bundle\\bin\\node.exe"                                                                           
    "C:\\Users\\Ilan\\AppData\\Local\\.meteor\\packages\\meteor-tool\\1.4.2_3\\mt-os.windows.x86_32\\de
    v_bundle\\lib\\node_modules\\node-gyp\\bin\\node-gyp.js"                                           
    "configure" "--fallback-to-build"                                                                  
    "--module=C:\\Users\\Ilan\\AppData\\Local\\.meteor\\packages\\materialize_materialize\\0.98.0\\npm\
    \node_modules\\.temp-1jdosff\\node_modules\\fsevents\\lib\\binding\\Release\\node-v46-win32-ia32\\f
    se.node"                                                                                           
    "--module_name=fse"                                                                                
    "--module_path=C:\\Users\\Ilan\\AppData\\Local\\.meteor\\packages\\materialize_materialize\\0.98.0\
    \npm\\node_modules\\.temp-1jdosff\\node_modules\\fsevents\\lib\\binding\\Release\\node-v46-win32-ia
    32"                                                                                                
    gyp ERR! cwd                                                                                       
    C:\Users\Ilan\AppData\Local\.meteor\packages\materialize_materialize\0.98.0\npm\node_modules\.temp-
    1jdosff\node_modules\fsevents                                                                      
    gyp ERR! node -v v4.6.2                                                                            
    gyp ERR! node-gyp -v v3.4.0                                                                        
    gyp ERR! not ok                                                                                    
    node-pre-gyp ERR! build error                                                                      
    node-pre-gyp ERR! stack Error: Failed to execute                                                   
    'C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\b
    in\node.exe                                                                                        
    C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\li
    b\node_modules\node-gyp\bin\node-gyp.js                                                            
    configure --fallback-to-build                                                                      
    --module=C:\Users\Ilan\AppData\Local\.meteor\packages\materialize_materialize\0.98.0\npm\node_modul
    es\.temp-1jdosff\node_modules\fsevents\lib\binding\Release\node-v46-win32-ia32\fse.node            
    --module_name=fse                                                                                  
    --module_path=C:\Users\Ilan\AppData\Local\.meteor\packages\materialize_materialize\0.98.0\npm\node_
    modules\.temp-1jdosff\node_modules\fsevents\lib\binding\Release\node-v46-win32-ia32'               
    (1)                                                                                                
    node-pre-gyp ERR! stack     at ChildProcess.<anonymous>                                            
    (C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\l
    ib\node_modules\node-pre-gyp\lib\util\compile.js:83:29)                                            
    node-pre-gyp ERR! stack     at emitTwo (events.js:87:13)                                           
    node-pre-gyp ERR! stack     at ChildProcess.emit (events.js:172:7)                                 
    node-pre-gyp ERR! stack     at maybeClose (internal/child_process.js:854:16)                       
    node-pre-gyp ERR! stack     at Process.ChildProcess._handle.onexit                                 
    (internal/child_process.js:222:5)                                                                  
    node-pre-gyp ERR! System Windows_NT 10.0.14393                                                     
    node-pre-gyp ERR! command                                                                          
    "C:\\Users\\Ilan\\AppData\\Local\\.meteor\\packages\\meteor-tool\\1.4.2_3\\mt-os.windows.x86_32\\de
    v_bundle\\bin\\node.exe"                                                                           
    "C:\\Users\\Ilan\\AppData\\Local\\.meteor\\packages\\meteor-tool\\1.4.2_3\\mt-os.windows.x86_32\\de
    v_bundle\\lib\\node_modules\\node-pre-gyp\\bin\\node-pre-gyp"                                      
    "install" "--fallback-to-build"                                                                    
    node-pre-gyp ERR! cwd                                                                              
    C:\Users\Ilan\AppData\Local\.meteor\packages\materialize_materialize\0.98.0\npm\node_modules\.temp-
    1jdosff\node_modules\fsevents                                                                      
    node-pre-gyp ERR! node -v v4.6.2                                                                   
    node-pre-gyp ERR! node-pre-gyp -v v0.6.30                                                          
    node-pre-gyp ERR! not ok                                                                           
                                                                                                       
    npm ERR! Windows_NT 10.0.14393                                                                     
    npm ERR! argv                                                                                      
    "C:\\Users\\Ilan\\AppData\\Local\\.meteor\\packages\\meteor-tool\\1.4.2_3\\mt-os.windows.x86_32\\de
    v_bundle\\bin\\node.exe"                                                                           
    "C:\\Users\\Ilan\\AppData\\Local\\.meteor\\packages\\meteor-tool\\1.4.2_3\\mt-os.windows.x86_32\\de
    v_bundle\\lib\\node_modules\\npm\\bin\\npm-cli.js"                                                 
    "rebuild" "--update-binary"                                                                        
    npm ERR! node v4.6.2                                                                               
    npm ERR! npm  v3.10.9                                                                              
    npm ERR! code ELIFECYCLE                                                                           
    npm ERR! [email protected] install: `node-pre-gyp install --fallback-to-build`                       
    npm ERR! Exit status 1                                                                             
    npm ERR!                                                                                           
    npm ERR! Failed at the [email protected] install script 'node-pre-gyp install                        
    --fallback-to-build'.                                                                              
    npm ERR! Make sure you have the latest version of node.js and npm installed.                       
    npm ERR! If you do, this is most likely a problem with the fsevents package,                       
    npm ERR! not with npm itself.                                                                      
    npm ERR! Tell the author that this fails on your system:                                           
    npm ERR!     node-pre-gyp install --fallback-to-build                                              
    npm ERR! You can get information on how to open an issue for this project with:                    
    npm ERR!     npm bugs fsevents                                                                     
    npm ERR! Or if that isn't available, you can get their info via:                                   
    npm ERR!     npm owner ls fsevents                                                                 
    npm ERR! There is likely additional logging output above.                                          
                                                                                                       
    npm ERR! Please include the following file with any support request:                               
    npm ERR!                                                                                           
    C:\Users\Ilan\AppData\Local\.meteor\packages\materialize_materialize\0.98.0\npm\node_modules\.temp-
    1jdosff\npm-debug.log                                                                              
    node-pre-gyp ERR! Tried to download:                                                               
    https://fsevents-binaries.s3-us-west-2.amazonaws.com/v1.0.15/fse-v1.0.15-node-v46-win32-ia32.tar.gz
                                                                                                       
    node-pre-gyp ERR! Pre-built binaries not found for [email protected] and [email protected] (node-v46        
    ABI) (falling back to source compile with node-gyp)                                                
    Traceback (most recent call last):                                                                 
    File                                                                                               
    "C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\l
    ib\node_modules\node-gyp\gyp\gyp_main.py",                                                         
    line 16, in <module>                                                                               
    sys.exit(gyp.script_main())                                                                        
    File                                                                                               
    "C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\l
    ib\node_modules\node-gyp\gyp\pylib\gyp\__init__.py",                                               
    line 545, in script_main                                                                           
    return main(sys.argv[1:])                                                                          
    File                                                                                               
    "C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\l
    ib\node_modules\node-gyp\gyp\pylib\gyp\__init__.py",                                               
    line 538, in main                                                                                  
    return gyp_main(args)                                                                              
    File                                                                                               
    "C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\l
    ib\node_modules\node-gyp\gyp\pylib\gyp\__init__.py",                                               
    line 523, in gyp_main                                                                              
    generator.GenerateOutput(flat_list, targets, data, params)                                         
    File                                                                                               
    "C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\l
    ib\node_modules\node-gyp\gyp\pylib\gyp\generator\msvs.py",                                         
    line 2003, in GenerateOutput                                                                       
    sln_projects, project_objects, flat=msvs_version.FlatSolution())                                   
    File                                                                                               
    "C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\l
    ib\node_modules\node-gyp\gyp\pylib\gyp\generator\msvs.py",                                         
    line 1762, in _GatherSolutionFolders                                                               
    return _DictsToFolders('', root, flat)                                                             
    File                                                                                               
    "C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\l
    ib\node_modules\node-gyp\gyp\pylib\gyp\generator\msvs.py",                                         
    line 1715, in _DictsToFolders                                                                      
    for folder, contents in bucket.iteritems():                                                        
    AttributeError: 'MSVSProject' object has no attribute 'iteritems'                                  
    gyp ERR! configure error                                                                           
    gyp ERR! stack Error: `gyp` failed with exit code: 1                                               
    gyp ERR! stack     at ChildProcess.onCpExit                                                        
    (C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\l
    ib\node_modules\node-gyp\lib\configure.js:305:16)                                                  
    gyp ERR! stack     at emitTwo (events.js:87:13)                                                    
    gyp ERR! stack     at ChildProcess.emit (events.js:172:7)                                          
    gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:211:12)       
    gyp ERR! System Windows_NT 10.0.14393                                                              
    gyp ERR! command                                                                                   
    "C:\\Users\\Ilan\\AppData\\Local\\.meteor\\packages\\meteor-tool\\1.4.2_3\\mt-os.windows.x86_32\\de
    v_bundle\\bin\\node.exe"                                                                           
    "C:\\Users\\Ilan\\AppData\\Local\\.meteor\\packages\\meteor-tool\\1.4.2_3\\mt-os.windows.x86_32\\de
    v_bundle\\lib\\node_modules\\node-gyp\\bin\\node-gyp.js"                                           
    "configure" "--fallback-to-build"                                                                  
    "--module=C:\\Users\\Ilan\\AppData\\Local\\.meteor\\packages\\materialize_materialize\\0.98.0\\npm\
    \node_modules\\.temp-1jdosff\\node_modules\\fsevents\\lib\\binding\\Release\\node-v46-win32-ia32\\f
    se.node"                                                                                           
    "--module_name=fse"                                                                                
    "--module_path=C:\\Users\\Ilan\\AppData\\Local\\.meteor\\packages\\materialize_materialize\\0.98.0\
    \npm\\node_modules\\.temp-1jdosff\\node_modules\\fsevents\\lib\\binding\\Release\\node-v46-win32-ia
    32"                                                                                                
    gyp ERR! cwd                                                                                       
    C:\Users\Ilan\AppData\Local\.meteor\packages\materialize_materialize\0.98.0\npm\node_modules\.temp-
    1jdosff\node_modules\fsevents                                                                      
    gyp ERR! node -v v4.6.2                                                                            
    gyp ERR! node-gyp -v v3.4.0                                                                        
    gyp ERR! not ok                                                                                    
    node-pre-gyp ERR! build error                                                                      
    node-pre-gyp ERR! stack Error: Failed to execute                                                   
    'C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\b
    in\node.exe                                                                                        
    C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\li
    b\node_modules\node-gyp\bin\node-gyp.js                                                            
    configure --fallback-to-build                                                                      
    --module=C:\Users\Ilan\AppData\Local\.meteor\packages\materialize_materialize\0.98.0\npm\node_modul
    es\.temp-1jdosff\node_modules\fsevents\lib\binding\Release\node-v46-win32-ia32\fse.node            
    --module_name=fse                                                                                  
    --module_path=C:\Users\Ilan\AppData\Local\.meteor\packages\materialize_materialize\0.98.0\npm\node_
    modules\.temp-1jdosff\node_modules\fsevents\lib\binding\Release\node-v46-win32-ia32'               
    (1)                                                                                                
    node-pre-gyp ERR! stack     at ChildProcess.<anonymous>                                            
    (C:\Users\Ilan\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\l
    ib\node_modules\node-pre-gyp\lib\util\compile.js:83:29)                                            
    node-pre-gyp ERR! stack     at emitTwo (events.js:87:13)                                           
    node-pre-gyp ERR! stack     at ChildProcess.emit (events.js:172:7)                                 
    node-pre-gyp ERR! stack     at maybeClose (internal/child_process.js:854:16)                       
    node-pre-gyp ERR! stack     at Process.ChildProcess._handle.onexit                                 
    (internal/child_process.js:222:5)                                                                  
    node-pre-gyp ERR! System Windows_NT 10.0.14393                                                     
    node-pre-gyp ERR! command                                                                          
    "C:\\Users\\Ilan\\AppData\\Local\\.meteor\\packages\\meteor-tool\\1.4.2_3\\mt-os.windows.x86_32\\de
    v_bundle\\bin\\node.exe"                                                                           
    "C:\\Users\\Ilan\\AppData\\Local\\.meteor\\packages\\meteor-tool\\1.4.2_3\\mt-os.windows.x86_32\\de
    v_bundle\\lib\\node_modules\\node-pre-gyp\\bin\\node-pre-gyp"                                      
    "install" "--fallback-to-build"                                                                    
    node-pre-gyp ERR! cwd                                                                              
    C:\Users\Ilan\AppData\Local\.meteor\packages\materialize_materialize\0.98.0\npm\node_modules\.temp-
    1jdosff\node_modules\fsevents                                                                      
    node-pre-gyp ERR! node -v v4.6.2                                                                   
    node-pre-gyp ERR! node-pre-gyp -v v0.6.30                                                          
    node-pre-gyp ERR! not ok                                                                           
                                                                                                       
    npm ERR! Windows_NT 10.0.14393                                                                     
    npm ERR! argv                                                                                      
    "C:\\Users\\Ilan\\AppData\\Local\\.meteor\\packages\\meteor-tool\\1.4.2_3\\mt-os.windows.x86_32\\de
    v_bundle\\bin\\node.exe"                                                                           
    "C:\\Users\\Ilan\\AppData\\Local\\.meteor\\packages\\meteor-tool\\1.4.2_3\\mt-os.windows.x86_32\\de
    v_bundle\\lib\\node_modules\\npm\\bin\\npm-cli.js"                                                 
    "rebuild" "--update-binary"                                                                        
    npm ERR! node v4.6.2                                                                               
    npm ERR! npm  v3.10.9                                                                              
    npm ERR! code ELIFECYCLE                                                                           
    npm ERR! [email protected] install: `node-pre-gyp install --fallback-to-build`                       
    npm ERR! Exit status 1                                                                             
    npm ERR!                                                                                           
    npm ERR! Failed at the [email protected] install script 'node-pre-gyp install                        
    --fallback-to-build'.                                                                              
    npm ERR! Make sure you have the latest version of node.js and npm installed.                       
    npm ERR! If you do, this is most likely a problem with the fsevents package,                       
    npm ERR! not with npm itself.                                                                      
    npm ERR! Tell the author that this fails on your system:                                           
    npm ERR!     node-pre-gyp install --fallback-to-build                                              
    npm ERR! You can get information on how to open an issue for this project with:                    
    npm ERR!     npm bugs fsevents                                                                     
    npm ERR! Or if that isn't available, you can get their info via:                                   
    npm ERR!     npm owner ls fsevents                                                                 
    npm ERR! There is likely additional logging output above.                                          
                                                                                                       
    npm ERR! Please include the following file with any support request:                               
    npm ERR!                                                                                           
    C:\Users\Ilan\AppData\Local\.meteor\packages\materialize_materialize\0.98.0\npm\node_modules\.temp-
    1jdosff\npm-debug.log
    
    has-fix 
    opened by ilan-schemoul 49
  • Meteor: Failed to decode downloaded font

    Meteor: Failed to decode downloaded font

    I am getting the following warnings: Failed to decode downloaded font: http://localhost:3000/packages/materialize_materialize/dist/font/roboto/Roboto-Regular.woff2 (index):1 OTS parsing error: invalid version tag (index):1 Failed to decode downloaded font: http://localhost:3000/packages/materialize_materialize/dist/font/roboto/Roboto-Regular.woff (index):1 OTS parsing error: invalid version tag (index):1 Failed to decode downloaded font: http://localhost:3000/packages/materialize_materialize/dist/font/roboto/Roboto-Regular.ttf (index):1 OTS parsing error: invalid version tag

    These are the packages I have installed in the project:

    accounts-password 1.1.3* Password support for accounts aldeed:autoform 5.7.1 Easily create forms with automatic in... aldeed:collection2 2.5.0 Automatic validation of insert and up... autopublish 1.0.4 (For prototyping only) Publish the en... blaze-html-templates 1.0.1 Compile HTML templates into reactive ... cfs:gridfs 0.0.33 GridFS storage adapter for CollectionFS cfs:s3 0.1.3 Amazon Web Services S3 storage adapte... cfs:standard-packages 0.5.9 Filesystem for Meteor, collectionFS check 1.0.6* Check whether a value matches a pattern ecmascript 0.1.5* Compiler plugin that supports ES2015+... ejson 1.0.7 Extended and Extensible JSON library email 1.0.7* Send email messages fortawesome:fontawesome 4.4.0 Font Awesome (official): 500+ scalabl... fourseven:scss 3.3.3_3 Style with attitude. Sass and SCSS ... insecure 1.0.4 (For prototyping only) Allow all data... iron:router 1.0.12 Routing specifically designed for Me... jquery 1.11.4 Manipulate the DOM using CSS selectors limemakers:three 0.71.0+ Three.js core library + several usef... logging 1.0.8 Logging facility. materialize:materialize 0.97.2+ Materialize (official): A modern res... meteor-base 1.0.1 Packages that every Meteor app needs meteortoys:allthings 2.1.3 Insanely Handy Development Tools for ... mobile-experience 1.0.1 Packages for a great mobile user expe... mongo 1.1.2* Adaptor for using MongoDB and Minimon... polguixe:meteor-datgui 0.5.1_4 meteor-datgui is a wrapper for mete... random 1.0.4* Random number generator and utilities reload 1.1.4 Reload the page while preserving appl... session 1.1.1 Session variable spacebars 1.0.7 Handlebars-like template language for... standard-minifiers 1.0.1* Standard minifiers used with Meteor a... tracker 1.0.9 Dependency tracker to allow reactive ... useraccounts:iron-routing 1.12.4 UserAccounts package providing route... useraccounts:materialize 1.12.4 Accounts Templates styled for Materi...

    Anyone experiencing the same problem?

    bug 
    opened by PolGuixe 49
  • Upgrading to 0.97.1 from 0.97.0 fails meteor app

    Upgrading to 0.97.1 from 0.97.0 fails meteor app

    Just saw and upgrade this morning you pushed, but after update my app was a bit confused :) http://prntscr.com/8g3z9p Just to let you know. Had to go back to 0.97.0. Great work otherwise with Materialize!

    opened by milanzigmond 48
  • Feature Request: SASS for Meteor.js

    Feature Request: SASS for Meteor.js

    Could you please provide an official SASS package on https://atmospherejs.com/materialize ?

    Users could then override variables by creating (for example) a file named client/materialize-override.scss and still get updates...

    You could make use of: https://atmospherejs.com/fourseven/scss

    Also check: https://atmospherejs.com/grigio/materialize-sass

    opened by boustanihani 48
  • current project status

    current project status

    Hi @Dogfalo and @acburst,

    as you can see there are many open issues and PR's and it seems @acburst is the only contributor but does not merge any PR's.

    Are there plans to add more contributors and pick up development speed?

    Because I found a few bugs and I am unsure if PR's will be merged if I provide a fix.

    opened by DanielRuf 47
  • Pulse effect to perform false trigger on the pulse wave

    Pulse effect to perform false trigger on the pulse wave

    Expected Behavior

    When clicking adjacent with a click handler to an element with pulse effect on I expect nothing to happen.

    I think the right element should be clicked when one click on the element, and for the white-space, either no click handler or the current behaviour.

    image

    Current Behavior

    The problem is coming up if there are multiple elements with pulse effect. When you click on the item the topmost (placing order or z-index) will get the click event. The pulse will even overlap to the adjacent item.

    image

    Possible Solution

    I was able to circumvent the problem by adding

    .pulse::before {
      pointer-events: none;
    }
    

    Steps to Reproduce (for bugs)

    1. Add any two buttons even as suggested in the documentation.
    2. Just leave the display: flex from the container to keep them close
    3. Try to click on the first button (when the pulse wave gets to the leftmost point from the right button)
    4. Check: is the first first button clicked?
    <div id="test">
      <a class="btn-floating pulse"><i class="material-icons">menu</i></a>
      <a class="btn-floating btn-large pulse"><i class="material-icons">cloud</i></a>
      <a class="btn-floating btn-large cyan pulse"><i class="material-icons">edit</i></a>
    </div>
    <script>
      $("#test a:nth-child(1)").click(()=>console.log("first"));
      $("#test a:nth-child(2)").click(()=>console.log("second"));
      $("#test a:nth-child(3)").click(()=>console.log("third"));
    </script>
    

    Context

    No additional context.

    Your Environment

    • Version used: 1.0.0
    • Browser Name and version: Version 108.0.5359.72 (Official Build) (64-bit)
    • Operating System and version (desktop or mobile): Windows, desktop, 11
    • Link to your project (if appropriate):
    opened by afarago 1
  • Link to New Project

    Link to New Project

    There isn't currently any indication on either GitHub or the website that this project is currently being maintained elsewhere. I'm not always the sharpest tool in the shed and I actually thought Materialize was no longer being maintained given the activity on this repo.

    It would be great to update the archived repo and website to point to the active project. If I didn't realize this, I'm sure there are others.

    opened by james-byta 1
  • Lorempixum images in documentation are broken

    Lorempixum images in documentation are broken

    Expected Behaviour

    At https://materializecss.com/carousel.html the carousel should contain images generated by lorempixel.com

    Current Behaviour

    Currently, none of the images load, as the site seems to be owned by criticalhit ("For more high authority domain names for sale, please contact [email protected]")

    Possible Solution

    Use a different site for example images in documentation (I found https://picsum.photos/)

    Steps to Reproduce (for bugs)

    1. Load https://materializecss.com/carousel.html
    2. Observe missing images in carousel
    3. Check https://lorempixel.com

    Your Environment

    • Version used: 1.0.0
    • Browser Name and version: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:106.0) Gecko/20100101 Firefox/106.0
    • Operating System and version (desktop or mobile): Microsoft Windows 21H2 (OS Build 19044.2130)
    opened by 0sleep 1
  • Calling Toast.dismissAll() a second time without any new toasts triggers error

    Calling Toast.dismissAll() a second time without any new toasts triggers error "_this29.el.parentNode is null"

    When calling Toast.dismissAll twice, an error is generated: "_this29.el.parentNode is null"

    Expected Behavior

    I expect the second call should notice that the elements have already been marked for clearing and not generate an error when the dismissal actually tries to access those previously cleared elements.

    Current Behavior

    Triggers an error when trying to clear previously cleared elements.

    Steps to Reproduce (for bugs)

    see codepen: https://codepen.io/sgalzin-the-vuer/pen/ExLBxwM?editors=0010

    1. call toast();
    2. call dismissAll twicebefore the toast has had time to expire.

    Your Environment

    Firefox and Chrome on Ubuntu

    opened by sgalzin 1
  • Remove button:focus styles from _forms.scss

    Remove button:focus styles from _forms.scss

    Proposed changes

    Remove styling global button element in _forms.scss

    button:focus {
      outline: none;
      background-color: $button-background-focus;
    }
    

    Now button styles are applied within .btn class

    Types of changes

    • [x] Bug fix (non-breaking change which fixes an issue).
    • [ ] New feature (non-breaking change which adds functionality).
    • [ ] Breaking change (fix or feature that would cause existing functionality to change).

    Checklist:

    • [x] I have read the CONTRIBUTING document.
    • [x] My change requires a change to the documentation.
    • [ ] I have updated the documentation accordingly.
    • [ ] I have added tests to cover my changes.
    • [ ] All new and existing tests passed.
    opened by DawidKK 0
  • Fix issue #6669 - Remove the css implementation from the global HTML button element

    Fix issue #6669 - Remove the css implementation from the global HTML button element

    1. The styling of the button should be in _buttons.scss not in _forms.scss .
    2. _button.scss already have a :focus state.
    3. The styling shouldn't be applied to the global HTML button element and should instead be applied to the .btn class.

    Proposed changes

    Screenshots (if appropriate) or codepen:

    Types of changes

    • [x] Bug fix (non-breaking change which fixes an issue).
    • [ ] New feature (non-breaking change which adds functionality).
    • [ ] Breaking change (fix or feature that would cause existing functionality to change).

    Checklist:

    • [x] I have read the CONTRIBUTING document.
    • [ ] My change requires a change to the documentation.
    • [ ] I have updated the documentation accordingly.
    • [x] I have added tests to cover my changes.
    • [x] All new and existing tests passed.
    opened by Nemila 0
Releases(1.0.0)
An HTML5/CSS3 framework used at SAPO for fast and efficient website design and prototyping

Welcome to Ink Ink is an interface kit for quick development of web interfaces, simple to use and expand on. It uses a combination of HTML, CSS and Ja

SAPO 1.9k Dec 15, 2022
The worlds smallest fully-responsive css framework

FLUIDITY A fully responsive css framework that is impossibly small HTML is almost 100% responsive out of the box. This stylesheet patches the remainin

murmurs 1.1k Sep 24, 2022
The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web.

Bootstrap Sleek, intuitive, and powerful front-end framework for faster and easier web development. Explore Bootstrap docs » Report bug · Request feat

Bootstrap 161.1k Jan 4, 2023
Semantic is a UI component framework based around useful principles from natural language.

Semantic UI Semantic is a UI framework designed for theming. Key Features 50+ UI elements 3000 + CSS variables 3 Levels of variable inheritance (simil

Semantic Org 50.3k Jan 3, 2023
🌟 DataFormsJS 🌟 A minimal JavaScript Framework and standalone React and Web Components for rapid development of high quality websites and single page applications.

?? Welcome to DataFormsJS! Thanks for visiting! ?? ?? ?? ?? ?? ?? 中文 (简体) 欢迎来到 DataFormsJS Español Bienvenido a DataFormsJS Português (do Brasil) Bem

DataFormsJS 156 Dec 8, 2022
HTML Framework that allows you not to write JavaScript code.

EHTML (or Extended HTML) can be described as a set of custom elements that you can put on HTML page for different purposes and use cases. The main ide

Guseyn Ismayylov 171 Dec 29, 2022
One framework. Mobile & desktop.

Angular - One framework. Mobile & desktop. Angular is a development platform for building mobile and desktop web applications using Typescript/JavaScr

Angular 85.7k Jan 4, 2023
Ember.js - A JavaScript framework for creating ambitious web applications

Ember.js is a JavaScript framework that greatly reduces the time, effort and resources needed to build any web application. It is focused on making yo

Ember.js 22.4k Jan 8, 2023
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

Supporting Vue.js Vue.js is an MIT-licensed open source project with its ongoing development made possible entirely by the support of these awesome ba

vuejs 201.7k Jan 8, 2023
The tiny framework for building hypertext applications.

Hyperapp The tiny framework for building hypertext applications. Do more with less—We have minimized the concepts you need to learn to get stuff done.

Jorge Bucaran 18.9k Jan 4, 2023
A framework for building native apps with React.

React Native Learn once, write anywhere: Build mobile apps with React. Getting Started · Learn the Basics · Showcase · Contribute · Community · Suppor

Facebook 106.8k Jan 3, 2023
The Backbone Framework

Marionette.js The Backbone Framework Marionette v5 Marionette is dropping its dependency on Backbone. That library is available here: https://github.c

Marionette.js 7.1k Jan 5, 2023
MVC framework making it easy to write realtime, collaborative applications that run in both Node.js and browsers

Derby The Derby MVC framework makes it easy to write realtime, collaborative applications that run in both Node.js and browsers. Derby includes a powe

DerbyJS 4.7k Dec 31, 2022
A JavaScript Framework for Building Brilliant Applications

mithril.js What is Mithril? Installation Documentation Getting Help Contributing What is Mithril? A modern client-side JavaScript framework for buildi

null 13.5k Dec 26, 2022
Better MV-ish Framework

❗ I started working on this project in 2012. React didn't exist, Angular didn't have a stable 1.0 release, Internet Explorer 7, 8, 9 was used by 35% o

Antonio Stoilkov 2.8k Jan 1, 2023
A framework for real-time applications and REST APIs with JavaScript and TypeScript

A framework for real-time applications and REST APIs with JavaScript and TypeScript Feathers is a lightweight web-framework for creating real-time app

Feathers 14.2k Dec 28, 2022
A rugged, minimal framework for composing JavaScript behavior in your markup.

Alpine.js Alpine.js offers you the reactive and declarative nature of big frameworks like Vue or React at a much lower cost. You get to keep your DOM,

Alpine.js 22.5k Dec 30, 2022
A no-dependency, intuitive web framework from scratch in Javascript

Poseidon ?? Intro Poseidon is, to use a nice description by Reef, an anti-framework. It's a a no-dependency, component-based Javascript framework for

Amir Bolous 45 Nov 14, 2022
An open-source, self-hosted, low-code framework to build internal tools, web apps, admin panels, BI dashboards, workflows, and CRUD apps with YAML or JSON.

An open-source, self-hosted, low-code framework to build internal tools, web apps, admin panels, BI dashboards, workflows, and CRUD apps with YAML or JSON.

Lowdefy 2k Jan 4, 2023