designmodo test karim

by karimkhan

HTML

<link rel="stylesheet" href="http://getbootstrap.com/dist/css/bootstrap.css">
<div class="well">Welcome ...!
    <br>Get you timeline info ...</div>
<div class="c1">
    <div class="row demo-row">
        <div class="col-xs-3"> <a href="#fakelink" class="btn btn-block btn-lg btn-primary">Mention this month</a>

        </div>
        <div class="col-xs-3"> <a href="#fakelink" class="btn btn-block btn-lg btn-danger">Mention previous month</a>

        </div>
        <div class="col-xs-3"> <a href="#fakelink" class="btn btn-block btn-lg btn-success">Retweet this month</a>

        </div>
        <div class="col-xs-3"> <a href="#fakelink" class="btn btn-block btn-lg btn-info">Retweet previous month</a>

        </div>
    </div>
</div>
<!-- /row -->
<table class="table table-condensed">
    <thead>
        <tr>
            <th>Total</th>
            <th>Mention reach</th>
            <th>Retweet reach</th>
            <th>Count of mention</th>
            <th>Count of retwet</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td></td>
            <td>45</td>
            <td>35</td>
            <td>534</td>
            <td>6343</td>
        </tr>
    </tbody>
</table>
<div class="row demo-row">
    <div class="col-xs-6">
         <h3> Twitter time line </h3>
    </div>
    <div class="col-xs-3 right"> <a href="#fakelink" class="btn btn-block btn-xs btn-primary ">Export </a>
    </div>
    </div>
    <table class="table table-condensed">
        <thead>
            <tr class="active">
                <td class="active">Results</td>
                <td class="success">Date</td>
                <td class="warning">Time</td>
                <td class="danger">Twitter user</td>
                <td class="info">Reach</td>
                <td class="active">Contant</td>
                <td class="active">Tweet</td>
            </tr>
        </thead>
        <tbody>
            <tr class="active">
                <td class="active">1</td>
               ...

CSS

.c1 {
    margin-top :10%;
}
h3{
    margin-top:0px !important;
}

.right
{
    float: right;
}