using svelte-fa and fontawesome-free-svg

This commit is contained in:
Fractal-Tess
2022-09-05 03:55:11 +03:00
parent 2bd217f926
commit d423d8acc5
3 changed files with 401 additions and 1433 deletions

View File

@@ -15,7 +15,10 @@
}, },
"devDependencies": { "devDependencies": {
"@fontsource/roboto": "^4.5.8", "@fontsource/roboto": "^4.5.8",
"@fortawesome/fontawesome-free": "^6.2.0", "@fortawesome/fontawesome-svg-core": "^6.2.0",
"@fortawesome/free-brands-svg-icons": "^6.2.0",
"@fortawesome/free-regular-svg-icons": "^6.2.0",
"@fortawesome/free-solid-svg-icons": "^6.2.0",
"@sveltejs/vite-plugin-svelte": "^1.0.4", "@sveltejs/vite-plugin-svelte": "^1.0.4",
"@tailwindcss/forms": "^0.5.3", "@tailwindcss/forms": "^0.5.3",
"@tailwindcss/typography": "^0.5.7", "@tailwindcss/typography": "^0.5.7",
@@ -31,6 +34,7 @@
"sass": "^1.54.8", "sass": "^1.54.8",
"svelte": "^3.50.0", "svelte": "^3.50.0",
"svelte-check": "^2.9.0", "svelte-check": "^2.9.0",
"svelte-fa": "^3.0.3",
"svelte-preprocess": "^4.10.7", "svelte-preprocess": "^4.10.7",
"tailwindcss": "^3.1.8", "tailwindcss": "^3.1.8",
"tauri-plugin-store-api": "github:tauri-apps/tauri-plugin-store#dev", "tauri-plugin-store-api": "github:tauri-apps/tauri-plugin-store#dev",

1813
pnpm-lock.yaml generated

File diff suppressed because it is too large Load Diff

View File

@@ -2,6 +2,9 @@
import ThemeToggleIcon from '$lib/components/ThemeToggleIcon.svelte'; import ThemeToggleIcon from '$lib/components/ThemeToggleIcon.svelte';
import { theme } from '$lib/stores/theme'; import { theme } from '$lib/stores/theme';
import { appWindow } from '@tauri-apps/api/window'; import { appWindow } from '@tauri-apps/api/window';
import { faXmark, faWindowMinimize } from '@fortawesome/free-solid-svg-icons';
import { faGithub } from '@fortawesome/free-brands-svg-icons';
import Fa from 'svelte-fa';
</script> </script>
<div <div
@@ -20,23 +23,23 @@
<a <a
target="_blank" target="_blank"
href="https://github.com/Fractal-Tess/Svelte-Tauri" href="https://github.com/Fractal-Tess/Svelte-Tauri"
class="hover:text-secondary" class="hover:text-secondary inline-block"
> >
<i class="fa-brands fa-github h-6" /> <Fa icon={faGithub} size="lg" />
</a> </a>
<button <button
on:click={appWindow.minimize} on:click={appWindow.minimize}
aria-live="polite" aria-live="polite"
class="p-2 text-xl hover:text-secondary h-full" class="p-2 text-xl hover:text-secondary"
> >
<i class="fa-solid fa-window-minimize w-6" /> <Fa icon={faWindowMinimize} />
</button> </button>
<button <button
on:click={appWindow.close} on:click={appWindow.close}
aria-live="polite" aria-live="polite"
class="p-2 text-2xl hover:text-secondary h-full" class="p-2 text-2xl hover:text-secondary"
> >
<i class="fa-solid fa-xmark w-6" /> <Fa icon={faXmark} />
</button> </button>
</div> </div>
</div> </div>