CSS стиль флеш сообщения - PullRequest
5 голосов
/ 04 марта 2011

Что я должен использовать, чтобы стилизовать мои флеш-сообщения в моем CSS? Я не могу изменить его стиль. Вот соответствующий код в <body> макета моего приложения:

    <div class="container">
      <%= render 'layouts/header' %>
      <section class="round">
        <div id= "notice">
          <% flash.each do |key, value| %>
            <div class="flash <%= key %>">
              <%= value %>
            </div>
          <% end %>
        </div>
        <%= yield %>
      </section>
      <%= render 'layouts/footer' %>
      <%= debug(params) if Rails.env.development? %>
    </div>

Соответствующий оригинальный CSS был примерно таким, но в настоящее время он не работает.

.error, .alert, .notice, .success, .info {padding:0.8em;margin-bottom:1em;border:2px solid #ddd;}
.success {background:#e6efc2;color:#264409;border-color:#c6d880;}

Ответы [ 3 ]

2 голосов
/ 04 марта 2011

Либо добавьте правило для родительского div с уведомлением об идентификаторе:

#notice {
  css_formatting_here
}

Или добавьте правило для дочерних div:

.flash {
  css_formatting_here
}

В дочернем контейнере div ошибок есть несколько классов, разделенныхпробелами.flash является одним из них.Таким образом, вы можете добавить правило CSS для этого класса, и оно будет работать.

Здесь вы найдете другие примеры: Скрытые возможности CSS

0 голосов
/ 03 апреля 2016

В вашем css-файле:

.alert-success {
    dosomestyling;
}

.alert-danger {
    dosomestyling;
}
0 голосов
/ 04 марта 2011

Похоже, вызовы CSS для класса .notice, но вместо этого у div есть идентификатор.

EDIT

CSS не отвечает на флэш или <% = key%> классов, но это отвечая на идентификатор уведомления. К сожалению, если я буду стиль с Обратите внимание, некоторые стили, которые появляются должно зависеть от того, есть ли это флеш сообщение или нет. Как я могу исправить это

Вы можете добавить условный тест в div:

<% unless flash.empty? %>
  <div id="notice">
    <% flash.each do |key, value| %>
      <div class="flash <%= key %>">
        <%= value %>
      </div>
    <% end %>
  </div>
<% end %>
...