import React from 'react';


var Login = React.createClass({
    statics: {
        getDefaultData(){
            return `
                <h3>登录</h3>
                <hr />
                <div class="am-btn-group">
                    <a href="#" class="am-btn am-btn-secondary am-btn-sm"><i class="am-icon-github am-icon-sm"></i>Github</a>
                    <a href="#" class="am-btn am-btn-success am-btn-sm"><i class="am-icon-google-plus-square am-icon-sm"></i> Google+</a>
                    <a href="#" class="am-btn am-btn-primary am-btn-sm"><i class="am-icon-stack-overflow am-icon-sm"></i> stackOverflow</a>
                </div>
                <br />
                <br />

                <form method="post" class="am-form">
                    <label for="email">邮箱:</label>
                    <input type="email" name="" id="email" value=""/>
                    <br />
                    <label for="password">密码:</label>
                    <input type="password" name="" id="password" value=""/>
                    <br />
                    <label for="remember-me">
                        <input id="remember-me" type="checkbox"/>
                        记住密码
                    </label>
                    <br />
                    <div class="am-cf">
                        <input type="submit" name="" value="登 录" class="am-btn am-btn-primary am-btn-sm am-fl"/>
                        <input type="submit" name="" value="忘记密码 ^_^? " class="am-btn am-btn-default am-btn-sm am-fr"/>
                    </div>
                </form>
            `
        }
    },

    render: function () {

        var data = this.props.data || Login.getDefaultData()

        return (
            <div
                dangerouslySetInnerHTML={{__html: data}}
                className="am-u-lg-6 am-u-md-8 am-u-sm-centered">
            </div>
        )
    }
})

export default Login