fix: remove external dependency for icones (#805)

* change all icons to use iconify

* fix minor UI elements

* fix layout of table
This commit is contained in:
Hayden 2024-02-29 19:20:18 -06:00 committed by GitHub
parent cf166ac641
commit f91b33db38
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
40 changed files with 303 additions and 183 deletions

View file

@ -17,7 +17,7 @@
<!-- Button -->
<div class="navbar z-[99] lg:hidden top-0 fixed bg-primary shadow-md drawer-button">
<label for="my-drawer-2" class="btn btn-square btn-ghost text-base-100 drawer-button lg:hidden">
<Icon name="mdi-menu" class="h-6 w-6" />
<MdiMenu class="h-6 w-6" />
</label>
<NuxtLink to="/home">
<h2 class="text-3xl font-bold tracking-tight text-base-100 flex">
@ -51,7 +51,7 @@
<div class="dropdown overflow visible w-40">
<label tabindex="0" class="btn btn-primary btn-block text-lg text-no-transform">
<span>
<Icon name="mdi-plus" class="mr-1 -ml-1" />
<MdiPlus class="mr-1 -ml-1" />
</span>
Create
</label>
@ -74,7 +74,7 @@
'bg-secondary text-secondary-content': n.active?.value,
}"
>
<Icon :name="n.icon" class="h-6 w-6 mr-4" />
<component :is="n.icon" class="h-6 w-6 mr-4" />
{{ n.name }}
</NuxtLink>
</li>
@ -93,6 +93,14 @@
<script lang="ts" setup>
import { useLabelStore } from "~~/stores/labels";
import { useLocationStore } from "~~/stores/locations";
import MdiMenu from "~icons/mdi/menu";
import MdiPlus from "~icons/mdi/plus";
import MdiHome from "~icons/mdi/home";
import MdiFileTree from "~icons/mdi/file-tree";
import MdiMagnify from "~icons/mdi/magnify";
import MdiAccount from "~icons/mdi/account";
import MdiCog from "~icons/mdi/cog";
const username = computed(() => authCtx.user?.name || "User");
@ -138,35 +146,35 @@
const nav = [
{
icon: "mdi-home",
icon: MdiHome,
active: computed(() => route.path === "/home"),
id: 0,
name: "Home",
to: "/home",
},
{
icon: "mdi-file-tree",
icon: MdiFileTree,
id: 4,
active: computed(() => route.path === "/locations"),
name: "Locations",
to: "/locations",
},
{
icon: "mdi-magnify",
icon: MdiMagnify,
id: 3,
active: computed(() => route.path === "/items"),
name: "Search",
to: "/items",
},
{
icon: "mdi-account",
icon: MdiAccount,
id: 1,
active: computed(() => route.path === "/profile"),
name: "Profile",
to: "/profile",
},
{
icon: "mdi-cog",
icon: MdiCog,
id: 6,
active: computed(() => route.path === "/tools"),
name: "Tools",