Prefer icons from modrinth/assets (#3394)

Replaced all icon usages of `apps/frontend/src/assets/image/utils` for `@modrinth/assets`.

The only icon which has been changed is the `WorldIcon`, which has been replaced by the `GlobeIcon`.

apps/frontend/src/pages/organization/[id].vue

@@ -76,7 +76,8 @@
           </template>
           <template #title-suffix>
             <div class="ml-1 flex items-center gap-2 font-semibold">
-              <OrganizationIcon /> Organization
+              <OrganizationIcon />
+              Organization
             </div>
           </template>
           <template #summary>
@@ -177,10 +178,12 @@
           <p>You have been invited to join {{ organization.name }}.</p>
           <div class="input-group">
             <button class="iconified-button brand-button" @click="onAcceptInvite">
-              <CheckIcon />Accept
+              <CheckIcon />
+              Accept
             </button>
             <button class="iconified-button danger-button" @click="onDeclineInvite">
-              <XIcon />Decline
+              <XIcon />
+              Decline
             </button>
           </div>
         </div>
@@ -227,7 +230,8 @@
         </template>
 
         <div v-else-if="true" class="error">
-          <UpToDate class="icon" /><br />
+          <UpToDate class="icon" />
+          <br />
           <span class="preserve-lines text">
             This organization doesn't have any projects yet.
             <template v-if="isPermission(currentMember?.organization_permissions, 1 << 4)">
@@ -251,6 +255,9 @@ import {
   CheckIcon,
   XIcon,
   ClipboardCopyIcon,
+  OrganizationIcon,
+  DownloadIcon,
+  CrownIcon,
 } from "@modrinth/assets";
 import {
   Avatar,
@@ -266,10 +273,6 @@ import ModalCreation from "~/components/ui/ModalCreation.vue";
 import UpToDate from "~/assets/images/illustrations/up_to_date.svg?component";
 import ProjectCard from "~/components/ui/ProjectCard.vue";
 import AdPlaceholder from "~/components/ui/AdPlaceholder.vue";
-
-import OrganizationIcon from "~/assets/images/utils/organization.svg?component";
-import DownloadIcon from "~/assets/images/utils/download.svg?component";
-import CrownIcon from "~/assets/images/utils/crown.svg?component";
 import { acceptTeamInvite, removeTeamMember } from "~/helpers/teams.js";
 import NavTabs from "~/components/ui/NavTabs.vue";
 
@@ -535,9 +538,11 @@ async function copyId() {
   display: flex;
   flex-direction: column;
   padding: var(--gap-xl);
+
   h3 {
     margin: 0 0 var(--gap-sm);
   }
+
   .creator {
     display: grid;
     gap: var(--gap-xs);
@@ -549,9 +554,11 @@ async function copyId() {
       "avatar name" auto
       "avatar role" auto
       / auto 1fr;
+
     p {
       margin: 0;
     }
+
     .name {
       grid-area: name;
       align-self: flex-end;
@@ -619,9 +626,11 @@ async function copyId() {
   display: flex;
   justify-content: space-between;
   align-items: center;
+
   h3 {
     margin: 0;
   }
+
   a {
     display: flex;
     align-items: center;
@@ -629,25 +638,30 @@ async function copyId() {
     color: var(--color-blue);
   }
 }
+
 .project-overview {
   gap: var(--gap-md);
   padding: var(--gap-xl);
+
   .project-card {
     padding: 0;
     border-radius: 0;
     background-color: transparent;
     box-shadow: none;
+
     :deep(.title) {
       font-size: var(--font-size-nm) !important;
     }
   }
 }
+
 .popout-heading {
   padding: var(--gap-sm) var(--gap-md);
   margin: 0;
   font-size: var(--font-size-md);
   color: var(--color-text);
 }
+
 .popout-checkbox {
   padding: var(--gap-sm) var(--gap-md);
 }

apps/frontend/src/pages/organization/[id]/settings/members.vue

@@ -225,11 +225,10 @@ import {
   UserPlusIcon,
   UserXIcon as UserRemoveIcon,
   DropdownIcon,
+  CrownIcon,
 } from "@modrinth/assets";
 import { Button, Badge, Avatar, Checkbox } from "@modrinth/ui";
 import { ref } from "vue";
-import CrownIcon from "~/assets/images/utils/crown.svg?component";
-
 import { removeTeamMember } from "~/helpers/teams.js";
 import { isPermission } from "~/utils/permissions.ts";
 
@@ -363,8 +362,10 @@ const onTransferOwnership = useClientTry(async (teamId, uid) => {
   .member-header {
     display: flex;
     justify-content: space-between;
+
     .info {
       display: flex;
+
       .text {
         margin: auto 0 auto 0.5rem;
         font-size: var(--font-size-sm);
@@ -386,24 +387,30 @@ const onTransferOwnership = useClientTry(async (teamId, uid) => {
         }
       }
     }
+
     .side-buttons {
       display: flex;
       align-items: center;
+
       .dropdown-icon {
         margin-left: 1rem;
+
         svg {
           transition: 150ms ease transform;
         }
       }
     }
   }
+
   .content {
     display: none;
     flex-direction: column;
     padding-top: var(--gap-md);
+
     .main-info {
       margin-bottom: var(--gap-lg);
     }
+
     .permissions {
       margin-bottom: var(--gap-md);
       max-width: 45rem;
@@ -412,17 +419,20 @@ const onTransferOwnership = useClientTry(async (teamId, uid) => {
       grid-gap: 0.5rem;
     }
   }
+
   &.open {
     .member-header {
       .dropdown-icon svg {
         transform: rotate(180deg);
       }
     }
+
     .content {
       display: flex;
     }
   }
 }
+
 :deep(.checkbox-outer) {
   button.checkbox {
     border: none;