0

Tenho uma janela modal que exibe um Spinner para indicar o carregamento de uma page. O problema é essa modal precisa ficar sem as bordas e com fundo transparente. Alguém sabe como me ajudar?

inserir a descrição da imagem aqui

<div id="modalSpinner" class="modal">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <div class="loader vertical-align-middle loader-circle"></div>
        </div>
    </div>
</div>

1 Resposta 1

2

Pode retirar alterando as propriedades da classe .modal-content:

#modalSpinner .modal-content{
   -webkit-box-shadow: none; // retira a sombra
   box-shadow: none; // retira a sombra
   background: transparent; // fundo transparente
   border: none; //  retira a borda
}

Isso irá alterar apenas a modal da div#modalSpinner, sem afetar as outas modais, se houverem.

Se seu CSS for carregado antes do CSS do Bootstrap, haverá necessidade de colocar !important nas propriedades:

#modalSpinner .modal-content{
   -webkit-box-shadow: none !important; // retira a sombra
   box-shadow: none !important; // retira a sombra
   background: transparent !important; // fundo transparente
   border: none !important; //  retira a borda
}

Pelo que pude perceber pela imagem, a modal nem tem borda, apenas o fundo branco e um sombreamento. Talvez não haja necessidade das linhas box-shadow.

1
  • muito, muito, muito obrigado cara!!!!!!!!!!! Funcionou 100%
    – Master JR
    6/01/2019 às 21:19

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 .