9754d14182
* move reaction icons to base layout * fix reactions count specs?? * also fix article specs
78 lines
4 KiB
Text
78 lines
4 KiB
Text
<%= content_for :page_meta do %>
|
|
<%= render "stories/articles_search/meta" %>
|
|
<% end %>
|
|
<div id="query-wrapper"></div>
|
|
|
|
<main id="main-content">
|
|
<div id="index-container"
|
|
class="crayons-layout crayons-layout--header-inside crayons-layout--limited-l crayons-layout--2-cols"
|
|
data-params="<%= params.to_json(only: %i[tag username q]) %>" data-which="<%= @list_of %>"
|
|
data-tag=""
|
|
data-feed="<%= params[:timeframe] || "base-feed" %>"
|
|
data-articles-since="<%= Timeframe.datetime_iso8601(params[:timeframe]) %>">
|
|
<div class="crayons-page-header block s:flex">
|
|
<div class="block m:hidden mb-2" id="mobile-search-container">
|
|
<form accept-charset="UTF-8" method="get" action="/search" role="search">
|
|
<div class="crayons-fields crayons-fields--horizontal">
|
|
<div class="crayons-field flex-1 relative">
|
|
<input class="crayons-textfield" type="text" name="q" placeholder="<%= t("views.search.placeholder") %>" autocomplete="on" />
|
|
<button type="submit" aria-label="Search" class="crayons-btn crayons-btn--ghost crayons-btn--s crayons-btn--icon-rounded absolute right-2 bottom-0 top-0 m-1">
|
|
<%= crayons_icon_tag(:search, aria_hidden: true, title: t("views.search.icon.title")) %>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<h1 class="crayons-title hidden s:block">
|
|
<%= t("views.search.heading", for: (params[:q].present? ? t("views.search.for", query: params[:q]) : "")) %>
|
|
</h1>
|
|
|
|
<nav id="sorting-option-tabs" aria-label="<%= t("views.search.sort.aria_label") %>" class="-mx-3 m:mx-0">
|
|
<ul class="crayons-navigation crayons-navigation--horizontal">
|
|
<li>
|
|
<a data-text="<%= t("views.search.sort.relevance") %>" href="javascript:;" class="crayons-navigation__item <%= "crayons-navigation__item--current" if @current_ordering == :relevance %>" aria-current="page"><%= t("views.search.sort.relevance") %></a>
|
|
</li>
|
|
<li>
|
|
<a data-text="<%= t("views.search.sort.newest") %>" href="javascript:;" class="crayons-navigation__item <%= "crayons-navigation__item--current" if @current_ordering == :newest %>" data-sort-by="published_at" data-sort-direction="desc"><%= t("views.search.sort.newest") %></a>
|
|
</li>
|
|
<li>
|
|
<a data-text="<%= t("views.search.sort.oldest") %>" href="javascript:;" class="crayons-navigation__item <%= "crayons-navigation__item--current" if @current_ordering == :oldest %>" data-sort-by="published_at" data-sort-direction="asc"><%= t("views.search.sort.oldest") %></a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
|
|
<nav class="block s:hidden -mx-3 m:mx-0">
|
|
<%= render "stories/articles_search/nav_menu" %>
|
|
</nav>
|
|
</div>
|
|
|
|
<div class="crayons-layout__sidebar-left s:block hidden">
|
|
<%= render "stories/articles_search/nav_menu" %>
|
|
</div>
|
|
|
|
<div class="articles-list crayons-layout__content" id="articles-list" data-follow-button-container="true">
|
|
<div id="banner-section"></div>
|
|
<div class="substories" id="substories">
|
|
</div>
|
|
<template id="crayons-story-loading">
|
|
<div class="crayons-story" title="Loading posts...">
|
|
<div class="crayons-story__body">
|
|
<div class="crayons-story__top mb-3">
|
|
<div class="crayons-story__meta w-100">
|
|
<div class="crayons-scaffold-loading mr-2 w-0 h-0 p-4 radius-full"></div>
|
|
<div class="crayons-scaffold-loading w-25 h-0 py-2"></div>
|
|
</div>
|
|
</div>
|
|
<div class="crayons-story__indention">
|
|
<div class="crayons-scaffold-loading w-75 h-0 py-3 mb-2"></div>
|
|
<div class="crayons-scaffold-loading w-50 h-0 py-2 mb-8"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<%= javascript_packs_with_chunks_tag "searchParams", "storiesList", "followButtons", "feedPreviewCards", defer: true %>
|