diff --git a/apps/app-frontend/package.json b/apps/app-frontend/package.json index 4a6eef78..48698194 100644 --- a/apps/app-frontend/package.json +++ b/apps/app-frontend/package.json @@ -25,7 +25,7 @@ "vue": "^3.4.21", "vue-multiselect": "3.0.0-beta.3", "vue-router": "4.3.0", - "vue-virtual-scroller": "2.0.0-beta.8" + "vue-typed-virtual-list": "^1.0.10" }, "devDependencies": { "@tauri-apps/cli": "^1.5.11", diff --git a/apps/app-frontend/src/assets/stylesheets/global.scss b/apps/app-frontend/src/assets/stylesheets/global.scss index 9b04b4ef..e907894b 100644 --- a/apps/app-frontend/src/assets/stylesheets/global.scss +++ b/apps/app-frontend/src/assets/stylesheets/global.scss @@ -100,13 +100,13 @@ input { * { scrollbar-width: auto; - scrollbar-color: var(--color-button-bg) var(--color-bg); + scrollbar-color: var(--color-scrollbar) var(--color-bg); } /* Chrome, Edge, and Safari */ *::-webkit-scrollbar { width: var(--gap-md); - border: 3px solid var(--color-bg); + border: 3px solid var(--color-scrollbar); } *::-webkit-scrollbar-track { @@ -115,7 +115,7 @@ input { } *::-webkit-scrollbar-thumb { - background-color: var(--color-button-bg); + background-color: var(--color-scrollbar); border-radius: var(--radius-lg); border: 3px solid var(--color-bg); } diff --git a/apps/app-frontend/src/components/ui/ExportModal.vue b/apps/app-frontend/src/components/ui/ExportModal.vue index 93903066..eaa256e6 100644 --- a/apps/app-frontend/src/components/ui/ExportModal.vue +++ b/apps/app-frontend/src/components/ui/ExportModal.vue @@ -50,9 +50,9 @@ const initFiles = async () => { disabled: folder === 'profile.json' || folder.startsWith('modrinth_logs') || - folder.startsWith('.fabric') || - folder.includes('.DS_Store'), + folder.startsWith('.fabric'), })) + .filter((pathData) => !pathData.path.includes('.DS_Store')) .forEach((pathData) => { const parent = pathData.path.split(sep).slice(0, -1).join(sep) if (parent !== '') { diff --git a/apps/app-frontend/src/components/ui/tutorial/ModrinthLoginScreen.vue b/apps/app-frontend/src/components/ui/tutorial/ModrinthLoginScreen.vue index f09b4317..93bdebbe 100644 --- a/apps/app-frontend/src/components/ui/tutorial/ModrinthLoginScreen.vue +++ b/apps/app-frontend/src/components/ui/tutorial/ModrinthLoginScreen.vue @@ -318,9 +318,7 @@ onMounted(() => { } } -:deep { - .checkbox { - border: none; - } +:deep(.checkbox) { + border: none; } diff --git a/apps/app-frontend/src/main.js b/apps/app-frontend/src/main.js index 0d55138f..8d387683 100644 --- a/apps/app-frontend/src/main.js +++ b/apps/app-frontend/src/main.js @@ -4,8 +4,8 @@ import App from '@/App.vue' import { createPinia } from 'pinia' import '@modrinth/assets/omorphia.scss' import '@/assets/stylesheets/global.scss' -import 'floating-vue/dist/style.css' import FloatingVue from 'floating-vue' +import 'floating-vue/dist/style.css' import { get_opening_command, initialize_state } from '@/helpers/state' import loadCssMixin from './mixins/macCssFix.js' import { get } from '@/helpers/settings' diff --git a/apps/app-frontend/src/pages/Browse.vue b/apps/app-frontend/src/pages/Browse.vue index f30b8bd9..57121fe2 100644 --- a/apps/app-frontend/src/pages/Browse.vue +++ b/apps/app-frontend/src/pages/Browse.vue @@ -488,6 +488,14 @@ const [categories, loaders, availableGameVersions] = await Promise.all([ refreshSearch(), ]) +const filteredLoaders = computed(() => { + return loaders.value.filter((loader) => { + return projectType.value === 'mod' || projectType.value === 'modpack' + ? loader.supported_project_types[0] === 'mod' + : loader.supported_project_types[0] === projectType.value + }) +}) + const selectableProjectTypes = computed(() => { const values = [ { label: 'Shaders', href: `/browse/shader` }, @@ -518,14 +526,8 @@ const selectableProjectTypes = computed(() => { const showVersions = computed( () => instanceContext.value === null || ignoreInstanceGameVersions.value, ) -const showLoaders = computed( - () => - (projectType.value !== 'datapack' && - projectType.value !== 'resourcepack' && - projectType.value !== 'shader' && - instanceContext.value === null) || - ignoreInstanceLoaders.value, -) + +const isModProject = computed(() => ['modpack', 'mod'].includes(projectType.value)) onUnmounted(() => unlistenOffline()) @@ -596,17 +598,9 @@ onUnmounted(() => unlistenOffline()) > Clear filters -
+

Loaders

-
+
unlistenOffline()) />
-
+

Environments

- -
- {{ - item.prefix - }} - {{ item.text }} -
- + +
@@ -104,13 +104,13 @@ import { useRoute } from 'vue-router' import { process_listener } from '@/helpers/events.js' import { handleError } from '@/store/notifications.js' import { ofetch } from 'ofetch' - -import { RecycleScroller } from 'vue-virtual-scroller' -import 'vue-virtual-scroller/dist/vue-virtual-scroller.css' +import { createVirtualScroller } from 'vue-typed-virtual-list' dayjs.extend(isToday) dayjs.extend(isYesterday) +const VirtualScroller = createVirtualScroller() + const route = useRoute() const props = defineProps({ @@ -412,15 +412,20 @@ function handleUserScroll() { interval.value = setInterval(async () => { if (logs.value.length > 0) { logs.value[0] = await getLiveStdLog() + const logContainerElement = logContainer.value.$el + const scroll = + logContainerElement.scrollHeight - + logContainerElement.scrollTop - + logContainerElement.clientHeight + // const scroll = logContainer.value.$el.scrollHeight - logContainer.value.$el.scrollTop - logContainer.value.$el.clientHeight - const scroll = logContainer.value.getScroll() // Allow resetting of userScrolled if the user scrolls to the bottom if (selectedLogIndex.value === 0) { - if (scroll.end >= logContainer.value.$el.scrollHeight - 10) userScrolled.value = false + if (scroll <= 10) userScrolled.value = false if (!userScrolled.value) { await nextTick() isAutoScrolling.value = true - logContainer.value.scrollToItem(displayProcessedLogs.value.length - 1) + logContainer.value.scrollTo(displayProcessedLogs.value.length - 1) setTimeout(() => (isAutoScrolling.value = false), 50) } } @@ -489,10 +494,6 @@ onUnmounted(() => { white-space: nowrap; /* Keeps content on a single line */ white-space: normal; color-scheme: dark; - - .no-wrap { - white-space: pre; - } } .filter-checkbox { diff --git a/apps/app-frontend/src/pages/instance/Mods.vue b/apps/app-frontend/src/pages/instance/Mods.vue index 5b11d866..5659e781 100644 --- a/apps/app-frontend/src/pages/instance/Mods.vue +++ b/apps/app-frontend/src/pages/instance/Mods.vue @@ -322,6 +322,7 @@ ref="shareModal" share-title="Sharing modpack content" share-text="Check out the projects I'm using in my modpack!" + :open-in-new-tab="false" /> { } } +