Bootstrap List group in Foundation 5

问题

I am trying to figure out how to get the equivalent of Bootstrap's list groups, with the list group item borders and all, using Foundation 5.

However, there doesn't seem to be anything that similar.

The only thing that I have found is ul/li's suggested on Foundations' site. http://foundation.zurb.com/docs/components/typography.html

Any ideas?

Update: I want to list comments/comment-comments with this list group in Foundation. Here it is using Bootstrap.

<div class='list-group-item'>
  <div class='list-group-item-text'>
    <h4 class='list-group-item-heading'>
      <%= comment.user.email %>
      <%= time_ago_in_words comment.created_at %> ago
    </h4>
    <%= simple_format comment.body %>
    <div class='list-group'>
      <%= render comment.comments %>
    </div>
  </div>
</div>

回答1:

Basically i do not found any reason why you can not compile Bootstrap's list groups CSS in your Foundation CSS.

So for instance run bower install bootstrap-sass in your project's directory and then use the following code in your app.scss:

@import "settings";
@import "foundation";
// Bootstrap
@import "../bower_components/bootstrap-sass/assets/stylesheets/bootstrap/variables";
@import "../bower_components/bootstrap-sass/assets/stylesheets/bootstrap/mixins";
@import "../bower_components/bootstrap-sass/assets/stylesheets/bootstrap/list-group";
.list-group {
max-width: 400px;
}

来源：https://stackoverflow.com/questions/29506372/bootstrap-list-group-in-foundation-5