float: left;
}
+ul.warnings {
+ color: orange;
+ float: left;
+}
+
+ul.successes {
+ color: green;
+ float: left;
+}
+
#pluginsadmin {
width: 80%;
padding: 20px 0 0 20px;
width: 0%;
height: 10px;
}
+
+.loading-input {
+ position: relative;
+}
+
+@keyframes around {
+ 0% {
+ transform: rotate(0deg);
+ }
+
+ 100% {
+ transform: rotate(360deg);
+ }
+}
+
+.loading-input .icon-container {
+ position: absolute;
+ right: 60px;
+ top: calc(50% - 10px);
+}
+
+.loading-input .loader {
+ position: relative;
+ height: 20px;
+ width: 20px;
+ display: inline-block;
+ animation: around 5.4s infinite;
+}
+
+.loading-input .loader::after,
+.loading-input .loader::before {
+ content: "";
+ background: #eee;
+ position: absolute;
+ display: inline-block;
+ width: 100%;
+ height: 100%;
+ border-width: 2px;
+ border-color: #333 #333 transparent transparent;
+ border-style: solid;
+ border-radius: 20px;
+ box-sizing: border-box;
+ top: 0;
+ left: 0;
+ animation: around 0.7s ease-in-out infinite;
+}
+
+.loading-input .loader::after {
+ animation: around 0.7s ease-in-out 0.1s infinite;
+ background: transparent;
+}
<div class="dailyAbout">
All links of one day<br>in a single page.<br>
- {if="$previousday"} <a href="{$base_path}/daily&day={$previousday}"><b><</b>Previous day</a>{else}<b><</b>Previous day{/if}
+ {if="$previousday"} <a href="{$base_path}/daily?day={$previousday}"><b><</b>Previous day</a>{else}<b><</b>Previous day{/if}
-
- {if="$nextday"}<a href="{$base_path}/daily&day={$nextday}">Next day<b>></b></a>{else}Next day<b>></b>{/if}
+ {if="$nextday"}<a href="{$base_path}/daily?day={$nextday}">Next day<b>></b></a>{else}Next day<b>></b>{/if}
<br>
{loop="$daily_about_plugin"}
{$link=$value}
<div class="dailyEntry">
<div class="dailyEntryPermalink">
- <a href="{$base_path}/?{$value.shorturl}">
+ <a href="{$base_path}/shaare/{$value.shorturl}">
<img src="{$asset_path}/img/squiggle.png#" width="25" height="26" title="permalink" alt="permalink">
</a>
</div>
{if="!$hide_timestamps || $is_logged_in"}
<div class="dailyEntryLinkdate">
- <a href="{$base_path}/?{$value.shorturl}">{function="strftime('%c', $link.timestamp)"}</a>
+ <a href="{$base_path}/shaare/{$value.shorturl}">{function="strftime('%c', $link.timestamp)"}</a>
</div>
{/if}
{if="$link.tags"}
{if="$link.title==''"}onload="document.linkform.lf_title.focus();"
{elseif="$link.description==''"}onload="document.linkform.lf_description.focus();"
{else}onload="document.linkform.lf_tags.focus();"{/if} >
+{$asyncLoadClass=$link_is_new && $async_metadata && empty($link.title) ? 'loading-input' : ''}
<div id="pageheader">
{include="page.header"}
<div id="shaarli_title"><a href="{$titleLink}">{$shaarlititle}</a></div>
{if="isset($link.id)"}
<input type="hidden" name="lf_id" value="{$link.id}">
{/if}
- <label for="lf_url"><i>URL</i></label><br><input type="text" name="lf_url" id="lf_url" value="{$link.url}" class="lf_input"><br>
- <label for="lf_title"><i>Title</i></label><br><input type="text" name="lf_title" id="lf_title" value="{$link.title}" class="lf_input"><br>
- <label for="lf_description"><i>Description</i></label><br><textarea name="lf_description" id="lf_description" rows="4" cols="25">{$link.description}</textarea><br>
- <label for="lf_tags"><i>Tags</i></label><br>
- <input type="text" name="lf_tags" id="lf_tags" value="{$link.tags}" class="lf_input"
- data-list="{loop="$tags"}{$key}, {/loop}" data-multiple autocomplete="off" ><br>
+ <label for="lf_url"><i>URL</i></label><br><input type="text" name="lf_url" id="lf_url" value="{$link.url}" class="lf_input">
+ <label for="lf_title"><i>Title</i></label>
+ <div class="{$asyncLoadClass}">
+ <input type="text" name="lf_title" id="lf_title" value="{$link.title}" class="lf_input">
+ <div class="icon-container">
+ <i class="loader"></i>
+ </div>
+ </div>
+ <label for="lf_description"><i>Description</i></label>
+ <div class="{if="$retrieve_description"}{$asyncLoadClass}{/if}">
+ <textarea name="lf_description" id="lf_description" rows="4" cols="25">{$link.description}</textarea>
+ <div class="icon-container">
+ <i class="loader"></i>
+ </div>
+ </div>
+ <label for="lf_tags"><i>Tags</i></label>
+ <div class="{if="$retrieve_description"}{$asyncLoadClass}{/if}">
+ <input type="text" name="lf_tags" id="lf_tags" value="{$link.tags}" class="lf_input"
+ data-list="{loop="$tags"}{$key}, {/loop}" data-multiple autocomplete="off" >
+ <div class="icon-container">
+ <i class="loader"></i>
+ </div>
+ </div>
{if="$formatter==='markdown'"}
<div class="md_help">
</div>
</div>
{include="page.footer"}
-</body>
+{if="$link_is_new && $async_metadata"}<script src="{$asset_path}/js/metadata.min.js?v={$version_hash}#"></script>{/if}</body>
</html>
</ul>
{/if}
+{if="!empty($global_errors)"}
+ <ul class="errors">
+ {loop="$global_errors"}
+ <li>{$value}</li>
+ {/loop}
+ </ul>
+{/if}
+
+{if="!empty($global_warnings)"}
+ <ul class="warnings">
+ {loop="$global_warnings"}
+ <li>{$value}</li>
+ {/loop}
+ </ul>
+{/if}
+
+{if="!empty($global_successes)"}
+ <ul class="successes">
+ {loop="$global_successes"}
+ <li>{$value}</li>
+ {/loop}
+ </ul>
+{/if}
+
<div class="clear"></div>