diff --git a/docs/src/app/components/pages/components/lists.jsx b/docs/src/app/components/pages/components/lists.jsx
index cd34a0d5e65b2f..a468fb11091a2a 100644
--- a/docs/src/app/components/pages/components/lists.jsx
+++ b/docs/src/app/components/pages/components/lists.jsx
@@ -406,6 +406,21 @@ class ListsPage extends React.Component {
Messages
+
+
+ }>
+ Notifications
+
+ }>
+ Sounds
+
+ }>
+ Video sounds
+
+
diff --git a/src/lists/list-item.jsx b/src/lists/list-item.jsx
index d039cb06d99c57..b8693f32dc5e24 100644
--- a/src/lists/list-item.jsx
+++ b/src/lists/list-item.jsx
@@ -127,7 +127,11 @@ var ListItem = React.createClass({
},
leftCheckbox: {
- left: 4
+ position: 'absolute',
+ display: 'block',
+ width: 24,
+ top: twoLine ? 24 : singleAvatar ? 16 : 12,
+ left: 16
},
rightToggle: {
@@ -170,7 +174,7 @@ var ListItem = React.createClass({
this._pushElement(contentChildren, rightIcon, this.mergeStyles(styles.icons, styles.rightIcon));
this._pushElement(contentChildren, leftAvatar, this.mergeStyles(styles.avatars, styles.leftAvatar));
this._pushElement(contentChildren, rightAvatar, this.mergeStyles(styles.avatars, styles.rightAvatar));
- this._pushElement(contentChildren, leftCheckbox, this.mergeStyles(styles.icons, styles.leftCheckbox));
+ this._pushElement(contentChildren, leftCheckbox, this.mergeStyles(styles.leftCheckbox));
this._pushElement(contentChildren, rightToggle, this.mergeStyles(styles.rightToggle));
if (this.props.children) contentChildren.push(this.props.children);