mirror of
https://github.com/plausible/analytics.git
synced 2024-12-22 00:51:36 +03:00
62 lines
4.0 KiB
Elixir
62 lines
4.0 KiB
Elixir
<div class="container pt-6">
|
|
<div class="pb-5 border-b border-gray-200 dark:border-gray-500 flex items-center justify-between">
|
|
<h2 class="text-2xl font-bold leading-7 text-gray-900 dark:text-gray-100 sm:text-3xl sm:leading-9 sm:truncate flex-shrink-0">
|
|
My sites
|
|
</h2>
|
|
<a href="/sites/new" class="button my-2 sm:my-0 w-auto">+ Add a website</a>
|
|
</div>
|
|
|
|
<ul class="my-6 grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-3">
|
|
<%= if Enum.empty?(@sites) do %>
|
|
<p class="dark:text-gray-100">You don't have any sites yet</p>
|
|
<% end %>
|
|
|
|
<%= for site <- @sites do %>
|
|
<div class="relative group">
|
|
<%= link(to: "/" <> URI.encode_www_form(site.domain)) do %>
|
|
<li class="col-span-1 bg-white dark:bg-gray-800 rounded-lg shadow p-4 group-hover:shadow-lg cursor-pointer">
|
|
<div class="w-full flex items-center justify-between space-x-4">
|
|
<img src="https://icons.duckduckgo.com/ip3/<%= site.domain %>.ico" referrerpolicy="no-referrer" onerror="this.onerror=null; this.src='https://icons.duckduckgo.com/ip3/placeholder.ico';" class="w-4 h-4 flex-shrink-0 mt-px">
|
|
<div class="flex-1 truncate -mt-px">
|
|
<h3 class="text-gray-900 font-medium text-lg truncate dark:text-gray-100"><%= site.domain %></h3>
|
|
</div>
|
|
</div>
|
|
<div class="pl-8 mt-2 flex items-center justify-between">
|
|
<span class="text-gray-600 dark:text-gray-400 text-sm truncate">
|
|
<span class="text-gray-800 dark:text-gray-200">
|
|
<b><%= PlausibleWeb.StatsView.large_number_format(Map.get(@visitors, site.domain, 0)) %></b> visitor<%= if Map.get(@visitors, site.domain, 0) != 1 do %>s<% end %> in last 24h
|
|
</span>
|
|
</span>
|
|
</div>
|
|
</li>
|
|
<% end %>
|
|
|
|
<%= link(to: "/" <> URI.encode_www_form(site.domain) <> "/settings", class: "absolute top-0 right-0 p-4 mt-1") do %>
|
|
<svg class="w-5 h-5 text-gray-600 dark:text-gray-400 opacity-100 md:opacity-0 group-hover:opacity-100 transition hover:text-gray-900 dark:hover:text-gray-100" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M11.49 3.17c-.38-1.56-2.6-1.56-2.98 0a1.532 1.532 0 01-2.286.948c-1.372-.836-2.942.734-2.106 2.106.54.886.061 2.042-.947 2.287-1.561.379-1.561 2.6 0 2.978a1.532 1.532 0 01.947 2.287c-.836 1.372.734 2.942 2.106 2.106a1.532 1.532 0 012.287.947c.379 1.561 2.6 1.561 2.978 0a1.533 1.533 0 012.287-.947c1.372.836 2.942-.734 2.106-2.106a1.533 1.533 0 01.947-2.287c1.561-.379 1.561-2.6 0-2.978a1.532 1.532 0 01-.947-2.287c.836-1.372-.734-2.942-2.106-2.106a1.532 1.532 0 01-2.287-.947zM10 13a3 3 0 100-6 3 3 0 000 6z" clip-rule="evenodd"></path></svg>
|
|
<% end %>
|
|
</div>
|
|
<% end %>
|
|
</ul>
|
|
|
|
<%= if @pagination.total_pages > 1 do %>
|
|
<%= pagination @conn, @pagination, [current_class: "is-current"], fn p -> %>
|
|
<nav class="px-4 py-3 flex items-center justify-between border-t border-gray-200 dark:border-gray-500 sm:px-6" aria-label="Pagination">
|
|
<div class="hidden sm:block">
|
|
<p class="text-sm text-gray-700 dark:text-gray-300">
|
|
Showing page
|
|
<span class="font-medium"><%= @pagination.page %></span>
|
|
of
|
|
<span class="font-medium"><%= @pagination.total_pages %></span>
|
|
total
|
|
</p>
|
|
</div>
|
|
<div class="flex-1 flex justify-between sm:justify-end">
|
|
<%= pagination_link(p, :previous, label: "← Previous", class: "pagination-link relative inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white dark:bg-gray-100 hover:bg-gray-50", force_show: true) %>
|
|
<%= pagination_link(p, :next, label: "Next →", class: "pagination-link ml-3 relative inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white dark:bg-gray-100 hover:bg-gray-50", force_show: true) %>
|
|
</div>
|
|
</nav>
|
|
<% end %>
|
|
<% end %>
|
|
|
|
</div>
|