diff --git a/components/list/index.cjsx b/components/list/index.cjsx
index 70badf9b..0566f07e 100644
--- a/components/list/index.cjsx
+++ b/components/list/index.cjsx
@@ -1,4 +1,4 @@
-require './style'
+localCSS = require './style'
module.exports = React.createClass
@@ -11,9 +11,10 @@ module.exports = React.createClass
type : React.PropTypes.string
getDefaultProps: ->
- attributes : ""
+ attributes : ''
+ className : ''
dataSource : []
- type : "default"
+ type : 'default'
# -- Events
onClick: (event, item) ->
@@ -21,7 +22,10 @@ module.exports = React.createClass
# -- Render
render: ->
-
+ className = "#{localCSS.root} #{@props.className}"
+ className += " #{@props.type}" if @props.type
+
+
{
for item, index in @props.dataSource
-
diff --git a/components/list/style.styl b/components/list/style.styl
index 715d9ae7..f879d94a 100644
--- a/components/list/style.styl
+++ b/components/list/style.styl
@@ -1,6 +1,6 @@
-@import "../constants.styl"
+@import '../constants'
-[data-component-list]
+:local(.root)
list-style : none
&, a
color : TEXT
@@ -8,9 +8,8 @@
overflow : hidden
background-color : WHITE
box-shadow : ZDEPTH_SHADOW_1
- transition-property box-shadow
- transition-duration ANIMATION_DURATION
- transition-timing-function ANIMATION_EASE
- // -- Classes
+ transition-property : box-shadow
+ transition-duration : ANIMATION_DURATION
+ transition-timing-function : ANIMATION_EASE
&:hover
box-shadow : ZDEPTH_SHADOW_2