UI: replace Lucide icons with Papicons
Swap the inline SVG icons of the web UI (top bar, view mode, time range, export, close, empty state, back to top, settings tabs, save, delete, lock) for their Papicons equivalents (MIT, Association Papillon). Papicons are filled shapes: they carry class "pi", which sets fill: currentColor and no stroke, so the stroked Lucide icons that stay (zoom out, Docker badge) are unaffected. Add THIRD_PARTY_NOTICES.md with the Papicons MIT notice and a pointer from both READMEs. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
This commit is contained in:
cedricandClaude Opus 5.5 committed
1 parent
3e703c8792
commit
0bfea7cd93
7 files changed
+80
-30
No files matched your search
+3
-3
@@ -2357,7 +2357,7 @@ function fileRowHTML(s) {
|
||||
<select class="field" data-f="format">${FILE_FORMATS.map((f) => `<option value="${f}"${s.format === f ? ' selected' : ''}>${esc(t('fmt_' + f))}</option>`).join('')}</select>
|
||||
<input type="text" data-f="host" value="${esc(s.host)}" placeholder="${esc(filesState?.defaultHost || t('fileHost'))}" aria-label="${esc(t('fileHost'))}" title="${esc(t('fileHost'))}" spellcheck="false">
|
||||
<button class="icon-btn danger" type="button" data-del title="${esc(t('del'))}" aria-label="${esc(t('del'))}">
|
||||
<svg viewBox="0 0 24 24"><path d="M4 7h16M10 11v6M14 11v6M6 7l1 13h10l1-13M9 7V4h6v3"/></svg>
|
||||
<svg class="pi" viewBox="0 0 24 24"><path d="M14.876 10.2891C17.2815 10.2054 18.4841 10.1634 19.1094 10.876C19.7347 11.5886 19.5423 12.7465 19.1562 15.0625L18.835 16.9863C18.4359 19.3808 18.2367 20.5781 17.3975 21.2891C16.5582 22 15.3444 22 12.917 22H11.082C8.65486 22 7.44074 22 6.60156 21.2891C5.76256 20.5781 5.5631 19.3805 5.16406 16.9863L4.84375 15.0625C4.45778 12.7467 4.26459 11.5886 4.88965 10.876C5.51497 10.1633 6.71833 10.2054 9.12402 10.2891C10.0581 10.3216 11.0413 10.3428 12 10.3428C12.9587 10.3428 13.9418 10.3216 14.876 10.2891ZM8.5 12C7.94775 12 7.50001 12.4477 7.5 13V19C7.5 19.5523 7.94774 20 8.5 20C9.05215 19.9998 9.5 19.5522 9.5 19V13C9.49999 12.4478 9.05215 12.0002 8.5 12ZM12 12C11.4477 12 11 12.4477 11 13V19C11 19.5523 11.4477 20 12 20C12.5522 19.9998 13 19.5522 13 19V13C13 12.4478 12.5521 12.0002 12 12ZM15.5 12C14.9477 12 14.5 12.4477 14.5 13V19C14.5 19.5523 14.9477 20 15.5 20C16.0522 19.9998 16.5 19.5522 16.5 19V13C16.5 12.4478 16.0521 12.0002 15.5 12ZM12 2C13.2752 2 14.271 2.27648 14.9707 2.85449C15.6924 3.45088 15.9479 4.2418 15.9922 4.93652C16.0162 5.31286 15.9793 5.67654 15.9189 6H18.6494C19.3953 6.00014 19.9999 6.60474 20 7.35059C20 8.01305 19.5206 8.57368 18.8623 8.64746C17.5465 8.79493 15.1509 9 12 9C8.8491 9 6.4535 8.79493 5.1377 8.64746C4.47935 8.57368 4 8.01305 4 7.35059C4.00014 6.60474 4.60474 6.00014 5.35059 6H8.08105C8.02072 5.67654 7.98384 5.31286 8.00781 4.93652C8.05208 4.2418 8.30763 3.45088 9.0293 2.85449C9.729 2.27648 10.7248 2 12 2ZM12 4C10.9822 4 10.5121 4.22356 10.3037 4.39551C10.1178 4.54906 10.0234 4.75842 10.0039 5.06348C9.9847 5.36497 10.0475 5.70063 10.1367 6H13.8633C13.9525 5.70063 14.0153 5.36497 13.9961 5.06348C13.9766 4.75842 13.8822 4.54906 13.6963 4.39551C13.4879 4.22356 13.0178 4 12 4Z" /></svg>
|
||||
</button>
|
||||
<input type="text" data-f="regex" class="mono fr-regex" value="${esc(s.regex)}" placeholder="${esc(t('fileRegex'))}" aria-label="${esc(t('fmt_regex'))}" spellcheck="false"${s.format === 'regex' ? '' : ' hidden'}>
|
||||
<p class="fr-status docker-status ${cls}">${esc(text)}</p>
|
||||
@@ -2448,7 +2448,7 @@ $('#addFile').addEventListener('click', () => {
|
||||
|
||||
let dockerState = null;
|
||||
const dockerView = { showStopped: store.get('dockerShowStopped', '0') === '1', filter: '' };
|
||||
const LOCK_ICON = '<svg viewBox="0 0 24 24" aria-hidden="true"><rect x="5" y="11" width="14" height="10" rx="2"/><path d="M8 11V7a4 4 0 0 1 8 0v4"/></svg>';
|
||||
const LOCK_ICON = '<svg class="pi" viewBox="0 0 24 24" aria-hidden="true"><path fill-rule="evenodd" clip-rule="evenodd" d="M12.3242 3.86597C15.6401 4.03712 17.8282 6.8295 17.96 10.2146C17.9802 10.7348 17.9905 11.2945 17.9951 11.8943C18.6507 11.9382 19.1124 12.0357 19.5 12.2595C19.9559 12.5228 20.3344 12.9013 20.5977 13.3572C20.9996 14.0533 21 14.9879 21 16.8572C21 18.7264 20.9996 19.661 20.5977 20.3572C20.3344 20.8131 19.9559 21.1916 19.5 21.4548C18.8038 21.8568 17.8692 21.8572 16 21.8572H8C6.13077 21.8572 5.19615 21.8568 4.5 21.4548C4.04408 21.1916 3.66561 20.8131 3.40234 20.3572C3.00042 19.661 3 18.7264 3 16.8572C3 14.9879 3.00042 14.0533 3.40234 13.3572C3.66561 12.9013 4.04408 12.5228 4.5 12.2595C4.88741 12.0358 5.34881 11.9383 6.00391 11.8943C6.00568 11.6703 6.00663 11.4519 6.01074 11.239L6.04004 10.2146C6.17609 6.72035 8.5031 3.85718 12 3.85718L12.3242 3.86597ZM12 6.85718C10.5026 6.85718 9.12777 8.02866 9.03809 10.3308C9.01972 10.8024 9.00974 11.311 9.00488 11.8572H14.9951C14.9903 11.311 14.9803 10.8024 14.9619 10.3308C14.8722 8.02866 13.4974 6.85718 12 6.85718Z"/></svg>';
|
||||
|
||||
async function loadDocker() {
|
||||
try { dockerState = await api('/api/docker'); } catch (e) { dockerState = { enabled: true, connected: false, error: e.message }; }
|
||||
@@ -2872,7 +2872,7 @@ function tagRowHTML(tag) {
|
||||
${opt('enabled', t('optActive'), t('optActiveTitle'))}
|
||||
</div>
|
||||
<button class="icon-btn danger" type="button" data-del title="${esc(t('del'))}" aria-label="${esc(t('del'))}">
|
||||
<svg viewBox="0 0 24 24"><path d="M4 7h16M10 11v6M14 11v6M6 7l1 13h10l1-13M9 7V4h6v3"/></svg>
|
||||
<svg class="pi" viewBox="0 0 24 24"><path d="M14.876 10.2891C17.2815 10.2054 18.4841 10.1634 19.1094 10.876C19.7347 11.5886 19.5423 12.7465 19.1562 15.0625L18.835 16.9863C18.4359 19.3808 18.2367 20.5781 17.3975 21.2891C16.5582 22 15.3444 22 12.917 22H11.082C8.65486 22 7.44074 22 6.60156 21.2891C5.76256 20.5781 5.5631 19.3805 5.16406 16.9863L4.84375 15.0625C4.45778 12.7467 4.26459 11.5886 4.88965 10.876C5.51497 10.1633 6.71833 10.2054 9.12402 10.2891C10.0581 10.3216 11.0413 10.3428 12 10.3428C12.9587 10.3428 13.9418 10.3216 14.876 10.2891ZM8.5 12C7.94775 12 7.50001 12.4477 7.5 13V19C7.5 19.5523 7.94774 20 8.5 20C9.05215 19.9998 9.5 19.5522 9.5 19V13C9.49999 12.4478 9.05215 12.0002 8.5 12ZM12 12C11.4477 12 11 12.4477 11 13V19C11 19.5523 11.4477 20 12 20C12.5522 19.9998 13 19.5522 13 19V13C13 12.4478 12.5521 12.0002 12 12ZM15.5 12C14.9477 12 14.5 12.4477 14.5 13V19C14.5 19.5523 14.9477 20 15.5 20C16.0522 19.9998 16.5 19.5522 16.5 19V13C16.5 12.4478 16.0521 12.0002 15.5 12ZM12 2C13.2752 2 14.271 2.27648 14.9707 2.85449C15.6924 3.45088 15.9479 4.2418 15.9922 4.93652C16.0162 5.31286 15.9793 5.67654 15.9189 6H18.6494C19.3953 6.00014 19.9999 6.60474 20 7.35059C20 8.01305 19.5206 8.57368 18.8623 8.64746C17.5465 8.79493 15.1509 9 12 9C8.8491 9 6.4535 8.79493 5.1377 8.64746C4.47935 8.57368 4 8.01305 4 7.35059C4.00014 6.60474 4.60474 6.00014 5.35059 6H8.08105C8.02072 5.67654 7.98384 5.31286 8.00781 4.93652C8.05208 4.2418 8.30763 3.45088 9.0293 2.85449C9.729 2.27648 10.7248 2 12 2ZM12 4C10.9822 4 10.5121 4.22356 10.3037 4.39551C10.1178 4.54906 10.0234 4.75842 10.0039 5.06348C9.9847 5.36497 10.0475 5.70063 10.1367 6H13.8633C13.9525 5.70063 14.0153 5.36497 13.9961 5.06348C13.9766 4.75842 13.8822 4.54906 13.6963 4.39551C13.4879 4.22356 13.0178 4 12 4Z" /></svg>
|
||||
</button>
|
||||
<div class="err"></div>
|
||||
</div>`;
|
||||
|
||||
Reference in new issue
Block a user