0

<ol>ナンバリングと投票ランキングにタグを使用する、HackerNews に似たニュース記事を表示します。Kaminari gem を使用してページ分割しようとすると<li>、各記事の番号がすべてのページで 1 ～ 20 にリセットされます。

CSS の counter-reset と counter-increment を使用してみましたが、まだ動作しません。また、各ページにカウンター リセットを手動で追加しようとしましたが、サイトに何らかの理由で 5 ページを超えるページが表示される場合は、インクリメントを手動でエンコードする必要がありますが、これは不可能です。

jsソリューションがあるかどうか疑問に思っています。

これが私のstories_controllerの index メソッドです:

def index
    if params[:sort] && params[:sort].to_sym == :newest
      @stories = Story.order("created_at DESC").page(params[:page]).per(20)
    else
      @stories = Story.order('karma DESC').page(params[:page]).per(20)
    end
end

ここに私のストーリーindex.html.hamlがあります:

%ol
  - @stories.each do |story|
    = render partial: 'story', locals: { story: story, tag_type: :li }
= paginate @stories

そして、上記の部分的な_story.html.haml :

= content_tag defined?(tag_type) ? tag_type : :div, class: 'story' do
  = link_to "⇧", upvote_story_url(story), class: 'upvote', method: :post
  %div
    .title
      = link_to story.title.titlecase, story.url
      %span.link-domain (#{story.url_domain})
    .metadata
      = statusline story
      |
      = link_to 'comments', story, class: 'comments-link'
      = "(#{story.comments.all.count})"

そして最後に、関連する CSS:

ul, ol {
    margin: 0 1.5em 1.5em 0;
    padding-left: 2.0em;
    counter-reset: section;
    li {
      margin: 10px;
    }
  }

  li {
    float: top;
    counter-increment: section;
  }

ヘルプや新しいアイデアをお寄せいただきありがとうございます。

編集：

順序付きリスト タグを削除し、箇条書きを削除するために list-style-type を none に設定した順序なしリストに切り替えることで、これを修正しました。

haml ビューで使用したコードは次のとおりです。

- if params[:page].nil? || params[:page] == "0" || params[:page] == "1"
    - x = 0
  - else
    - page = params[:page].to_i - 1
    - x = page * 15

  - @stories.each_with_index do |story, index|
    = content_tag defined?(tag_type) ? tag_type : :div, class: 'story' do
      %li
        .title
          .story_number
            = index + x + 1
          = etc...
4

1 に答える 1

0

上記の編集で問題を修正しました..

于 2013-01-20T08:00:52.527 に答える