feat: améliorer la recherche de tags avec extraction via data-attributes, ajouter raccourci clavier T pour mode tags direct, styles thème clair pour tag cloud avec gradients bleus optimisés, et correction syntaxe Smarty tag.list.html
This commit is contained in:
parent
5ba43fa9d2
commit
1ea13ff16b
@ -129,14 +129,23 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
function fetchTags() {
|
||||
if (cachedTags) return cachedTags;
|
||||
try {
|
||||
const tagElements = document.querySelectorAll('.link-tag, .tag-link, [class*="tag"]');
|
||||
const tagsSet = new Set();
|
||||
|
||||
tagElements.forEach(el => {
|
||||
const tagText = el.textContent.trim();
|
||||
if (tagText && tagText.length > 0 && !tagText.includes('•')) {
|
||||
tagsSet.add(tagText);
|
||||
}
|
||||
const addTag = (value) => {
|
||||
if (typeof value !== 'string') return;
|
||||
const cleaned = value.trim();
|
||||
if (!cleaned || cleaned.includes('•')) return;
|
||||
tagsSet.add(cleaned);
|
||||
};
|
||||
|
||||
// Prefer explicit tag data attributes to avoid polluted text values (e.g. remove buttons)
|
||||
document.querySelectorAll('.link-tag[data-tag], .tag-item[data-tag], [data-tag-name]').forEach((el) => {
|
||||
addTag(el.getAttribute('data-tag') || el.getAttribute('data-tag-name'));
|
||||
});
|
||||
|
||||
// Fallback selectors with reliable text content
|
||||
document.querySelectorAll('.link-tag-link, .tag-link, .cloud-tag').forEach((el) => {
|
||||
addTag(el.textContent);
|
||||
});
|
||||
|
||||
// Convert to array and sort alphabetically
|
||||
@ -428,6 +437,13 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
e.preventDefault();
|
||||
openSearch();
|
||||
}
|
||||
|
||||
// T to open search directly in tags mode (when not typing)
|
||||
if (!isTyping && !e.ctrlKey && !e.metaKey && !e.altKey && (e.key === 't' || e.key === 'T')) {
|
||||
e.preventDefault();
|
||||
openSearch();
|
||||
setSearchMode('tags');
|
||||
}
|
||||
});
|
||||
|
||||
// ===== Filter Panel =====
|
||||
|
||||
@ -286,6 +286,7 @@ Bookmarklet detection logic
|
||||
</div>
|
||||
<div class="search-footer">
|
||||
<span class="search-footer-hint">
|
||||
<kbd class="search-kbd">T</kbd> tags
|
||||
<kbd class="search-kbd">↑</kbd><kbd class="search-kbd">↓</kbd> to navigate
|
||||
<kbd class="search-kbd">Enter</kbd> to select
|
||||
<kbd class="search-kbd">ESC</kbd> to close
|
||||
|
||||
@ -273,9 +273,75 @@
|
||||
box-shadow: 0 3px 10px rgba(99, 102, 241, 0.5);
|
||||
}
|
||||
|
||||
/* Light mode overrides */
|
||||
[data-theme="light"] .page-tag-cloud .alphabet-filter {
|
||||
background: linear-gradient(135deg, #f8fbff 0%, #eef4ff 100%);
|
||||
border-color: rgba(59, 130, 246, 0.22);
|
||||
box-shadow:
|
||||
0 6px 18px rgba(15, 23, 42, 0.08),
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.85);
|
||||
}
|
||||
|
||||
[data-theme="light"] .page-tag-cloud .alpha-btn {
|
||||
color: rgba(71, 85, 105, 0.9);
|
||||
}
|
||||
|
||||
[data-theme="light"] .page-tag-cloud .alpha-btn:hover:not(.disabled) {
|
||||
color: #1e293b;
|
||||
}
|
||||
|
||||
[data-theme="light"] .page-tag-cloud .alpha-btn:hover:not(.disabled)::before {
|
||||
background: rgba(59, 130, 246, 0.16);
|
||||
}
|
||||
|
||||
[data-theme="light"] .page-tag-cloud .alpha-btn.active {
|
||||
color: #ffffff;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
[data-theme="light"] .page-tag-cloud .alpha-btn.active::before {
|
||||
background: linear-gradient(135deg, #3b82f6 0%, #6366f1 100%);
|
||||
box-shadow:
|
||||
0 3px 10px rgba(59, 130, 246, 0.35),
|
||||
0 0 14px rgba(99, 102, 241, 0.2);
|
||||
}
|
||||
|
||||
[data-theme="light"] .page-tag-cloud .alpha-btn.disabled {
|
||||
color: rgba(148, 163, 184, 0.75);
|
||||
}
|
||||
|
||||
[data-theme="light"] .page-tag-cloud .cloud-tag {
|
||||
color: #1e293b;
|
||||
background: linear-gradient(135deg, #f8faff 0%, #eef3ff 100%);
|
||||
border-color: rgba(99, 102, 241, 0.22);
|
||||
box-shadow:
|
||||
0 2px 8px rgba(15, 23, 42, 0.1),
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
|
||||
[data-theme="light"] .page-tag-cloud .cloud-tag:hover {
|
||||
color: #0f172a;
|
||||
background: linear-gradient(135deg, rgba(59, 130, 246, 0.2) 0%, rgba(99, 102, 241, 0.16) 100%);
|
||||
border-color: rgba(59, 130, 246, 0.42);
|
||||
box-shadow:
|
||||
0 4px 12px rgba(59, 130, 246, 0.2),
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.85);
|
||||
}
|
||||
|
||||
[data-theme="light"] .page-tag-cloud .count-badge {
|
||||
background: linear-gradient(135deg, #3b82f6 0%, #6366f1 100%);
|
||||
box-shadow: 0 2px 7px rgba(59, 130, 246, 0.35);
|
||||
}
|
||||
|
||||
[data-theme="light"] .page-tag-cloud .cloud-tag[style*="font-size:4"],
|
||||
[data-theme="light"] .page-tag-cloud .cloud-tag[style*="font-size:5"] {
|
||||
background: linear-gradient(135deg, rgba(59, 130, 246, 0.14) 0%, #eef3ff 100%);
|
||||
border-color: rgba(59, 130, 246, 0.26);
|
||||
}
|
||||
|
||||
/* Size variations for visual hierarchy - keeping font-size from template */
|
||||
.cloud-tag[style*="font-size:1"] {
|
||||
padding: 0.4em 0.8em;
|
||||
.cloud-tag[style*="font-size:2"] {
|
||||
font-weight: 550;
|
||||
}
|
||||
|
||||
.cloud-tag[style*="font-size:2"],
|
||||
|
||||
@ -162,11 +162,11 @@
|
||||
<input type="hidden" name="taglist" id="tagListData" value="">
|
||||
{/if}
|
||||
|
||||
{literal}
|
||||
<script>
|
||||
(function () {
|
||||
var filterInput = document.getElementById('tagFilterInput');
|
||||
var clearBtn = document.getElementById('tagFilterClear');
|
||||
|
||||
var tagListContainer = document.getElementById('tagListContainer');
|
||||
var noTagsMessage = document.getElementById('noTagsMessage');
|
||||
var visibleTagCount = document.getElementById('visibleTagCount');
|
||||
@ -230,7 +230,6 @@
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
{/literal}
|
||||
|
||||
{include="page.footer"}
|
||||
</body>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user