diff --git a/components/link/index.cjsx b/components/link/index.cjsx index a0cb7749..19a3c52b 100644 --- a/components/link/index.cjsx +++ b/components/link/index.cjsx @@ -1,5 +1,5 @@ -require './style' -FontIcon = require "../font_icon" +localCSS = require './style' +FontIcon = require '../font_icon' module.exports = React.createClass @@ -13,7 +13,8 @@ module.exports = React.createClass route : React.PropTypes.array getDefaultProps: -> - attributes : "" + attributes : '' + className : '' # -- Events onClick: (event) -> @@ -21,12 +22,10 @@ module.exports = React.createClass # -- Render render: -> - - { if @props.icon } + className = "#{localCSS.root} #{@props.className}" + + { if @props.icon } { {@props.caption} if @props.caption } { {@props.count} if @props.count and parseInt(@props.count) isnt 0} diff --git a/components/link/style.styl b/components/link/style.styl index cc4bff00..cc798ce6 100644 --- a/components/link/style.styl +++ b/components/link/style.styl @@ -1,9 +1,13 @@ -@import "../constants.styl" +@import '../constants' -[data-component-link] +:local(.icon) + margin-right : (SPACE / 2) + font-size : FONT_SIZE_BIG + +:local(.root) position : relative overflow : hidden - transition opacity ANIMATION_DURATION ANIMATION_EASE + transition : opacity ANIMATION_DURATION ANIMATION_EASE // -- Styles &:not(.active) font-weight : FONT_WEIGHT_THIN @@ -15,9 +19,6 @@ // -- Children > * vertical-align : middle - > .icon - margin-right : (SPACE / 2) - font-size : FONT_SIZE_BIG > abbr text-transform : Capitalize > small