settings.tpl

        <article class="row">
            <div class="col-xs-12 wow animated zoomIn" data-wow-duration=".6s" data-wow-delay="0s">
                <div class="panel panel-primary settings">
                    <div class="panel-heading">
                        <h5 class="small">
                            <i class="fa fa-cog"></i> Moje konto
                            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                                <i class="fa fa-bars"></i>
                            </button>
                        </h5>
                    </div>
                    <div class="panel-body">
                        <div class="tab-content">
                            <div class="navbar" role="navigation">
                                <div class="collapse navbar-collapse">
                                    <ul class="nav navbar-inverse nav-pills" role="tablist">
                                        <li>
                                            <a href="#aplication" class="fa-left" role="tab" data-toggle="tab">
                                                <i class="fa fa-briefcase"></i> Dane personalne
                                            </a>
                                        </li>
                                        <li class="active">
                                            <a href="#book" class="fa-left" role="tab" data-toggle="tab">
                                                <i class="fa fa-users"></i> Książka adresowa
                                            </a>
                                        </li>
                                        <li>
                                            <a href="#invoice" class="fa-left"  ole="tab" data-toggle="tab">
                                                <i class="fa fa-clipboard"></i> Faktury <span class="badge">2</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="#notice" class="fa-left" role="tab" data-toggle="tab">
                                                <i class="fa fa-bullhorn"></i> Powiadomienia <span class="badge">8</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="#codes" class="fa-left" role="tab" data-toggle="tab">
                                                <i class="fa fa-barcode"></i> Kody promocyjne
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="tab-content">
                                <div id="aplication" class="tab-pane fade">
                                    <div class="panel panel-danger">
                                        <div class="panel-body">
                                            <h3><i class="fa fa-briefcase"></i> Dane personalne</h3>
                                            <form class="form-horizontal" role="form">
                                                <hr>
                                                <div class="col-sm-12 col-md-4">
                                                    <div class="panel panel-default">
                                                        <div class="panel-heading">
                                                            <h5>Informacje podstawowe</h5>
                                                        </div>
                                                        <div class="panel-body">
                                                            <div class="form-group">
                                                                <label class="col-sm-4 control-label">Rodzaj konta</label>
                                                                <div class="col-sm-8">
                                                                    <label class="checkbox-inline">
                                                                        <input type="radio" name="account_type" value="1"> Firma
                                                                    </label>
                                                                    <label class="checkbox-inline">
                                                                        <input type="radio" name="account_type" value="0" checked> Osoba prywatna
                                                                    </label>
                                                                </div>
                                                            </div>
                                                            <div class="form-group">
                                                                <label class="col-sm-4 control-label">Imię</label>
                                                                <div class="col-sm-8">
                                                                    <input type="text" class="form-control">
                                                                </div>
                                                            </div>
                                                            <div class="form-group">
                                                                <label class="col-sm-4 control-label">Nazwisko</label>
                                                                <div class="col-sm-8">
                                                                    <input type="text" class="form-control">
                                                                </div>
                                                            </div>
                                                            <div id="firma" style="display:none">
                                                                <div class="form-group">
                                                                    <label class="col-sm-4 control-label">Nazwa firmy</label>
                                                                    <div class="col-sm-8">
                                                                        <input type="text" class="form-control">
                                                                    </div>
                                                                </div>
                                                                <div class="form-group">
                                                                    <label class="col-sm-4 control-label">NIP</label>
                                                                    <div class="col-sm-8">
                                                                        <input type="text" class="form-control">
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-sm-12 col-md-4">
                                                    <div class="panel panel-default">
                                                        <div class="panel-heading">
                                                            <h5>Dane kontaktowe</h5>
                                                        </div>
                                                        <div class="panel-body">
                                                            <div class="form-group">
                                                                <label class="col-sm-4 control-label">E-mail</label>
                                                                <div class="col-sm-8">
                                                                    <input type="text" class="form-control">
                                                                </div>
                                                            </div>
                                                            <div class="form-group">
                                                                <label class="col-sm-4 control-label">Telefon</label>
                                                                <div class="col-sm-8">
                                                                    <input type="text" class="form-control">
                                                                </div>
                                                            </div>
                                                            <hr>
                                                            <div class="form-group">
                                                                <label class="col-sm-4 control-label">Kraj</label>
                                                                <div class="col-sm-8">
                                                                    <select class="form-control">
                                                                        <option>wybierz...</option>
                                                                        <option>Anglia</option>
                                                                        <option>Niemcy</option>
                                                                        <option>Polska</option>
                                                                        <option>Zimbabe</option>
                                                                    </select>
                                                                </div>
                                                            </div>
                                                            <div class="form-group">
                                                                <label class="col-sm-4 control-label">Miasto</label>
                                                                <div class="col-sm-8">
                                                                    <div class="row">
                                                                        <div class="col-xs-8">
                                                                            <input type="text" class="form-control">
                                                                        </div>
                                                                        <div class="col-xs-4">
                                                                            <input type="text" class="form-control" placeholder="00-000">
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <div class="form-group">
                                                                <label class="col-sm-4 control-label">Ulica</label>
                                                                <div class="col-sm-8">
                                                                    <input type="text" class="form-control">
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-sm-12 col-md-4">
                                                    <div class="panel panel-default">
                                                        <div class="panel-heading">
                                                            <h5>Bezpieczeństwo</h5>
                                                        </div>
                                                        <div class="panel-body">
                                                            <div class="form-group">
                                                                <label class="col-sm-4 control-label">Nowe hasło</label>
                                                                <div class="col-sm-8">
                                                                    <input type="text" class="form-control">
                                                                </div>
                                                            </div>
                                                            <div class="form-group">
                                                                <label class="col-sm-4 control-label">Powtórz hasło</label>
                                                                <div class="col-sm-8">
                                                                    <input type="text" class="form-control">
                                                                </div>
                                                            </div>
                                                            <div class="form-group">
                                                                <div class="col-sm-offset-4 col-sm-8">
                                                                    <label>
                                                                        <input type="checkbox" name="privacy_type" value="1" checked>
                                                                        Wyrażam zgodę na otrzymywanie wiadomości o promocjach i nowościach.
                                                                    </label>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="clearfix"></div>
                                                <hr>
                                                <div class="col-sm-12">
                                                    <center>
                                                        <button type="submit" class="btn btn-primary">
                                                            <i class="fa fa-floppy-o"></i> Zapisz
                                                        </button>
                                                    </center>
                                                </div>
                                            </form>
                                        </div>
                                    </div>
                                </div>
                                <div id="book" class="tab-pane fade in active">
                                    <div class="panel panel-danger">
                                        <div class="panel-body">
                                            <h3><i class="fa fa-users"></i> Książka adresowa</h3>
                                            <hr>
                                            <div id="find-row">
                                                <div class="col-xs-6">
                                                    <div class="pull-left">
                                                        <button type="submit" class="btn btn-primary fa-right">
                                                            Dodaj nowego <i class="fa fa-plus"></i>
                                                        </button>
                                                    </div>
                                                </div>
                                                <div class="col-xs-6">
                                                    <div class="form-group pull-right">
                                                        <div class="input-group">
                                                            <div class="input-group-addon"><i class="fa fa-search"></i></div>
                                                            <input type="text" class="form-control" placeholder="Szukaj...">
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <table class="data-table table-full table-hover">
                                                <thead>
                                                    <tr>
                                                        <th class="name">Dane personalne</th>
                                                        <th class="hidden-xs">Adres</th>
                                                        <th class="action" width="150">Akcje</th>
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                    <tr>
                                                        <td class="name">Amrest Sp. z o.o.</td>
                                                        <td class="hidden-xs">Paczka <span>1,0 kg (20 x 10 x 10cm)</span></td>
                                                        <td class="action">
                                                            <ul class="action pull-right">
                                                                <li><a href="#" class="btn label label-primary" title="Jako nadawca"><i class="fa fa-sign-in"></i></a></li>
                                                                <li><a href="#" class="btn label label-success" title="Jako odbiorca"><i class="fa fa-sign-out"></i></a></li>
                                                                <li><a href="#" class="btn label label-info" title="Edytuj"><i class="fa fa-pencil"></i></a></li>
                                                                <li><a href="#" class="btn label label-danger" title="Usuń"><i class="fa fa-trash-o"></i></a></li>
                                                            </ul>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="name">Emporium Sp. z o.o.</td>
                                                        <td class="hidden-xs">Paczka <span>8,0 kg (20 x 10 x 10cm)</span></td>
                                                        <td class="action">
                                                            <ul class="action pull-right">
                                                                <li><a href="#" class="btn label label-primary" title="Jako nadawca"><i class="fa fa-sign-in"></i></a></li>
                                                                <li><a href="#" class="btn label label-success" title="Jako odbiorca"><i class="fa fa-sign-out"></i></a></li>
                                                                <li><a href="#" class="btn label label-info" title="Edytuj"><i class="fa fa-pencil"></i></a></li>
                                                                <li><a href="#" class="btn label label-danger" title="Usuń"><i class="fa fa-trash-o"></i></a></li>
                                                            </ul>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="name">Tomasz Załucki</td>
                                                        <td class="hidden-xs">Paczka <span>30,0 kg (20 x 10 x 10cm)</span></td>
                                                        <td class="action">
                                                            <ul class="action pull-right">
                                                                <li><a href="#" class="btn label label-primary" title="Jako nadawca"><i class="fa fa-sign-in"></i></a></li>
                                                                <li><a href="#" class="btn label label-success" title="Jako odbiorca"><i class="fa fa-sign-out"></i></a></li>
                                                                <li><a href="#" class="btn label label-info" title="Edytuj"><i class="fa fa-pencil"></i></a></li>
                                                                <li><a href="#" class="btn label label-danger" title="Usuń"><i class="fa fa-trash-o"></i></a></li>
                                                            </ul>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="name">Karolina Szałek</td>
                                                        <td class="hidden-xs">Paczka <span>,5 kg (20 x 10 x 10cm)</span></td>
                                                        <td class="action">
                                                            <ul class="action pull-right">
                                                                <li><a href="#" class="btn label label-primary" title="Jako nadawca"><i class="fa fa-sign-in"></i></a></li>
                                                                <li><a href="#" class="btn label label-success" title="Jako odbiorca"><i class="fa fa-sign-out"></i></a></li>
                                                                <li><a href="#" class="btn label label-info" title="Edytuj"><i class="fa fa-pencil"></i></a></li>
                                                                <li><a href="#" class="btn label label-danger" title="Usuń"><i class="fa fa-trash-o"></i></a></li>
                                                            </ul>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td class="name">Wojciech Mycka</td>
                                                        <td class="hidden-xs">Paczka <span>,8 kg (20 x 10 x 10cm)</span></td>
                                                        <td class="action">
                                                            <ul class="action pull-right">
                                                                <li><a href="#" class="btn label label-primary" title="Jako nadawca"><i class="fa fa-sign-in"></i></a></li>
                                                                <li><a href="#" class="btn label label-success" title="Jako odbiorca"><i class="fa fa-sign-out"></i></a></li>
                                                                <li><a href="#" class="btn label label-info" title="Edytuj"><i class="fa fa-pencil"></i></a></li>
                                                                <li><a href="#" class="btn label label-danger" title="Usuń"><i class="fa fa-trash-o"></i></a></li>
                                                            </ul>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                            <hr>
                                        </div>
                                    </div>
                                </div>
                                <div id="invoice" class="tab-pane fade">
                                    <div class="panel panel-danger">
                                        <div class="panel-body">
                                            <h3><i class="fa fa-clipboard"></i> Faktury</h3>
                                            <hr>
                                            ...
                                            <hr>
                                            <div class="col-sm-12">
                                                <center>
                                                    <button type="submit" class="btn btn-primary">
                                                        <i class="fa fa-floppy-o"></i> Zapisz
                                                    </button>
                                                </center>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div id="notice" class="tab-pane fade">
                                    <div class="panel panel-danger">
                                        <div class="panel-body">
                                            <h3><i class="fa fa-bullhorn"></i> Powiadomienia</h3>
                                            <hr>
                                            ...
                                            <hr>
                                            <div class="col-sm-12">
                                                <center>
                                                    <button type="submit" class="btn btn-primary">
                                                        <i class="fa fa-floppy-o"></i> Zapisz
                                                    </button>
                                                </center>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div id="codes" class="tab-pane fade">
                                    <div class="panel panel-danger">
                                        <div class="panel-body">
                                            <h3><i class="fa fa-barcode"></i> Kody promocyjne</h3>
                                            <hr>
                                            ...
                                            <hr>
                                            <div class="col-sm-12">
                                                <center>
                                                    <button type="submit" class="btn btn-primary">
                                                        <i class="fa fa-floppy-o"></i> Zapisz
                                                    </button>
                                                </center>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="clearfix"></div>
                        </div>
                    </div>
                </div>
            </div>
        </article>