#sg-alerts.showcase.shadow-1
  header.showcase-header
    h2 Alerts
    h2 警告
    p.
      Please use alerts sparingly throughout the docs.
      They are meant to draw attention on important occasions.
      Alerts should not be used for multi-line content (user callouts insteads) or stacked
      on top of each other.
    p.
      请在文档中严谨的使用警告。这意味着只在重要的场合用它吸引注意力。
      不要用警告表现多行内容(使用插图代替)，也不要把它们堆叠在一起。
  .showcase-content
    .l-sub-section
      h3 Adding an alert
      h3 添加警告

      .alert.is-critical A very <strong>critical</strong> alert
      .alert.is-critical 非常<strong>关键</strong>的警告
      .alert.is-important A very <strong>important</strong> alert
      .alert.is-important 非常<strong>重要</strong>的警告
      .alert.is-helpful A very <strong>helpful</strong> alert
      .alert.is-helpful 非常<strong>有用</strong>的警告

      pre.prettyprint.linenums
        code.
          .alert.is-critical 非常<strong>关键</strong>的警告
          .alert.is-important 非常<strong>重要</strong>的警告
          .alert.is-helpful 非常<strong>有用</strong>的警告