* 64em -> lg
*/
.linklist-filters {
- margin: 10px 0;
+ margin: 5px 0;
color: #252525;
font-size: 0.9em;
}
}
.linklist-pages {
- margin: 10px 0;
+ margin: 5px 0;
color: #252525;
text-align: center;
}
}
.linksperpage {
- margin: 10px 0;
+ margin: 5px 0;
text-align: right;
color: #252525;
font-size: 0.9em;
* CONTENT - LINKLIST ITEMS
*/
.linklist-item {
- margin: 0 0 15px 0;
+ margin: 0 0 10px 0;
background: #f5f5f5;
- box-shadow: 2px 2px 0.5em #797979;
+ box-shadow: 1px 1px 3px #797979;
+}
+
+.linklist-item-buttons {
+ background: transparent;
+ position: relative;
+ width: 23px;
+ z-index: 99;
+}
+
+.linklist-item-buttons-right {
+ float: right;
+ margin-right: -25px;
+}
+
+.linklist-item-buttons * {
+ display: block;
+ float: left;
+ width:100%;
+ margin: auto;
+ text-align: center;
}
.linklist-item-title, .linklist-item-title h2 {
line-height: 30px;
}
-.linklist-item-title a {
+.linklist-item-title h2 a {
font-size: 0.7em;
color: #252525;
text-decoration: none;
color: #1b926c;
}
-.linklist-item-title a:visited .linklist-link {
+.linklist-item-title h2 a:visited .linklist-link {
color: #2a4c41;
}
-.linklist-item-title a:hover, .linklist-item-title .linklist-link:hover{
+.linklist-item-title h2 a:hover, .linklist-item-title .linklist-link:hover{
color: #252525;
}
color: #F89406;
}
-.linklist-item-title .fold-button {
+.fold-button {
display: none;
+ color: #252525;
}
.linklist-item-editbuttons {
.linklist-item-description {
position: relative;
- padding: 10px;
+ padding: 0 10px;
word-wrap: break-word;
color: #252525;
line-height: 1.3em;
}
- {
- position: absolute;
- left: 3px;
- top: 0;
- display: block;
- content:"";
- background: #F89406;
- height: 95%;
- width: 2px;
- z-index: 1;
-}
-
.linklist-item-description a {
text-decoration: none;
color: #1b926c;
.linklist-item-thumbnail {
position: relative;
- margin-top: 10px;
- padding: 10px;
- float: left;
+ padding: 0 0 0 5px;
+ margin: 0;
+ float: right;
z-index: 50;
+ height: 90px;
}
.linklist-item.private .linklist-item-title::before,
-.linklist-item.private .linklist-item-description::before,
-.linklist-item.private .linklist-item-thumbnail::before {
+.linklist-item.private .linklist-item-description::before {
position: absolute;
left: 3px;
top: 0;
display: block;
content:"";
background: #F89406;
- height: 95%;
+ height: 96%;
width: 2px;
z-index: 1;
}
+.linklist-item.private .linklist-item-description::before {
+ height: 100%;
+}
+
.linklist-item.private .linklist-item-title::before {
margin-top: 3px;
}
.linklist-item-infos {
- padding: 8px 8px 5px 8px;
+ padding: 4px 8px 4px 8px;
background: #ddd;
color: #252525;
}
overflow: hidden;
text-overflow: ellipsis;
font-size: 0.8em;
+ height:23px;
+ line-height:23px;
}
.linklist-item-infos .mobile-buttons {
height: 16px;
}
+.linklist-item-infos-controls-group {
+ display: inline-block;
+ border-right: 1px solid #5d5d5d;
+ padding-right: 6px;
+}
+
+.ctrl-edit {
+ margin: 0 7px;
+}
+
/** 64em -> lg **/
@media screen and (max-width: 64em) {
.linklist-item-infos-url {
text-decoration: none;
font-weight: bold;
}
+
+/**
+ * Markdown
+ */
+.markdown p {
+ margin: 0 !important;
+}
+
+.markdown p + p {
+ margin: 0.5em 0 0 0 !important;
+}
+
+.markdown *:first-child {
+ margin-top: 0 !important;
+}
+
+.markdown *:last-child {
+ margin-bottom: 5px !important;
+}
\ No newline at end of file
{/loop}
<div id="linklist">
- <div class="pure-g">
+ <div id="link-count-block" class="pure-g">
<div class="pure-u-lg-2-24 pure-u-1-24"></div>
- <div class="pure-u-lg-20-24 pure-u-22-24">
+ <div id="link-count-content" class="pure-u-lg-20-24 pure-u-22-24">
<div class="linkcount pure-u-lg-0 center">
{if="!empty($linkcount)"}
<span class="strong">{$linkcount}</span> {function="t('shaare', 'shaares', $linkcount)"}
</div>
{if="count($links)==0"}
- <div class="pure-g pure-alert pure-alert-error search-result">
+ <div id="search-result-block" class="pure-g pure-alert pure-alert-error search-result">
<div class="pure-u-2-24"></div>
- <div class="pure-u-20-24">
+ <div id="search-result-content" class="pure-u-20-24">
<div id="searchcriteria">{'Nothing found.'|t}</div>
</div>
</div>
{elseif="!empty($search_term) or $search_tags !== '' or !empty($visibility) or $untaggedonly"}
- <div class="pure-g pure-alert pure-alert-success search-result">
+ <div id="search-result-block" class="pure-g pure-alert pure-alert-success search-result">
<div class="pure-u-2-24"></div>
- <div class="pure-u-20-24">
+ <div id="search-result-content" class="pure-u-20-24 search-result-main">
{function="sprintf(t('%s result', '%s results', $result_count), $result_count)"}
{if="!empty($search_term)"}
{'for'|t} <em><strong>{$search_term}</strong></em>
</div>
{/if}
- <div class="pure-g">
+ <div id="linklist-loop-block" class="pure-g">
<div class="pure-u-lg-2-24 pure-u-1-24"></div>
- <div class="pure-u-lg-20-24 pure-u-22-24">
+ <div id="linklist-loop-content" class="pure-u-lg-20-24 pure-u-22-24">
{ignore}Set translation here, for performances{/ignore}
{$strPrivate=t('Private')}
{$strEdit=t('Edit')}
{ignore}End of translations{/ignore}
{loop="links"}
<div class="anchor" id="{$value.shorturl}"></div>
- <div class="linklist-item linklist-item{if="$value.class"} {$value.class}{/if}" data-id="{$value.id}">
+ <div class="linklist-item linklist-item{if="$value.class"} {$value.class}{/if}" data-id="{$value.id}">
<div class="linklist-item-title">
+ {$thumb=thumbnail($value.url)}
+ {if="$thumb!=false"}
+ <div class="linklist-item-thumbnail">{$thumb}</div>
+ {/if}
+
{if="isLoggedIn()"}
<div class="linklist-item-editbuttons">
{if="$value.private"}
<span class="label label-private">{$strPrivate}</span>
{/if}
- <input type="checkbox" class="delete-checkbox" value="{$value.id}">
- <!-- FIXME! JS translation -->
- <a href="?edit_link={$value.id}" title="{$strEdit}"><i class="fa fa-pencil-square-o edit-link"></i></a>
- <a href="#" title="{$strFold}" class="fold-button"><i class="fa fa-chevron-up"></i></a>
</div>
{/if}
</h2>
</div>
- {$thumb=thumbnail($value.url)}
- {if="$thumb!=false"}
- <div class="linklist-item-thumbnail">{$thumb}</div>
- {/if}
-
{if="$value.description"}
<div class="linklist-item-description">
{$value.description}
</div>
{/if}
- <div class="pure-g">
- <div class="linklist-item-infos-dateblock pure-u-lg-3-8 pure-u-1">
+ <div class="linklist-item-infos-date-url-block pure-g">
+ <div class="linklist-item-infos-dateblock pure-u-lg-7-12 pure-u-1">
+ {if="isLoggedIn()"}
+ <div class="linklist-item-infos-controls-group pure-u-0 pure-u-lg-visible">
+ <span class="linklist-item-infos-controls-item ctrl-checkbox">
+ <input type="checkbox" class="delete-checkbox" value="{$value.id}">
+ </span>
+ <span class="linklist-item-infos-controls-item ctrl-edit">
+ <a href="?edit_link={$value.id}" title="{$strEdit}"><i class="fa fa-pencil-square-o edit-link"></i></a>
+ </span>
+ <span class="linklist-item-infos-controls-item ctrl-delete">
+ <a href="?delete_link&lf_linkdate={$value.id}&token={$token}"
+ title="{$strDelete}" class="delete-link pure-u-0 pure-u-lg-visible confirm-delete">
+ <i class="fa fa-trash"></i>
+ </a>
+ </span>
+ </div>
+ {/if}
<a href="?{$value.shorturl}" title="{$strPermalink}">
{if="!$hide_timestamps || isLoggedIn()"}
{$updated=$value.updated_timestamp ? $strEdited. format_date($value.updated) : $strPermalink}
</div>
</div><div
{ignore}do not add space or line break between these div - Firefox issue{/ignore}
- class="linklist-item-infos-url pure-u-lg-5-8 pure-u-1">
+ class="linklist-item-infos-url pure-u-lg-5-12 pure-u-1">
<a href="{$value.real_url}" title="{$value.title}">
<i class="fa fa-link"></i> {$value.url}
</a>
- {if="isLoggedIn()"}
- <a href="?delete_link&lf_linkdate={$value.id}&token={$token}"
- title="{$strDelete}" class="delete-link pure-u-0 pure-u-lg-visible confirm-delete">
- <i class="fa fa-trash"></i>
- </a>
- {/if}
+ <div class="linklist-item-buttons pure-u-0 pure-u-lg-visible">
+ <a href="#" title="{$strFold}" class="fold-button"><i class="fa fa-chevron-up"></i></a>
+ </div>
</div>
<div class="mobile-buttons pure-u-1 pure-u-lg-0">
{if="isset($value.link_plugin)"}
title="{$strDelete}" class="delete-link confirm-delete">
<i class="fa fa-trash"></i>
</a>
+ ·
+ <a href="?edit_link={$value.id}" title="{$strEdit}"><i class="fa fa-pencil-square-o edit-link"></i></a>
{/if}
</div>
</div>
{/loop}
</div>
-<div class="pure-g">
+<div id="linklist-paging-bottom-block" class="pure-g">
<div class="pure-u-lg-2-24 pure-u-1-24"></div>
- <div class="pure-u-lg-20-24 pure-u-22-24">
+ <div id="linklist-paging-bottom-content" class="pure-u-lg-20-24 pure-u-22-24">
{include="linklist.paging"}
</div>
</div>