mirror of
https://github.com/tcsenpai/obsidiangarden_netlify.git
synced 2025-06-04 12:00:02 +00:00
migrate to lucide from fontawesome
This commit is contained in:
parent
9343b198be
commit
393a6a3cf6
@ -21,12 +21,6 @@
|
||||
}
|
||||
});
|
||||
|
||||
lucide.createIcons({
|
||||
attrs: {
|
||||
class: ["svg-icon"]
|
||||
}
|
||||
});
|
||||
|
||||
// Collapse callouts
|
||||
Array.from(document.querySelectorAll(".callout.is-collapsible")).forEach((elem) => {
|
||||
elem.querySelector('.callout-title').addEventListener("click", (event) => {
|
||||
|
@ -3,14 +3,13 @@
|
||||
<div x-show="isOpen" style="display:none" class="{{'filelist' if step>0}}">
|
||||
{%if fileOrFolder.isNote %}
|
||||
<div @click.stop class="notelink {{ 'active-note' if fileOrFolder.permalink === permalink}}">
|
||||
{%- if not meta.noteIconsSettings.filetree -%}<i class="fa fa-sticky-note" aria-hidden="true"></i>{%- endif -%}
|
||||
<a data-note-icon="{{fileOrFolder.noteIcon}}" style="text-decoration: none;" class="filename" href="{{fileOrFolder.permalink}}">{{fileOrFolder.name}} </a>
|
||||
</div>
|
||||
{% elif fileOrFolder.isFolder%}
|
||||
<div class="folder inner-folder" x-data="{isOpen: $persist(false).as('{{currentPath}}')}" @click.stop="isOpen=!isOpen">
|
||||
<div class="foldername-wrapper">
|
||||
<i x-show="isOpen" style="display: none;" class="fa fa-caret-down"></i>
|
||||
<i x-show="!isOpen" class="fa fa-caret-right"></i>
|
||||
<i x-show="isOpen" style="display: none;" class="svg-icon" icon-name="chevron-down"></i>
|
||||
<i x-show="!isOpen" class="svg-icon" icon-name="chevron-right"></i>
|
||||
<span class="foldername">{{fileOrFolderName}}</span>
|
||||
</div>
|
||||
{% for fileOrFolderName, child in fileOrFolder %}
|
||||
|
@ -1,6 +1,6 @@
|
||||
<nav class="navbar">
|
||||
<div class="navbar-inner">
|
||||
<i style="font-size: 1.5rem; margin-right: 10px;" @click="showFilesMobile=!showFilesMobile" class="fa fa-bars"></i>
|
||||
<span style="font-size: 1.5rem; margin-right: 10px;" @click="showFilesMobile=!showFilesMobile"><i class="svg-icon" icon-name="menu"></i></span>
|
||||
{% for imp in dynamics.filetree.beforeTitle %}
|
||||
{% include imp %}
|
||||
{% endfor %}
|
||||
|
@ -173,7 +173,12 @@
|
||||
g.id = 'full-graph';
|
||||
g.classList.add('show');
|
||||
document.body.appendChild(g);
|
||||
g.innerHTML = '<i class="fa fa-times" id="full-graph-close" aria-hidden="true"></i><div id="full-graph-container"></div>';
|
||||
g.innerHTML = '<span id="full-graph-close"><i icon-name="x" class="svg-icon" aria-hidden="true"></i></span><div id="full-graph-container"></div>';
|
||||
lucide.createIcons({
|
||||
attrs: {
|
||||
class: ["svg-icon"]
|
||||
}
|
||||
});
|
||||
window.fullGraph = renderGraph(graphData, "full-graph-container", 200);
|
||||
document.getElementById('full-graph-close').addEventListener('click', (evt) => {
|
||||
g.classList.remove('show');
|
||||
|
7
src/site/_includes/components/lucideIcons.njk
Normal file
7
src/site/_includes/components/lucideIcons.njk
Normal file
@ -0,0 +1,7 @@
|
||||
<script>
|
||||
lucide.createIcons({
|
||||
attrs: {
|
||||
class: ["svg-icon"]
|
||||
}
|
||||
});
|
||||
</script>
|
@ -16,7 +16,6 @@
|
||||
<script src="https://cdn.jsdelivr.net/npm/alpinejs@3.11.1/dist/cdn.min.js" defer></script>
|
||||
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.25.0/themes/prism-okaidia.min.css" integrity="sha512-mIs9kKbaw6JZFfSuo+MovjU+Ntggfoj8RwAmJbVXQ5mkAX5LlgETQEweFPI18humSPHymTb5iikEOKWF7I8ncQ==" crossorigin="anonymous" referrerpolicy="no-referrer"/>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
||||
<script src="https://cdn.jsdelivr.net/npm/whatwg-fetch@3.6.2/dist/fetch.umd.min.js" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
|
||||
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
|
||||
|
@ -1,6 +1,6 @@
|
||||
<div class="search-button" onclick="toggleSearch()">
|
||||
<span class="search-icon">
|
||||
<i class="fa fa-search"></i>
|
||||
<i icon-name="search" class="svg-icon"></i>
|
||||
</span>
|
||||
<span class="search-text">
|
||||
<span>Search</span>
|
||||
|
@ -8,8 +8,8 @@
|
||||
</div>
|
||||
|
||||
<div class="navigation-hint">
|
||||
<i class="fa fa-arrow-up" aria-hidden="true"></i>
|
||||
<i class="fa fa-arrow-down" aria-hidden="true"></i>
|
||||
<i class="svg-icon" icon-name="arrow-up" aria-hidden="true"></i>
|
||||
<i class="svg-icon" icon-name="arrow-down" aria-hidden="true"></i>
|
||||
<span>to navigate</span>
|
||||
</div>
|
||||
|
||||
|
@ -22,8 +22,8 @@
|
||||
<span id="depth-display"></span>
|
||||
</div>
|
||||
<div class="ctrl-right">
|
||||
<i class="fa fa-globe" id="global-graph-btn" aria-hidden="true"></i>
|
||||
<i class="fa fa-arrows-alt" id="graph-fs-btn" aria-hidden="true"></i>
|
||||
<span id="global-graph-btn"><i class="svg-icon" icon-name="globe" aria-hidden="true"></i></span>
|
||||
<span id="graph-fs-btn"><i class="svg-icon" icon-name="expand" aria-hidden="true"></i></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -62,7 +62,7 @@
|
||||
{%- for backlink in graph.nodes[graph.homeAlias].backLinks -%}
|
||||
{%- if graph.nodes[backlink].url != graph.homeAlias -%}
|
||||
<div class="backlink-card">
|
||||
<i class="fa fa-link"></i> <a href="{{graph.nodes[backlink].url}}">{{graph.nodes[backlink].title}}</a>
|
||||
<i class="svg-icon" icon-name="link"></i> <a href="{{graph.nodes[backlink].url}}">{{graph.nodes[backlink].title}}</a>
|
||||
</div>
|
||||
{%- endif -%}
|
||||
{%- endfor -%}
|
||||
@ -75,7 +75,7 @@
|
||||
{%- for backlink in graph.nodes[page.url].backLinks -%}
|
||||
{%- if graph.nodes[backlink].url != page.url -%}
|
||||
<div class="backlink-card">
|
||||
<i class="fa fa-link"></i> <a href="{{graph.nodes[backlink].url}}">{{graph.nodes[backlink].title}}</a>
|
||||
<i class="svg-icon" icon-name="link"></i> <a href="{{graph.nodes[backlink].url}}">{{graph.nodes[backlink].title}}</a>
|
||||
</div>
|
||||
{%- endif -%}
|
||||
{%- endfor -%}
|
||||
|
@ -74,5 +74,6 @@
|
||||
{% for imp in dynamics.index.footer %}
|
||||
{% include imp %}
|
||||
{% endfor %}
|
||||
{%include "components/lucideIcons.njk"%}
|
||||
</body>
|
||||
</html>
|
||||
|
@ -80,5 +80,6 @@ permalink: "notes/{{ page.fileSlug | slugify }}/"
|
||||
{% for imp in dynamics.notes.footer %}
|
||||
{% include imp %}
|
||||
{% endfor %}
|
||||
{%include "components/lucideIcons.njk"%}
|
||||
</body>
|
||||
</html>
|
||||
|
@ -523,6 +523,10 @@ ul.task-list {
|
||||
&:hover {
|
||||
border: 1px solid var(--text-accent);
|
||||
}
|
||||
|
||||
.search-icon {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
.search-keys {
|
||||
|
Loading…
x
Reference in New Issue
Block a user