0

Tenho um dashboard, no qual em um header eu chamo uma lista, após clicar num botão. Está tudo ok com retorno e ordenação, meu problema é no quesito do layout, gostaria que tivesse mantido somente sobrepondo com um card o restante da página, assim como nesse exemplo da imagem : Retorno desejado

Mas, toda vez que minha lista é exibida, ela desce o conteudo, ficando como se fossem dois cards, conforme a segunnda imagem: Como está hoje

Trecho do código:

 <nb-card-header>
        Dashboard - Campanhas

        <nb-icon status="info" *ngIf="revealed.campanhas" class="toggle-icon" icon="chevron-up-outline" pack="eva"
          (click)="toggleView('campanhas')"></nb-icon>
        <nb-icon status="info" *ngIf="!revealed.campanhas" class="toggle-icon" icon="hard-drive-outline" pack="eva"
          nbTooltip="Listagem de Campanhas" (click)="toggleView('campanhas')"> </nb-icon>
      </nb-card-header>
      <div *ngIf="revealed.campanhas">
            <table class="tabela">

              <nb-list>
                <nb-list-item *ngFor="let i of campanhasPerfil" (click)="atualizarFiltro(i)">

                  <div>
                    {{i.nome_campanha}}
                    [{{i.codigo_campanha}}] <br>
                    De {{i.data_inicio_campanha | moment: 'DD/MM/YYYY'}}
                    Até {{i.data_fim_campanha | moment: 'DD/MM/YYYY'}}
                  </div>
                </nb-list-item>
              </nb-list>
            </table>
      </div>

Gostaria também que tivesse essa barra de rolagem ao lado.

É algo parecido com o que se tem aqui no site da Stack Overflow. Quando se clica no ícone de "Últimas mensagens no inbox".

2
  • Cara a lista tem que ser carregada dentro de um container que tenho uma altura máxima, tipo max-height:300px, e nesse container vc coloca overflow-y:auto; Se quiser faço um exemplo, mas ele não usaria o seu código, seria apenas uma exemplo didático para vc entender a técnica.
    – hugocsl
    Commented 4/10/2019 às 11:23
  • @hugocsl Tudo bem. Eu usei a referência do código pra pelo menos deixar claro a dúvida. Usei o list dessa forma pra que exibisse na tela. Se seu exemplo tiver a possibilidade de eu usar essas interpolações para renderizar no HTML, tudo bem. Commented 4/10/2019 às 12:11

0

Você deve fazer log-in para responder a esta pergunta.

Pesquise outras perguntas com a tag .