feat: Introduce a new 'Shaarli Professional Theme' with modern sidebar layout, light/dark mode, and corresponding link list template.

This commit is contained in:
Bruno Charest 2026-01-16 16:00:58 -05:00
parent e77425241f
commit c81eab72e5
2 changed files with 62 additions and 2 deletions

View File

@ -3042,3 +3042,54 @@ select:focus {
color: var(--primary); color: var(--primary);
font-weight: 600; font-weight: 600;
} }
/* Search Results Header (Tags) */
.search-results-header {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 0.5rem;
padding: 1rem 0;
margin-bottom: 1rem;
border-bottom: 1px solid var(--border);
}
.search-count {
font-weight: 600;
color: var(--text-main);
margin-right: 0.5rem;
}
.search-tag-chip {
display: inline-flex;
align-items: center;
gap: 0.25rem;
background: var(--tag-bg);
color: var(--tag-text);
padding: 0.25rem 0.6rem;
border-radius: 999px;
font-size: 0.85rem;
font-weight: 500;
}
.search-tag-close {
display: inline-flex;
align-items: center;
justify-content: center;
color: currentColor;
opacity: 0.7;
border-radius: 50%;
width: 16px;
height: 16px;
transition: all 0.2s;
text-decoration: none;
}
.search-tag-close:hover {
background: rgba(0,0,0,0.1);
opacity: 1;
}
.search-tag-close i {
font-size: 14px;
}

View File

@ -20,6 +20,15 @@
</div> </div>
</div> </div>
</div> </div>
{if="!empty($search_tags)"}
<div class="search-results-header">
<span class="search-count">{$result_count} results tagged</span>
{$exploded_tags=tags_str2array($search_tags, $tags_separator)}
{loop="$exploded_tags"}
<span class="search-tag-chip">{$value} <a href="{$base_path}/remove-tag/{function="urlencode($value)"}" class="search-tag-close" title="Remove tag"><i class="mdi mdi-close"></i></a></span>
{/loop}
</div>
{/if}
{if="count($links)==0"} {if="count($links)==0"}
<div class="empty-state"> <div class="empty-state">
<div class="empty-state-icon"><i class="mdi mdi-bookmark-off-outline"></i></div> <div class="empty-state-icon"><i class="mdi mdi-bookmark-off-outline"></i></div>
@ -51,7 +60,7 @@
</div> </div>
{if="$value.description"}<div class="link-description">{$value.description}</div>{/if} {if="$value.description"}<div class="link-description">{$value.description}</div>{/if}
<div class="link-footer"> <div class="link-footer">
<div class="link-tag-list">{loop="$value.taglist"}<span class="link-tag"><a href="{$base_path}/add-tag/{$key|urlencode}">{$value}</a></span>{/loop}</div> <div class="link-tag-list">{loop="$value.taglist"}<span class="link-tag"><a href="{$base_path}/add-tag/{$value|urlencode}">{$value}</a></span>{/loop}</div>
<div class="link-actions"> <div class="link-actions">
{if="$is_logged_in"} {if="$is_logged_in"}
<a href="{$base_path}/admin/shaare/{$value.id}" title="Edit"><i class="mdi mdi-pencil"></i></a> <a href="{$base_path}/admin/shaare/{$value.id}" title="Edit"><i class="mdi mdi-pencil"></i></a>