1

tenho um input de pesquisa com um ícone em um sidebar que ao minimizar o menu, o ícone do input "sai pra fora" do menu conforme as imagens:

inserir a descrição da imagem aqui

inserir a descrição da imagem aqui

Alguém sabe como resolver? Já tentei com aria-hidden mas não funcionou.

Segue meu html:

<div class="navbar" style="padding-bottom: 0px; padding-top: 14px">

  <div class="input-group" style="margin-bottom: 6px" aria-hidden="true">

    <input class="form-control border-right-0" type="search" [(ngModel)]="searchAll" (input)="Pesquisar($event.target.value)" placeholder="Pesquisar.." aria-hidden="true">


    <span class="input-group-addon bg-white border-left-0" aria-hidden="true">
          <i class="fa fa-search">
        </i>
        </span>
    <!-- <a class="clear" (click)="searchAll = null">
            <span class="fa fa-times"></span>
        </a> -->



  </div>
</div>

.nested-menu {
  .list-group-item {
    cursor: pointer;
  }
  .nested {
    list-style-type: none;
  }
  ul.submenu {
    display: none;
    height: 0;
  }
  & .expand {
    ul.submenu {
      display: block;
      list-style-type: none;
      height: auto;
      li {
        a {
          padding: 10px;
          display: block;
        }
      }
    }
  }
}

.sidebar-nav::-webkit-scrollbar-thumb {
  background: #777777;
}

// input{
//     border:#ddd solid 1px;
//     float:left;
//     padding:5px 20px 5px 5px
//  }

2

1 Resposta 1

0

Quando o menu ganha a classe .nested-menu quando é minimizado, basta adicionar a propriedade display: none no input:

.nested-menu input{ display: none; }

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

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .