Afterburner - Portfolio Page

by Alexander

HTML

<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.1.0/css/font-awesome.min.css">
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/ladda-bootstrap/0.1.0/ladda-themeless.min.css">
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.2.0/css/bootstrap.css">
<script src="http://cdnjs.cloudflare.com/ajax/libs/ladda-bootstrap/0.1.0/spin.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/ladda-bootstrap/0.1.0/ladda.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.2.0/js/bootstrap.min.js"></script>
<div class="container-fluid">
    <!-- Nav tabs -->
    <ul class="nav nav-tabs" role="tablist">
        <li class="right-align-tab active">
            <a href="#profile" role="tab" data-toggle="tab">Contacts</a>
        </li>
        <li class="right-align-tab">
            <a href="#home" role="tab" data-toggle="tab">Overview</a>
        </li>
    </ul>
    
    <!-- Tab panes -->
    <div class="tab-content">
        <div class="tab-pane fade" id="home">
            <button class="btn btn-primary btn-sm pull-right" data-toggle="modal" data-target="#newPropertyModal">
                <i class="fa fa-plus fa-lg fa-fw"></i>
                New Property
            </button>
            <h3>Properties</h3>
            <table id="propertiesTable" class="table table-hover table-condensed">
                <thead>
                    <tr>
                        <th class="text-right col-xs-1">ID</th>
                        <th class="col-xs-3">Status <span class="caret"></span></th>
                        <th>Name</th>
                        <th class="col-xs-3">City</th>
                        <th class="col-xs-1"><span class="sr-only">Delete</span></th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td class="text-right">
                            <a...

CSS

.nav-tabs .right-align-tab {
    float: right;
    margin-left:10px;
    margin-right:0;
}

.form-group.required .control-label:after {
    content: " *";
    color: red;
}

#propertiesTable { margin-bottom: 0; }
#propertyCount { margin-top: 0; }

.block-update-card {
  height: 100%;
  border: 1px #FFFFFF solid;
  /*width: 380px;*/
  float: left;
  margin-left: 10px;
  margin-top: 0;
  padding: 0;
  box-shadow: 1px 1px 8px #d8d8d8;
  background-color: #FFFFFF;
}

JavaScript

$('[data-toggle="popover"]').popover();
//$('#newPropertyModal').modal({ show: true });