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() {
|
function fetchTags() {
|
||||||
if (cachedTags) return cachedTags;
|
if (cachedTags) return cachedTags;
|
||||||
try {
|
try {
|
||||||
const tagElements = document.querySelectorAll('.link-tag, .tag-link, [class*="tag"]');
|
|
||||||
const tagsSet = new Set();
|
const tagsSet = new Set();
|
||||||
|
|
||||||
tagElements.forEach(el => {
|
const addTag = (value) => {
|
||||||
const tagText = el.textContent.trim();
|
if (typeof value !== 'string') return;
|
||||||
if (tagText && tagText.length > 0 && !tagText.includes('•')) {
|
const cleaned = value.trim();
|
||||||
tagsSet.add(tagText);
|
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
|
// Convert to array and sort alphabetically
|
||||||
@ -428,6 +437,13 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
openSearch();
|
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 =====
|
// ===== Filter Panel =====
|
||||||
|
|||||||
@ -286,6 +286,7 @@ Bookmarklet detection logic
|
|||||||
</div>
|
</div>
|
||||||
<div class="search-footer">
|
<div class="search-footer">
|
||||||
<span class="search-footer-hint">
|
<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">↑</kbd><kbd class="search-kbd">↓</kbd> to navigate
|
||||||
<kbd class="search-kbd">Enter</kbd> to select
|
<kbd class="search-kbd">Enter</kbd> to select
|
||||||
<kbd class="search-kbd">ESC</kbd> to close
|
<kbd class="search-kbd">ESC</kbd> to close
|
||||||
|
|||||||
@ -273,9 +273,75 @@
|
|||||||
box-shadow: 0 3px 10px rgba(99, 102, 241, 0.5);
|
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 */
|
/* Size variations for visual hierarchy - keeping font-size from template */
|
||||||
.cloud-tag[style*="font-size:1"] {
|
.cloud-tag[style*="font-size:2"] {
|
||||||
padding: 0.4em 0.8em;
|
font-weight: 550;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cloud-tag[style*="font-size:2"],
|
.cloud-tag[style*="font-size:2"],
|
||||||
|
|||||||
@ -162,11 +162,11 @@
|
|||||||
<input type="hidden" name="taglist" id="tagListData" value="">
|
<input type="hidden" name="taglist" id="tagListData" value="">
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
{literal}
|
|
||||||
<script>
|
<script>
|
||||||
(function () {
|
(function () {
|
||||||
var filterInput = document.getElementById('tagFilterInput');
|
var filterInput = document.getElementById('tagFilterInput');
|
||||||
var clearBtn = document.getElementById('tagFilterClear');
|
var clearBtn = document.getElementById('tagFilterClear');
|
||||||
|
|
||||||
var tagListContainer = document.getElementById('tagListContainer');
|
var tagListContainer = document.getElementById('tagListContainer');
|
||||||
var noTagsMessage = document.getElementById('noTagsMessage');
|
var noTagsMessage = document.getElementById('noTagsMessage');
|
||||||
var visibleTagCount = document.getElementById('visibleTagCount');
|
var visibleTagCount = document.getElementById('visibleTagCount');
|
||||||
@ -230,7 +230,6 @@
|
|||||||
});
|
});
|
||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
{/literal}
|
|
||||||
|
|
||||||
{include="page.footer"}
|
{include="page.footer"}
|
||||||
</body>
|
</body>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user