<div class="col-md-12" ng-controller="destaquesController" ng-init="carregarDestaques()" style="padding:3px;">

    <div class="col-xs-12 col-md-4" style="padding:3px">
        <div class="table-responsive margem">
            <table class="table" style="margin:0">
                <tr>
                    <th>Destaques</th>
                    <th></th>
                    <th style="text-align:right">
                        <button popover-placement="top"
                                popover-trigger="mouseenter"
                                data-popover="Remover"
                                ng-click="confirmarRemover(selectedDestaque)"
                                ng-disabled=""
                                type="button"
                                class="btn btn-warning btn-sm">
                            <span class="glyphicon glyphicon-remove"></span>
                        </button>
                        <button popover-placement="top"
                                popover-trigger="mouseenter"
                                data-popover="Adicionar"
                                ng-click="novoDestaque()"
                                ng-disabled=""
                                type="button"
                                class="btn btn-primary btn-sm">
                            <span class="glyphicon glyphicon-plus"></span>
                        </button>

                    </th>
                </tr>
            </table>
            <div style="border:1px solid #EEE; overflow:auto; height:392px">
                <table class="table table-hover table-striped">

                    <tr ng-repeat="des in lstDestaques" class="apontar" ng-class="{info:des.Id==selectedDestaque.Id}">
                        <td class="apontar" ng-click="selDestaque(des)">{{des.Titulo}}</td>
                        <td style="text-align:right;width:30px"><span class="glyphicon glyphicon-eye-open"></span></td>
                        <td style="text-align:right;width:30px">
                            <input type="checkbox" ng-model="des.Mostrar" />
                        </td>
                    </tr>
                </table>
            </div>
        </div>

    </div>

    <div class="col-xs-12 col-md-8" style="padding:3px">
        <input type="text" class="form-control" ng-model="selectedDestaque.Titulo" />
        <br />
        <div class="col-md-12" id="editableDiv" contenteditable="true" ng-model="selectedDestaque.Conteudo">
            <!--{{selectedDestaque.Conteudo}}-->
        </div>

        <div class="col-md-12" style="text-align:right; margin-top:10px; padding-bottom:5px; padding-right:0">
            
            <div class="btn-group" role="group" aria-label="..." style="margin-bottom:5px">
                <!--<button class="btn btn-default btn-md" onclick="document.execCommand('justifyLeft', false, null);">
                    <i class="fa fa-align-left"></i>
                </button>
                <button class="btn btn-default btn-md" onclick="document.execCommand('justifyCenter', false, null);">
                    <i class="fa fa-align-center"></i>
                </button>
                <button class="btn btn-default btn-md" onclick="document.execCommand('justifyRight', false, null);">
                    <i class="fa fa-align-right"></i>
                </button>
                <button class="btn btn-default btn-md" onclick="document.execCommand('justifyFull', false, null);">
                    <i class="fa fa-align-justify"></i>
                </button>-->
                <button class="btn btn-default btn-md" onclick="document.execCommand('bold', false, null);">
                    <i class="fa fa-bold"></i>
                </button>
                <button class="btn btn-default btn-md" onclick="document.execCommand('italic', false, null);">
                    <i class="fa fa-italic"></i>
                </button>
                <button class="btn btn-default btn-md" onclick="document.execCommand('underline', false, null);">
                    <i class="fa fa-underline"></i>
                </button>
            </div>
            
            <button type="button" class="btn btn-success btn-md" style="margin-bottom:5px"
                    ng-click="atualizarDestaque(selectedDestaque); dadosModificados(false)"
                    ng-disabled="">
                <span class="glyphicon glyphicon-ok"></span> Guardar Destaque
            </button>
        </div>

    </div>


</div>