<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <br> <div class="container" ng-if="existenDatos"> <div class="row"> <div class="col-md-4"> <div class="frame frame-left"> <div class="panel panel-default panel-alt widget-messaging panel-1"> <div class="panel-body"> <ul> <li ng-repeat="empresa in resultadoBusqueda track by $index"> <div ng-click="buscarInformacionEmpresa(empresa.id)"> <h5 class="sender" ng-bind="(empresa.nit | defaultEmpty) + ' - ' + (empresa.digitoVerificacion | defaultEmpty)">Nit 123456789</h5> <h5 class="sender" ng-bind="empresa.nombreComercial">Nombre comercial</h5> </div> </li> </ul> </div> </div> </div> </div> <div class="col-md-8"> <div class="frame frame-right"> <div class="row vdivide"> <div class="col col-lg-5 col-sm-6 col-xs-12 text-center"> <div class="panel panel-default panel-alt widget-messaging"> <div class="panel-body"> <ul> <li> <h5 class="sender">Empresa</h5> <h4 ng-bind="filtroBusqueda.filtro.razonSocial">NOMBRE DE EMPRESA</h5> </li> <li> <h5 class="sender">Tipo de Empresa</h5> <h4 ng-bind="filtroBusqueda.filtro.tipoEmpresa">Tipo de Empresa</h4> </li> <li> <h5 class="sender">Responsable del Proyecto</h5> <h4 ng-bind="filtroBusqueda.filtro.nombreCompleto">Responsable del Proyecto</h4> </li> <li> <h5 class="sender">No. empleados</h5> <h4 ng-bind="filtroBusqueda.filtro.numeroEmpleados">No. empleados</h4> </li> <li> <h5 class="sender">Ciudad</h5> <h4 ng-bind="filtroBusqueda.filtro.ciudad">Ciudad</h4> </li> </ul> </div><!-- panel-body --> </div> </div> <div class="col col-lg-5 col-sm-6 col-xs-12 text-center"> <div class="panel panel-default panel-alt widget-messaging"> <div class="panel-body"> <ul> <li> <h5 class="sender">Nit</h5> <h4 ng-bind="filtroBusqueda.filtro.nit">123.456.123-2</h4> </li> <li> <h5 class="sender">Estado</h5> <h4 ng-bind="filtroBusqueda.filtro.estado">Estado</h4> </li> <li> <h5 class="sender">Comercial Asignado</h5> <h4 ng-bind="filtroBusqueda.filtro.nombreComercial">Comercial</h4> </li> <li> <h5 class="sender">Fuente</h5> <h4 ng-bind="filtroBusqueda.filtro.fuente">Fuente</h4> </li> </ul> </div><!-- panel-body --> </div> </div> </div> <!--buttons--> <div class="btn-float"> <button type="button" class="btn btn-default btn-circle"><i class="glyphicon glyphicon-stats"></i></button> <button type="button" class="btn btn-default btn-circle"><i class="glyphicon glyphicon-pencil"></i></button> <button type="button" class="btn btn-default btn-circle"><i class="glyphicon glyphicon-trash"></i></button> </div> <!--fin buttons --> </div> </div> </div> </div>

li{ text-align: left; } .widget-messaging ul{ list-style: none; padding: 0; margin: 0; } .widget-messaging .panel-body{ padding: 0; } .widget-messaging ul li:first-child{ border-top: 0; } .widget-messaging ul li{ padding: 15px; padding-bottom: 5px; padding-top: 5px; margin:5px; border-top: 0px solid #eee !important; border-bottom: 0px solid #eee !important; background-color: #fff; } .row.vdivide [class*='col-']:not(:last-child):after { background: #e0e0e0; width: 1px; content: ""; display:block; position: absolute; top:0; bottom: 0; right: 0; min-height: 70px; } .panel-default { border-color: transparent; } .panel { margin-bottom: 20px; background-color: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px; border-width: 0px; border-style: solid; border-color: transparent; border-image: initial; border-radius: 4px; } .frame{ border-width: 1px; border-style: solid; border-color: #ddd; width: auto; } .frame-right{ margin-left:-13px; -webkit-border-top-right-radius: 10px; -webkit-border-bottom-right-radius: 10px; -moz-border-radius-topright: 10px; -moz-border-radius-bottomright: 10px; border-top-left-radius: 0px; border-bottom-left-radius: 0px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; } .frame-left{ margin-right:-13px; -webkit-border-top-left-radius: 10px; -webkit-border-bottom-left-radius: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-bottomleft: 10px; border-top-left-radius: 10px; border-bottom-left-radius: 10px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; } .panel-body ul li:hover{ background-color:#008ECF; color: #FFF; cursor: pointer; } .btn-circle { width: 30px; height: 30px; text-align: center; padding: 6px 0; font-size: 12px; line-height: 1.428571429; border-radius: 15px; } .btn-circle.btn-lg { width: 50px; height: 50px; padding: 10px 16px; font-size: 18px; line-height: 1.33; border-radius: 25px; } .btn-circle.btn-xl { width: 70px; height: 70px; padding: 10px 16px; font-size: 24px; line-height: 1.33; border-radius: 35px; } .btn-float{ position: fixed; right: 37px; bottom:21px; } @media (max-width: 992px) { .frame-right{ margin-left:0px; } .frame-left{ margin-left:0px; } }