More monorepo migration fixes (#1257)

* fix: More monorepo migration fixes

* fix: Corrected icon sizes & other fixes

* fix(theseus): Change color of mod installation button

* fix(theseus): More Turborepo fixes

* chore: Prettier

---------

Co-authored-by: Geometrically <18202329+Geometrically@users.noreply.github.com>

apps/app-frontend/src/components/GridDisplay.vue

@@ -243,7 +243,7 @@ const filteredResults = computed(() => {
     <div class="iconified-input">
       <SearchIcon />
       <input v-model="search" type="text" placeholder="Search" class="search-input" />
-      <Button @click="() => (search = '')">
+      <Button class="r-btn" @click="() => (search = '')">
         <XIcon />
       </Button>
     </div>

apps/app-frontend/src/components/ui/AddContentButton.vue

@@ -0,0 +1,64 @@
+<script setup lang="ts">
+import { DropdownIcon, FolderOpenIcon, SearchIcon } from '@modrinth/assets'
+import { Button, OverflowMenu } from '@modrinth/ui'
+import { open } from '@tauri-apps/api/dialog'
+import { add_project_from_path, get } from '@/helpers/profile.js'
+import { handleError } from '@/store/notifications.js'
+import { useRouter } from 'vue-router'
+
+const props = defineProps({
+  instance: {
+    type: Object,
+    required: true,
+  },
+})
+
+const router = useRouter()
+
+const handleAddContentFromFile = async () => {
+  const newProject = await open({ multiple: true })
+  if (!newProject) return
+
+  for (const project of newProject) {
+    await add_project_from_path(props.instance.path, project, 'mod').catch(handleError)
+  }
+  props.instance.initProjects(await get(props.instance.path).catch(handleError))
+}
+
+const handleSearchContent = async () => {
+  await router.push({
+    path: `/browse/${props.instance.metadata.loader === 'vanilla' ? 'datapack' : 'mod'}`,
+    query: { i: props.instance.path },
+  })
+}
+</script>
+
+<template>
+  <div class="joined-buttons">
+    <Button color="primary" @click="handleSearchContent"><SearchIcon /> Add content </Button>
+
+    <OverflowMenu
+      :options="[
+        {
+          id: 'search',
+          action: () => handleSearchContent,
+        },
+        {
+          id: 'from_file',
+          action: () => handleAddContentFromFile,
+        },
+      ]"
+      class="btn btn-primary btn-dropdown-animation icon-only"
+    >
+      <DropdownIcon />
+      <template #search>
+        <SearchIcon />
+        <span class="no-wrap"> Search </span>
+      </template>
+      <template #from_file>
+        <FolderOpenIcon />
+        <span class="no-wrap"> Add from file </span>
+      </template>
+    </OverflowMenu>
+  </div>
+</template>

apps/app-frontend/src/components/ui/ExportModal.vue

@@ -113,7 +113,7 @@ const exportPack = async () => {
         <div class="iconified-input">
           <PackageIcon />
           <input v-model="nameInput" type="text" placeholder="Modpack name" class="input" />
-          <Button @click="nameInput = ''">
+          <Button class="r-btn" @click="nameInput = ''">
             <XIcon />
           </Button>
         </div>
@@ -123,7 +123,7 @@ const exportPack = async () => {
         <div class="iconified-input">
           <VersionIcon />
           <input v-model="versionInput" type="text" placeholder="1.0.0" class="input" />
-          <Button @click="versionInput = ''">
+          <Button class="r-btn" @click="versionInput = ''">
             <XIcon />
           </Button>
         </div>

apps/app-frontend/src/components/ui/InstanceCreationModal.vue

@@ -110,7 +110,7 @@
               placeholder="Path to launcher"
               @change="setPath"
             />
-            <Button @click="() => (selectedLauncherPath = '')">
+            <Button class="r-btn" @click="() => (selectedLauncherPath = '')">
               <XIcon />
             </Button>
           </div>

apps/app-frontend/src/components/ui/ModInstallModal.vue

@@ -228,7 +228,7 @@ const check_valid = computed(() => {
       <div class="profiles" :class="{ 'hide-creation': !showCreation }">
         <div v-for="profile in profiles" :key="profile.metadata.name" class="option">
           <Button
-            color="raised"
+            transparent
             class="profile-button"
             @click="$router.push(`/instance/${encodeURIComponent(profile.path)}`)"
           >

apps/app-frontend/src/components/ui/RunningAppBar.vue

@@ -335,8 +335,12 @@ onBeforeUnmount(() => {
   width: 1.25rem !important;
   height: 1.25rem !important;
 
+  svg {
+    min-width: 1.25rem;
+  }
+
   &.stop {
-    --text-color: var(--color-red) !important;
+    color: var(--color-red);
   }
 }