-
-
Notifications
You must be signed in to change notification settings - Fork 32.5k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #576 from mmrtnz/css-styles-documentation
Updated Docs Site
- Loading branch information
Showing
39 changed files
with
1,165 additions
and
508 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,115 @@ | ||
| var React = require('react'); | ||
| var mui = require('mui'); | ||
| var ComponentDoc = require('../../component-doc.jsx'); | ||
|
|
||
| var {AppBar, DropDownMenu} = mui; | ||
|
|
||
| class AppBarPage extends React.Component { | ||
|
|
||
| constructor(props) { | ||
| super(props); | ||
|
|
||
| this.code = | ||
| '<AppBar title=\'Title\' iconClassNameRight="muidocs-icon-navigation-expand-more"/>'; | ||
|
|
||
| this.desc = 'App bars are a collection of components placed as a static ' + | ||
| 'header for an application. It is used for navigation, search ' + | ||
| 'branding, and actions. An app bar is also referred to as the ' + | ||
| 'primary toolbar or action bar for Android.'; | ||
|
|
||
| this.componentInfo = [ | ||
| { | ||
| name: 'Props', | ||
| infoArray: [ | ||
| { | ||
| name: 'iconClassNameLeft', | ||
| type: 'string', | ||
| header: 'optional', | ||
| desc: 'The classname of the icon on the left of the app bar. If you ' + | ||
| 'are using a stylesheet for your icons, enter the class name ' + | ||
| 'for the icon to be used here.' | ||
| }, | ||
| { | ||
| name: 'iconClassNameRight', | ||
| type: 'string', | ||
| header: 'optional', | ||
| desc: 'Similiar to the iconClassNameLeft prop except that is applies ' + | ||
| 'to the icon displayed on the right of the app bar.' | ||
| }, | ||
| { | ||
| name: 'iconElementLeft', | ||
| type: 'element', | ||
| header: 'optional', | ||
| desc: 'The custom element to be displayed on the left side of the ' + | ||
| 'app bar such as an SvgIcon.' | ||
| }, | ||
| { | ||
| name: 'iconElementRight', | ||
| type: 'element', | ||
| header: 'optional', | ||
| desc: 'Similiar to the iconElementLeft prop except that this element ' + | ||
| 'is displayed on the right of the app bar.' | ||
| }, | ||
| { | ||
| name: 'style', | ||
| type: 'object', | ||
| header: 'optional', | ||
| desc: 'Override the inline-styles of the app bars\'s root element.' | ||
| }, | ||
| { | ||
| name: 'showMenuIconButton', | ||
| type: 'boolean', | ||
| header: 'default: true', | ||
| desc: 'Determines whether or not to display the Menu icon next to ' + | ||
| 'the title. Setting this prop to false will hide the icon.' | ||
| }, | ||
| { | ||
| name: 'title', | ||
| type: 'string', | ||
| header: 'optional', | ||
| desc: 'A string of text that is displayed on the app bar.' | ||
| }, | ||
| { | ||
| name: 'zDepth', | ||
| type: 'number', | ||
| header: 'default: 1', | ||
| desc: 'The zDepth of the app bar. The shadow of the app bar is also ' + | ||
| 'dependent on this property.' | ||
| } | ||
| ] | ||
| }, | ||
| { | ||
| name: 'Events', | ||
| infoArray: [ | ||
| { | ||
| name: 'onLeftIconButtonTouchTap', | ||
| header: 'AppBar.onLeftIconButtonTouchTap(e)', | ||
| desc: 'Callback function for when the left icon is selected via ' + | ||
| 'a touch tap.' | ||
| }, | ||
| { | ||
| name: 'onRightIconButtonTouchTap', | ||
| header: 'AppBar.onRightIconButtonTouchTap(e)', | ||
| desc: 'Callback function for when the right icon is selected via ' + | ||
| 'a touch tap.' | ||
| } | ||
| ] | ||
| } | ||
| ]; | ||
| } | ||
|
|
||
| render() { | ||
| return ( | ||
| <ComponentDoc | ||
| name="AppBar" | ||
| code={this.code} | ||
| desc={this.desc} | ||
| componentInfo={this.componentInfo}> | ||
| <AppBar title='Title' iconClassNameRight="muidocs-icon-navigation-expand-more"/> | ||
| </ComponentDoc> | ||
| ); | ||
| } | ||
|
|
||
| } | ||
|
|
||
| module.exports = AppBarPage; |
Oops, something went wrong.