Bulma CSS модальный не отображается - PullRequest
Новая
       61

Bulma CSS модальный не отображается

0 голосов
/ 26 апреля 2020

Я использую Bulma в качестве CSS фреймворка, и, пытаясь использовать их модалы, они вообще не стилизуются, как будто я что-то упускаю.

enter image description here

Оверлей есть, и кнопка x кажется на месте и видимой, но содержимое отображается серым цветом.

Я использую этот код: 

<body>

<div id="modal-id" class="modal is-active">
    <div class="modal-background"></div>
    <div class="modal-content">
        Any other Bulma elements you want
    </div>
    <button class="modal-close is-large" aria-label="close"></button>
</div>

</body>

Все остальные элементы Bulma работают.

Примечание: я не спрашиваю о JS части и о том, как на самом деле показывать модальные при нажатии. У меня чистые CSS проблемы.

1 Ответ

1 голос
/ 26 апреля 2020

Но это в настоящее время показывается, и нет проблем!

, если вы хотите дизайн, например карту, измените .modal-content div на: 

  <div class="modal-card">
    <header class="modal-card-head">
      <p class="modal-card-title">Modal title</p>
      <button class="delete" aria-label="close"></button>
    </header>
    <section class="modal-card-body">
      YOUR CONTENT
    </section>
    <footer class="modal-card-foot">
      <button class="button is-success">Save changes</button>
      <button class="button">Cancel</button>
    </footer>
  </div>
...