Update theme according personal website

This commit is contained in:
Knah Tsaeb 2024-12-19 17:14:38 +01:00
parent d7dd0ba9df
commit 65bfdb051b
11 changed files with 1271 additions and 917 deletions

View file

@ -22,7 +22,7 @@ function myShaarli_init($conf) {
$conf->set('thumbnails.mode', 'none');
return array($error);
}
if ($conf->get('resource.theme') !== 'myShaarli' and $conf->get('resource.theme') !== 'myShaarli_Columns') {
if (!in_array($conf->get('resource.theme'), ['myShaarli', 'myShaarli_Columns'])) {
$error = 'myShaarli plugin: ' .
'This plugin need modification of template. Use myShaarli theme for test.';
$conf->set('thumbnails.mode', 'none');
@ -51,7 +51,7 @@ function hook_myShaarli_render_header($data) {
'attr' => [
'href' => $conf->get('plugins.WebSite_URL'),
],
'html' => '<i class="fa fa-home" aria-hidden="true"></i> Site',
'html' => 'Site',
];
$data['buttons_toolbar'][] = $button;
}

View file

@ -5,60 +5,62 @@
</head>
<body>
{include="page.header"}
<div class="pure-g">
<div class="pure-u-lg-1-3 pure-u-1-24"></div>
<div id="addlink-form" class="page-form page-form-light pure-u-lg-1-3 pure-u-22-24">
<h2 class="window-title">{"Manage tags"|t}</h2>
<form method="POST" action="{$base_path}/admin/tags" name="changetag" id="changetag">
<div>
<input type="text" name="fromtag" aria-label="{'Tag'|t}" placeholder="{'Tag'|t}" value="{$fromtag}"
list="tagsList" autocomplete="off" class="awesomplete autofocus" data-minChars="1">
<datalist id="tagsList">
{loop="$tags"}<option>{$key}</option>{/loop}
</datalist>
</div>
<div>
<input type="text" name="totag" aria-label="{'New name'|t}" placeholder="{'New name'|t}"
list="toTagsList" autocomplete="off" class="awesomplete" data-minChars="1">
<datalist id="toTagsList">
{loop="$tags"}<option>{$key}</option>{/loop}
</datalist>
</div>
<div><i class="fa fa-info-circle" aria-hidden="true"></i> {'Case sensitive'|t}</div>
<input type="hidden" name="token" value="{$token}">
<div>
<input type="submit" value="{'Rename tag'|t}" name="renametag">
<input type="submit" value="{'Delete tag'|t}" name="deletetag"
class="button button-red confirm-delete" data-type="tag">
</div>
</form>
<section>
<div class="pure-g">
<div class="pure-u-lg-1-3 pure-u-1-24"></div>
<div id="addlink-form" class="page-form page-form-light pure-u-lg-1-3 pure-u-22-24">
<h2 class="window-title">{"Manage tags"|t}</h2>
<form method="POST" action="{$base_path}/admin/tags" name="changetag" id="changetag">
<div>
<input type="text" name="fromtag" aria-label="{'Tag'|t}" placeholder="{'Tag'|t}" value="{$fromtag}"
list="tagsList" autocomplete="off" class="awesomplete autofocus" data-minChars="1">
<datalist id="tagsList">
{loop="$tags"}<option>{$key}</option>{/loop}
</datalist>
</div>
<div>
<input type="text" name="totag" aria-label="{'New name'|t}" placeholder="{'New name'|t}"
list="toTagsList" autocomplete="off" class="awesomplete" data-minChars="1">
<datalist id="toTagsList">
{loop="$tags"}<option>{$key}</option>{/loop}
</datalist>
</div>
<div><i class="fa fa-info-circle" aria-hidden="true"></i> {'Case sensitive'|t}</div>
<input type="hidden" name="token" value="{$token}">
<div>
<input type="submit" value="{'Rename tag'|t}" name="renametag">
<input type="submit" value="{'Delete tag'|t}" name="deletetag"
class="button button-red confirm-delete" data-type="tag">
</div>
</form>
<p>{'You can also edit tags in the'|t} <a href="{$base_path}/tags/list?sort=usage">{'tag list'|t}</a>.</p>
<p>{'You can also edit tags in the'|t} <a href="{$base_path}/tags/list?sort=usage">{'tag list'|t}</a>.</p>
</div>
</div>
</div>
<div class="pure-g">
<div class="pure-u-lg-1-3 pure-u-1-24"></div>
<div class="page-form page-form-light pure-u-lg-1-3 pure-u-22-24">
<h2 class="window-title">{"Change tags separator"|t}</h2>
<form method="POST" action="{$base_path}/admin/tags/change-separator" name="changeseparator" id="changeseparator">
<p>
{'Your current tag separator is'|t} <code>{$tags_separator}</code>{if="!empty($tags_separator_desc)"} ({$tags_separator_desc}){/if}.
</p>
<div>
<input type="text" name="separator" placeholder="{'New separator'|t}"
id="separator">
</div>
<input type="hidden" name="token" value="{$token}">
<div>
<input type="submit" value="{'Save'|t}" name="saveseparator">
</div>
<p>
{'Note that hashtags won\'t fully work with a non-whitespace separator.'|t}
</p>
</form>
<div class="pure-g">
<div class="pure-u-lg-1-3 pure-u-1-24"></div>
<div class="page-form page-form-light pure-u-lg-1-3 pure-u-22-24">
<h2 class="window-title">{"Change tags separator"|t}</h2>
<form method="POST" action="{$base_path}/admin/tags/change-separator" name="changeseparator" id="changeseparator">
<p>
{'Your current tag separator is'|t} <code>{$tags_separator}</code>{if="!empty($tags_separator_desc)"} ({$tags_separator_desc}){/if}.
</p>
<div>
<input type="text" name="separator" placeholder="{'New separator'|t}"
id="separator">
</div>
<input type="hidden" name="token" value="{$token}">
<div>
<input type="submit" value="{'Save'|t}" name="saveseparator">
</div>
<p>
{'Note that hashtags won\'t fully work with a non-whitespace separator.'|t}
</p>
</form>
</div>
</div>
</div>
</section>
{include="page.footer"}
</body>
</html>

View file

@ -2,10 +2,6 @@
--background-color: #171414;
--text-color: #fffbfb;
--text-color-inverse: #171414;
.linklist-pages {
color: var(--text-color);
}
}
[data-theme="light"] {
@ -23,13 +19,27 @@
--dark-main-color: var(--primary-darken);
}
html {
scroll-behavior: smooth;
}
body {
background-color: var(--background-color);
color: var(--text-color);
width: 80vw;
margin: 0 auto;
min-height: 100vh;
min-height: 100dvh;
text-rendering: optimizeSpeed;
font-size: var(--font-size);
}
a {
transition: all .2s linear, border .2s linear;
transition: .2s linear, border .2s linear;
}
h1 {
font-size: calc(var(--font-size) * 1.6);
}
.shaarli-menu {
@ -47,8 +57,9 @@ a {
}
.subheader-form {
background-color: var(--background-color-lighten);
padding: 1.1em 0;
padding: calc(var(--default-space)*6) 0;
width: 80vw;
border: var(--default-space) solid var(--text-color);
}
.subheader-form {
@ -72,6 +83,11 @@ a {
color: var(--primary);
}
.linklist-pages a:hover,
.daily-entry .daily-entry-title a {
color: var(--primary-darken);
}
.linkcount {
color: var(--text-color);
}
@ -81,8 +97,10 @@ a {
}
.linklist-filters {
color: var(--text-color);
padding-left: .3em;
margin: unset;
color: var(--primary);
font-size: unset;
}
.linklist-filters a:hover {
@ -109,6 +127,7 @@ a {
height: auto;
font-size: 1em;
width: 4em;
color: var(--secondary-text-contrast);
}
.linklist-item.private::before {
@ -143,11 +162,13 @@ a {
.linklist-item-infos {
padding: 8px 8px 5px 8px;
grid-area: footer;
background: var(--background-secondary-color);
}
.linklist-item-title .label-private {
border: solid 1px var(--warning);
color: var(--warning);
color: var(--warning-darken);
}
.linklist-item-infos .label a {
@ -176,6 +197,7 @@ a {
.footer-container {
margin: 0;
color: var(--text-color);
margin: calc(var(--default-space) *4) 0 0 0;
}
.footer-container a {
@ -198,10 +220,6 @@ a {
grid-area: main;
}
.linklist-item-infos {
grid-area: footer;
}
.grid-container,
.linklist-item {
display: grid;
@ -215,10 +233,6 @@ a {
padding: 10px;
}
.linklist-item-title h2 {
line-height: auto;
}
.page-form select,
input[type="text"],
input[type="checkbox"] {
@ -312,7 +326,7 @@ button:hover {
}
.container {
margin-top: 55px;
margin-top: 0;
}
.header-search,
@ -331,4 +345,137 @@ button:hover {
.pure-menu-link {
display: inline-block;
}
header {
background-color: transparent;
}
header h1 img {
display: inline;
}
header h1 {
color: var(--primary);
}
header svg {
fill: var(--primary-lighten);
vertical-align: middle;
}
header a {
transition: 0.4s;
}
header h1 a {
text-decoration: none;
color: var(--primary);
text-decoration: underline transparent;
}
header a:hover {
color: var(--primary-lighten);
text-decoration: underline var(--primary);
text-decoration-thickness: var(--default-space);
}
nav {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
font-family: initial;
}
nav h1,
nav ul {
margin: 0;
}
nav h1 img {
vertical-align: middle;
}
nav ul {
display: flex;
gap: calc(var(--default-space) * 2);
flex-wrap: wrap;
padding: 0;
}
nav li {
margin: var(--default-space);
list-style: none;
font-size: calc(var(--font-size) * 1.2);
}
nav li a {
color: var(--primary-lighten);
text-decoration: underline transparent;
}
nav li a:hover,
nav .active {
text-decoration: underline var(--primary-darken);
text-decoration-thickness: var(--default-space);
}
nav .fa {
padding-right: var(--default-space);
}
.searchform-block input[type="text"]::placeholder,
.page-form input[type="text"]::placeholder {
color: var(--text-color);
}
.searchform-block input[type="text"],
.page-form input[type="text"] {
color: var(--secondary-text-contrast);
}
.paging,
.linklist-item,
.page-visitor,
#pageError,
.login-form-container,
#addlink-form,
.page-form {
background-color: var(--light-background-color);
border: 1px solid var(--background-color-darken);
border-radius: calc(var(--default-space) * 1.2);
box-shadow: var(--box-shadow-light);
}
.paging {
color: var(--primary-lighten);
margin: 0 0 calc(var(--default-space) *4) 0;
}
section .pure-g,
.pluginform-container {
margin: 0 0 calc(var(--default-space) *4) 0;
}
.linklist-item-infos-dateblock a {
color: var(--primary);
}
.linklist-item-infos-dateblock a:hover {
text-decoration: underline var(--primary-darken);
color: var(--primary-darken);
}
.pinned-link,
.linklist-item-title .label-sticky {
color: var(--info-darken) !important;
}
.linklist-item-title .label-sticky {
border: solid 1px var(--info-darken);
}

File diff suppressed because one or more lines are too long

View file

@ -51,10 +51,11 @@
</form>
{/loop}
{include="linklist.paging"}
<div id="linklist">
<div id="link-count-block" class="pure-g link-count-block">
<div class="pure-u-lg-2-24 pure-u-1-24"></div>
<div id="link-count-content" class="pure-u-lg-20-24 pure-u-22-24">
<div id="link-count-content" >
<div class="linkcount pure-u-lg-0 center">
{if="!empty($linkcount)"}
<span class="strong">{$linkcount}</span> {function="t('shaare', 'shaares', $linkcount)"}
@ -64,8 +65,6 @@
{/if}
</div>
{include="linklist.paging"}
<div id="plugin_zone_start_linklist" class="plugin_zone">
{loop="$plugin_start_zone"}
{$value}
@ -116,8 +115,7 @@
{/if}
<div id="linklist-loop-block" class="pure-g">
<div class="pure-u-lg-2-24 pure-u-1-24"></div>
<div id="linklist-loop-content" class="pure-u-lg-20-24 pure-u-22-24">
<div id="linklist-loop-content">
{ignore}Set translation here, for performances{/ignore}
{$strPrivate=t('Private')}
{$strEdit=t('Edit')}
@ -230,21 +228,22 @@
</div>
{/if}
{/if}
{if="!$hide_timestamps || $is_logged_in"}
{$updated=$value.updated_timestamp ? $strEdited. format_date($value.updated) : $strPermalink}
<span class="linkdate" title="{$updated}">
<i class="fa fa-clock-o" aria-hidden="true"></i>
{$value.created|format_date}
{if="$value.updated_timestamp"}*{/if}
&middot;
</span>
{/if}
<a href="{$base_path}/shaare/{$value.shorturl}" title="{$strPermalink}">
{if="!$hide_timestamps || $is_logged_in"}
{$updated=$value.updated_timestamp ? $strEdited. format_date($value.updated) : $strPermalink}
<span class="linkdate" title="{$updated}">
<i class="fa fa-clock-o" aria-hidden="true"></i>
{$value.created|format_date}
{if="$value.updated_timestamp"}*{/if}
&middot;
</span>
{/if}
{$strPermalinkLc}
</a>
{if="$is_logged_in && $value.private"}
<a href="{$base_path}/admin/shaare/private/{$value.shorturl}?token={$token}" title="{$strShaarePrivate}">
&middot;
<a href="{$base_path}/admin/shaare/private/{$value.shorturl}?token={$token}" title="{$strShaarePrivate}">
<i class="fa fa-share-alt"></i>
</a>
{/if}
@ -311,12 +310,7 @@
{/loop}
</div>
<div id="linklist-paging-bottom-block" class="pure-g link-count-block">
<div class="pure-u-lg-2-24 pure-u-1-24"></div>
<div id="linklist-paging-bottom-content" class="pure-u-lg-20-24 pure-u-22-24">
{include="linklist.paging"}
</div>
</div>
{include="linklist.paging"}
{include="page.footer"}
<script src="{$asset_path}/js/thumbnails.min.js?v={$version_hash}#"></script>

View file

@ -1,74 +1,70 @@
<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 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>
<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>
{/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>
{/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>
{/loop}
{/if}
</div>
</div>
<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>
{/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>
</div>

View file

@ -1,104 +1,76 @@
<div class="shaarli-menu pure-g" id="shaarli-menu">
<div class="pure-u-lg-0 pure-u-1">
<div class="pure-menu">
<header role="banner">
<a href="{$titleLink}" class="pure-menu-link shaarli-title" id="shaarli-title-mobile">
<img src="{$asset_path}/img/favicon_32.png#" width="16" height="16" class="head-logo" alt="logo" />
<header>
<nav>
<h1>
<img src="{$asset_path}/img/favicon_128.png#" loading="lazy" height="120px" alt="logo" />
<a href="{$titleLink}">
{$shaarlititle}
</a>
</header>
<a href="#" class="menu-toggle" id="menu-toggle" aria-label="{'Menu'|t}"><s class="bar" aria-hidden="true"></s><s class="bar" aria-hidden="true"></s></a>
</div>
</div>
<div class="pure-u-1">
<div class="pure-menu menu-transform pure-menu-horizontal pure-g">
<ul class="pure-menu-list pure-u-lg-5-6 pure-u-1">
<li class="pure-menu-item pure-u-0 pure-u-lg-visible">
<img src="{$asset_path}/img/logo_myShaarli.png#" width="120" height="45" class="head-logo" alt="logo" />
<a href="{$titleLink}" class="pure-menu-link shaarli-title" id="shaarli-title-desktop">
{$shaarlititle}
</h1>
<ul>
{loop="$plugins_header.buttons_toolbar"}
<li>
<a
{loop="$value.attr"}
{$key}="{$value}"
{/loop}>
{$value.html}
</a>
</li>
{/loop}
{if="$is_logged_in || $openshaarli"}
<li>
<a href="{$base_path}/admin/add-shaare">
{'Shaare'|t}
</a>
</li>
{loop="$plugins_header.buttons_toolbar"}
<li class="pure-menu-item shaarli-menu-plugin">
<a
{$value.attr.class=isset($value.class) ? $value.attr.class . ' pure-menu-link' : 'pure-menu-link'}
{loop="$value.attr"}
{$key}="{$value}"
{/loop}>
{$value.html}
<li>
<a href="{$base_path}/admin/tools">
{'Tools'|t}
</a>
</li>
{/loop}
{if="$is_logged_in || $openshaarli"}
<li class="pure-menu-item">
<a href="{$base_path}/admin/add-shaare" class="pure-menu-link" id="shaarli-menu-shaare">
<i class="fa fa-plus" aria-hidden="true"></i> {'Shaare'|t}
</a>
</li>
<li class="pure-menu-item" id="shaarli-menu-tools">
<a href="{$base_path}/admin/tools" class="pure-menu-link">
<i class="fa fa-cog" aria-hidden="true"></i> {'Tools'|t}
</a>
</li>
{/if}
<li class="pure-menu-item" id="shaarli-menu-tags">
<a href="{$base_path}/tags/cloud" class="pure-menu-link">
<i class="fa fa-cloud" aria-hidden="true"></i> {'Tag cloud'|t}
{/if}
<li>
<a href="{$base_path}/tags/cloud">
{'Tag cloud'|t}
</a>
</li>
{if="$thumbnails_enabled"}
<li>
<a href="{$base_path}/picture-wall?{function="ltrim($searchcrits, '&')"}">
{'Picture wall'|t}
</a>
</li>
{if="$thumbnails_enabled"}
<li class="pure-menu-item" id="shaarli-menu-picwall">
<a href="{$base_path}/picture-wall?{function="ltrim($searchcrits, '&')"}" class="pure-menu-link">
<i class="fa fa-picture-o" aria-hidden="true"></i> {'Picture wall'|t}
</a>
</li>
{/if}
<li class="pure-menu-item pure-u-lg-0 shaarli-menu-mobile" id="shaarli-menu-mobile-rss">
<a href="{$base_path}/feed/{$feed_type}?{$searchcrits}" class="pure-menu-link">{'RSS Feed'|t}</a>
</li>
{if="$is_logged_in"}
<li class="pure-menu-item pure-u-lg-0 shaarli-menu-mobile" id="shaarli-menu-mobile-logout">
<a href="{$base_path}/admin/logout" class="pure-menu-link">{'Logout'|t}</a>
</li>
{else}
<li class="pure-menu-item pure-u-lg-0 shaarli-menu-mobile" id="shaarli-menu-mobile-login">
<a href="{$base_path}/login" class="pure-menu-link">{'Login'|t}</a>
</li>
{/if}
{/if}
</ul>
<div class="header-buttons pure-u-lg-1-6 pure-u-0 pure-u-lg-visible">
<ul class="pure-menu-list">
<li class="pure-menu-item">
<a href="#" class="pure-menu-link" title="Toggle Dark/Light theme" aria-label="Toggle Dark/Light theme" onclick="switchTheme();">
<i class="fa fa-moon-o" aria-hidden="true"></i>
</a>
</li>
<li class="pure-menu-item" id="shaarli-menu-desktop-rss">
<a href="{$base_path}/feed/{$feed_type}?{$searchcrits}" class="pure-menu-link" title="{'RSS Feed'|t}" aria-label="{'RSS Feed'|t}">
<i class="fa fa-rss" aria-hidden="true"></i>
</a>
</li>
{if="!$is_logged_in"}
<li class="pure-menu-item" id="shaarli-menu-desktop-login">
<a href="{$base_path}/login" class="pure-menu-link"
data-open-id="header-login-form"
id="login-button" aria-label="{'Login'|t}" title="{'Login'|t}">
<i class="fa fa-user" aria-hidden="true"></i>
</a>
</li>
{else}
<li class="pure-menu-item" id="shaarli-menu-desktop-logout">
<a href="{$base_path}/admin/logout" class="pure-menu-link" aria-label="{'Logout'|t}" title="{'Logout'|t}">
<i class="fa fa-sign-out" aria-hidden="true"></i>
</a>
</li>
{/if}
</ul>
</div>
</div>
</div>
</div>
<ul>
<li>
<a href="#" title="Toggle Dark/Light theme" aria-label="Toggle Dark/Light theme" onclick="switchTheme();">
<i class="fa fa-moon-o" aria-hidden="true"></i>
</a>
</li>
<li>
<a href="{$base_path}/feed/{$feed_type}?{$searchcrits}" title="{'RSS Feed'|t}" aria-label="{'RSS Feed'|t}">
<i class="fa fa-rss" aria-hidden="true"></i>
</a>
</li>
{if="!$is_logged_in"}
<li>
<a href="{$base_path}/login"
data-open-id="header-login-form"
id="login-button" aria-label="{'Login'|t}" title="{'Login'|t}">
<i class="fa fa-user" aria-hidden="true"></i>
</a>
</li>
{else}
<li>
<a href="{$base_path}/admin/logout" aria-label="{'Logout'|t}" title="{'Logout'|t}">
<i class="fa fa-sign-out" aria-hidden="true"></i>
</a>
</li>
{/if}
</ul>
</nav>
</header>
<main id="content" class="container" role="main" data-theme="dark">
<div id="search" class="subheader-form searchform-block header-search">

View file

@ -16,8 +16,7 @@
{/if}
<div class="pure-g">
<div class="pure-u-lg-1-6 pure-u-1-24"></div>
<div class="pure-u-lg-2-3 pure-u-22-24 page-form page-visitor">
<div class="page-form page-visitor">
{$countPics=count($linksToDisplay)}
<h2 class="window-title">{'Picture Wall'|t} - {$countPics} {'pics'|t}</h2>
@ -50,7 +49,6 @@
{/loop}
</div>
</div>
<div class="pure-u-lg-1-6 pure-u-1-24"></div>
</div>
{include="page.footer"}

View file

@ -127,7 +127,7 @@
<input type="hidden" name="token" value="{$token}">
</form>
<form action="{$base_path}/admin/plugins" method="POST">
<form action="{$base_path}/admin/plugins" method="POST" class="pluginform-container">
<div class="pure-g">
<div class="pure-u-lg-1-8 pure-u-1-24"></div>
<div class="pure-u-lg-3-4 pure-u-22-24 page-form page-form-light">

View file

@ -9,8 +9,7 @@
{include="tag.sort"}
<div class="pure-g">
<div class="pure-u-lg-1-6 pure-u-1-24"></div>
<div class="pure-u-lg-2-3 pure-u-22-24 page-form page-visitor">
<div class="page-form page-visitor">
{$countTags=count($tags)}
<h2 class="window-title">{'Tag cloud'|t} - {$countTags} {'tags'|t}</h2>
{if="!empty($search_tags)"}
@ -69,4 +68,3 @@
{include="page.footer"}
</body>
</html>

View file

@ -6,129 +6,132 @@
<body>
{include="page.header"}
<div class="pure-g">
<div class="pure-u-lg-1-3 pure-u-1-24"></div>
<div class="pure-u-lg-1-3 pure-u-22-24 page-form page-form-light">
<h2 class="window-title">{'Settings'|t}</h2>
<div class="tools-item">
<a href="{$base_path}/admin/configure" title="{'Change Shaarli settings: title, timezone, etc.'|t}">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">{'Configure your Shaarli'|t}</span>
</a>
</div>
<div class="tools-item">
<a href="{$base_path}/admin/plugins" title="{'Enable, disable and configure plugins'|t}">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">{'Plugin administration'|t}</span>
</a>
</div>
<div class="tools-item">
<a href="{$base_path}/admin/server"
title="{'Check instance\'s server configuration'|t}">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">{'Server administration'|t}</span>
</a>
</div>
{if="!$openshaarli"}
<section>
<div class="pure-g">
<div class="pure-u-lg-1-3 pure-u-1-24"></div>
<div class="pure-u-lg-1-3 pure-u-22-24 page-form page-form-light">
<h2 class="window-title">{'Settings'|t}</h2>
<div class="tools-item">
<a href="{$base_path}/admin/password" title="{'Change your password'|t}">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">{'Change password'|t}</span>
<a href="{$base_path}/admin/configure" title="{'Change Shaarli settings: title, timezone, etc.'|t}">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">{'Configure your Shaarli'|t}</span>
</a>
</div>
{/if}
<div class="tools-item">
<a href="{$base_path}/admin/tags" title="{'Rename or delete a tag in all links'|t}">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">{'Manage tags'|t}</span>
</a>
</div>
<div class="tools-item">
<a href="{$base_path}/admin/import"
title="{'Import Netscape HTML bookmarks (as exported from Firefox, Chrome, Opera, delicious...)'|t}">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">{'Import links'|t}</span>
</a>
</div>
<div class="tools-item">
<a href="{$base_path}/admin/export"
title="{'Export Netscape HTML bookmarks (which can be imported in Firefox, Chrome, Opera, delicious...)'|t}">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">{'Export database'|t}</span>
</a>
</div>
{loop="$tools_plugin"}
<div class="tools-item">
{$value}
<a href="{$base_path}/admin/plugins" title="{'Enable, disable and configure plugins'|t}">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">{'Plugin administration'|t}</span>
</a>
</div>
{/loop}
<div class="tools-item">
<a href="{$base_path}/admin/server"
title="{'Check instance\'s server configuration'|t}">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">{'Server administration'|t}</span>
</a>
</div>
{if="!$openshaarli"}
<div class="tools-item">
<a href="{$base_path}/admin/password" title="{'Change your password'|t}">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">{'Change password'|t}</span>
</a>
</div>
{/if}
<div class="tools-item">
<a href="{$base_path}/admin/tags" title="{'Rename or delete a tag in all links'|t}">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">{'Manage tags'|t}</span>
</a>
</div>
<div class="tools-item">
<a href="{$base_path}/admin/import"
title="{'Import Netscape HTML bookmarks (as exported from Firefox, Chrome, Opera, delicious...)'|t}">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">{'Import links'|t}</span>
</a>
</div>
<div class="tools-item">
<a href="{$base_path}/admin/export"
title="{'Export Netscape HTML bookmarks (which can be imported in Firefox, Chrome, Opera, delicious...)'|t}">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">{'Export database'|t}</span>
</a>
</div>
{loop="$tools_plugin"}
<div class="tools-item">
{$value}
</div>
{/loop}
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>
<div class="pure-g">
<div class="pure-u-lg-1-3 pure-u-1-24"></div>
<div class="pure-u-lg-1-3 pure-u-22-24 page-form page-form-light">
<h2 class="window-title">{'Bookmarklets'|t}</h2>
<p>
{'Drag one of these button to your bookmarks toolbar or right-click it and "Bookmark This Link"'|t},
{'then click on the bookmarklet in any page you want to share.'|t}
</p>
<div class="tools-item">
<a title="{'Drag this link to your bookmarks toolbar or right-click it and Bookmark This Link'|t},
{'then click ✚Shaare link button in any page you want to share'|t}"
class="bookmarklet-link"
href="javascript:(
function(){
var%20url%20=%20location.href;
var%20title%20=%20document.title%20||%20url;
var%20desc=document.getSelection().toString();
if(desc.length>4000){
desc=desc.substr(0,4000)+'...';
alert('{function="str_replace(' ', '%20', t('The selected text is too long, it will be truncated.'))"}');
<div class="pure-g">
<div class="pure-u-lg-1-3 pure-u-1-24"></div>
<div class="pure-u-lg-1-3 pure-u-22-24 page-form page-form-light">
<h2 class="window-title">{'Bookmarklets'|t}</h2>
<p>
{'Drag one of these button to your bookmarks toolbar or right-click it and "Bookmark This Link"'|t},
{'then click on the bookmarklet in any page you want to share.'|t}
</p>
<div class="tools-item">
<a title="{'Drag this link to your bookmarks toolbar or right-click it and Bookmark This Link'|t},
{'then click ✚Shaare link button in any page you want to share'|t}"
class="bookmarklet-link"
href="javascript:(
function(){
var%20url%20=%20location.href;
var%20title%20=%20document.title%20||%20url;
var%20desc=document.getSelection().toString();
if(desc.length>4000){
desc=desc.substr(0,4000)+'...';
alert('{function="str_replace(' ', '%20', t('The selected text is too long, it will be truncated.'))"}');
}
window.open(
'{$pageabsaddr}admin/shaare?post='%20+%20encodeURIComponent(url)+
'&amp;title='%20+%20encodeURIComponent(title)+
'&amp;description='%20+%20encodeURIComponent(desc)+
'&amp;source=bookmarklet','_blank','menubar=no,height=800,width=600,toolbar=no,scrollbars=yes,status=no,dialog=1'
);
}
window.open(
'{$pageabsaddr}admin/shaare?post='%20+%20encodeURIComponent(url)+
'&amp;title='%20+%20encodeURIComponent(title)+
'&amp;description='%20+%20encodeURIComponent(desc)+
'&amp;source=bookmarklet','_blank','menubar=no,height=800,width=600,toolbar=no,scrollbars=yes,status=no,dialog=1'
);
}
)();">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">✚ {'Shaare link'|t}</span>
</a>
</div>
<div class="tools-item">
<a title="{'Drag this link to your bookmarks toolbar or right-click it and Bookmark This Link'|t},
{'Then click ✚Add Note button anytime to start composing a private Note (text post) to your Shaarli'|t}"
class="bookmarklet-link"
href="javascript:(
function(){
var%20desc=document.getSelection().toString();
if(desc.length>4000){
desc=desc.substr(0,4000)+'...';
alert('{function="str_replace(' ', '%20', t('The selected text is too long, it will be truncated.'))"}');
)();">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">✚ {'Shaare link'|t}</span>
</a>
</div>
<div class="tools-item">
<a title="{'Drag this link to your bookmarks toolbar or right-click it and Bookmark This Link'|t},
{'Then click ✚Add Note button anytime to start composing a private Note (text post) to your Shaarli'|t}"
class="bookmarklet-link"
href="javascript:(
function(){
var%20desc=document.getSelection().toString();
if(desc.length>4000){
desc=desc.substr(0,4000)+'...';
alert('{function="str_replace(' ', '%20', t('The selected text is too long, it will be truncated.'))"}');
}
window.open(
'{$pageabsaddr}admin/shaare?private=1&amp;post='+
'&amp;description='%20+%20encodeURIComponent(desc)+
'&amp;source=bookmarklet','_blank','menubar=no,height=800,width=600,toolbar=no,scrollbars=yes,status=no,dialog=1'
);
}
window.open(
'{$pageabsaddr}admin/shaare?private=1&amp;post='+
'&amp;description='%20+%20encodeURIComponent(desc)+
'&amp;source=bookmarklet','_blank','menubar=no,height=800,width=600,toolbar=no,scrollbars=yes,status=no,dialog=1'
);
}
)();">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">✚ {'Add Note'|t}</span>
</a>
)();">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">✚ {'Add Note'|t}</span>
</a>
</div>
</div>
</div>
</div>
<div class="pure-g">
<div class="pure-u-lg-1-3 pure-u-1-24"></div>
<div class="pure-u-lg-1-3 pure-u-22-24 page-form page-form-light">
<h2 class="window-title">{'Third-party resources'|t}</h2>
<div class="tools-item">
<a href="https://shaarli.readthedocs.io/en/master/Community-and-related-software/">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">{'Community and related software'|t}</span>
</a>
<div class="pure-g">
<div class="pure-u-lg-1-3 pure-u-1-24"></div>
<div class="pure-u-lg-1-3 pure-u-22-24 page-form page-form-light">
<h2 class="window-title">{'Third-party resources'|t}</h2>
<div class="tools-item">
<a href="https://shaarli.readthedocs.io/en/master/Community-and-related-software/">
<span class="pure-button pure-u-lg-2-3 pure-u-3-4">{'Community and related software'|t}</span>
</a>
</div>
</div>
</div>
</div>
</section>
{include="page.footer"}
<input type="hidden" id="bookmarklet-alert"