https://github.com/jordic/preact-sidenav

preact sidenav component
https://github.com/jordic/preact-sidenav

layout material preact sidenav

Last synced: 2 months ago
JSON representation

preact sidenav component

• Host: GitHub
• URL: https://github.com/jordic/preact-sidenav
• Owner: jordic
• License: mit
• Created: 2017-02-06T17:02:28.000Z (almost 8 years ago)
• Default Branch: master
• Last Pushed: 2018-03-26T04:19:34.000Z (almost 7 years ago)
• Last Synced: 2024-11-01T09:11:54.260Z (2 months ago)
• Topics: layout, material, preact, sidenav
• Language: CSS
• Size: 59.6 KB
• Stars: 12
• Watchers: 3
• Forks: 0
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# preact-sidenav

Minimal viable sidenav implementation.

> **[Demo](https://jsfiddle.net/jordic/sqj852y4/)**

Size:

| File | Size | Gzip |

|------|------|----- |

| js   | 2,1K | 902B |

| css  | 2,3K | 626B |

### Usage Example

Use  and provide content and a navigation var 

```js

import Sidenav from 'preact-sidenav';

import 'node_modules/preact-sidenav/dist/sidenav.css';

const Nav = (props) => (

  


    


      
Menu item 1

      
Menu item 2

      
Menu item 3

      
Close

    


  

)


class App extends Component {

  onOpen = () => console.log('open');

  onClose = () => console.log('close');

  render(props, state) {

		return (

      


         } onOpen={this.onOpen} onClose={this.onClose}>

          

        

      

    );

  }

}


render(, document.body);

```

Scss file is also provided

### License

[MIT]

[MIT]: http://choosealicense.com/licenses/mit/