X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=tpl%2Fdefault%2Flinklist.paging.html;h=aa637868eb94e2a91cb9e8a5af22011cb6bbc77f;hb=5b5d22a3df1ba948d39524b997ea4c82ee70e646;hp=86019c01ee2a5cb4ddd2a9f8b50b59c694b00e2c;hpb=9977c418d6d0de9e22e4ec276e7d476e184b5d01;p=github%2Fshaarli%2FShaarli.git

diff --git a/tpl/default/linklist.paging.html b/tpl/default/linklist.paging.html
index 86019c01..aa637868 100644
--- a/tpl/default/linklist.paging.html
+++ b/tpl/default/linklist.paging.html
@@ -1,32 +1,74 @@
-<div class="paging">
-{if="isLoggedIn()"}
-    <div class="paging_privatelinks">
-        <a href="?privateonly">
-		{if="$privateonly"}
-		<img src="images/private_16x16_active.png#" width="16" height="16" title="Click to see all links" alt="Click to see all links">
-		{else}
-		<img src="images/private_16x16.png#" width="16" height="16" title="Click to see only private links" alt="Click to see only private links">
-		{/if}
-		</a>
+<div class="linklist-paging">
+  <div class="paging pure-g">
+    <div class="linklist-filters pure-u-1-3">
+      <span class="linklist-filters-text pure-u-0 pure-u-lg-visible">
+        {'Filters'|t}
+      </span>
+      {if="$is_logged_in"}
+      <a href="{$base_path}/admin/visibility/private" aria-label="{'Only display private links'|t}" title="{'Only display private links'|t}"
+         class="{if="$visibility==='private'"}filter-on{else}filter-off{/if}"
+      ><i class="fa fa-user-secret" aria-hidden="true"></i></a>
+      <a href="{$base_path}/admin/visibility/public" aria-label="{'Only display public links'|t}" title="{'Only display public links'|t}"
+         class="{if="$visibility==='public'"}filter-on{else}filter-off{/if}"
+      ><i class="fa fa-globe" aria-hidden="true"></i></a>
+      {/if}
+      <a href="{$base_path}/untagged-only" aria-label="{'Filter untagged links'|t}" title="{'Filter untagged links'|t}"
+         class={if="$untaggedonly"}"filter-on"{else}"filter-off"{/if}
+      ><i class="fa fa-tag" aria-hidden="true"></i></a>
+      {if="$is_logged_in"}
+      <a href="#" aria-label="{'Select all'|t}" title="{'Select all'|t}"
+         class="filter-off select-all-button pure-u-0 pure-u-lg-visible"
+      ><i class="fa fa-check-square-o" aria-hidden="true"></i></a>
+      {/if}
+      <a href="#" class="filter-off fold-all pure-u-lg-0" aria-label="{'Fold all'|t}" title="{'Fold all'|t}">
+        <i class="fa fa-chevron-up" aria-hidden="true"></i>
+      </a>
+      {if="!empty($action_plugin)"}
+        {loop="$action_plugin"}
+          {$value.attr.class=isset($value.attr.class) ? $value.attr.class : ''}
+          {$value.attr.class=!empty($value.on) ? $value.attr.class .' filter-on' : $value.attr.class .' filter-off'}
+          <a
+            {loop="$value.attr"}
+              {$key}="{$value}"
+            {/loop}>
+            {$value.html}
+          </a>
+        {/loop}
+      {/if}
+    </div>
 
 
-    </div>
-{/if}
-    {loop="$action_plugin"}
-      <div class="paging_privatelinks">
-        <a
-          {loop="$value.attr"}
-            {$key}="{$value}"
-          {/loop}>
-          {$value.html}
+    <div class="linklist-pages pure-u-1-3">
+      {if="$next_page_url"}
+        <a href="{$next_page_url}" class="paging_newer">
+          <i class="fa fa-arrow-circle-left"></i>
+        </a>
+      {/if}
+      {if="$page_max>1"}<span class="strong">{$page_current} / {$page_max}</span>{/if}
+      {if="$previous_page_url"}
+        <a href="{$previous_page_url}" class="paging_older">
+          <i class="fa fa-arrow-circle-right"></i>
         </a>
-      </div>
-    {/loop}
-    <div class="paging_linksperpage">
-        Links per page: <a href="?linksperpage=20">20</a> <a href="?linksperpage=50">50</a> <a href="?linksperpage=100">100</a>
-        <form method="GET" class="linksperpage"><input type="text" name="linksperpage" size="2"></form>
+      {/if}
+
+    </div>
+
+    <div class="linksperpage pure-u-1-3">
+      <div class="pure-u-0 pure-u-lg-visible">{'Links per page'|t}</div>
+      <a href="{$base_path}/links-per-page?nb=20"
+			{if="$links_per_page == 20"}class="selected"{/if}>20</a>
+      <a href="{$base_path}/links-per-page?nb=50"
+			{if="$links_per_page == 50"}class="selected"{/if}>50</a>
+      <a href="{$base_path}/links-per-page?nb=100"
+			{if="$links_per_page == 100"}class="selected"{/if}>100</a>
+      <form method="GET" class="pure-u-0 pure-u-lg-visible" action="{$base_path}/links-per-page">
+        <input type="text" name="nb" placeholder="133"
+			{if="$links_per_page != 20 && $links_per_page != 50 && $links_per_page != 100"}
+				value="{$links_per_page}"{/if}>
+      </form>
+      <a href="#" class="filter-off fold-all pure-u-0 pure-u-lg-visible" aria-label="{'Fold all'|t}" title="{'Fold all'|t}">
+        <i class="fa fa-chevron-up" aria-hidden="true"></i>
+      </a>
     </div>
-    {if="$previous_page_url"} <a href="{$previous_page_url}" class="paging_older">&#x25C4;Older</a> {/if}
-    <div class="paging_current">page {$page_current} / {$page_max} </div>
-    {if="$next_page_url"} <a href="{$next_page_url}" class="paging_newer">Newer&#x25BA;</a> {/if}
+  </div>
 </div>