diff --git a/src/views/Favorites/FavoritesAvatar.vue b/src/views/Favorites/FavoritesAvatar.vue index 6c10f86c..12328693 100644 --- a/src/views/Favorites/FavoritesAvatar.vue +++ b/src/views/Favorites/FavoritesAvatar.vue @@ -684,6 +684,10 @@ const hasUserSelectedAvatarGroup = ref(false); const remoteAvatarGroupsResolved = ref(false); + /** + * + * @param value + */ function handleSortFavoritesChange(value) { const next = Boolean(value); if (next !== sortFavorites.value) { @@ -706,11 +710,17 @@ avatarToolbarMenuOpen.value = false; }; + /** + * + */ function handleAvatarImportClick() { closeAvatarToolbarMenu(); showAvatarImportDialog(); } + /** + * + */ function handleAvatarExportClick() { closeAvatarToolbarMenu(); showAvatarExportDialog(); @@ -720,6 +730,9 @@ loadAvatarSplitterPreferences(); }); + /** + * + */ async function loadAvatarSplitterPreferences() { const storedSize = await configRepository.getString('VRCX_FavoritesAvatarSplitter', '260'); const parsedSize = Number(storedSize); @@ -921,6 +934,11 @@ } ); + /** + * + * @param key + * @param visible + */ function handleGroupMenuVisible(key, visible) { if (visible) { activeGroupMenu.value = key; @@ -931,6 +949,9 @@ } } + /** + * + */ function ensureSelectedGroup() { if (selectedGroup.value && isGroupAvailable(selectedGroup.value)) { return; @@ -938,6 +959,9 @@ selectDefaultGroup(); } + /** + * + */ function selectDefaultGroup() { if (!hasUserSelectedAvatarGroup.value) { const remote = @@ -967,6 +991,10 @@ clearSelectedAvatars(); } + /** + * + * @param group + */ function isGroupAvailable(group) { if (!group) { return false; @@ -986,6 +1014,12 @@ return false; } + /** + * + * @param type + * @param key + * @param options + */ function selectGroup(type, key, options = {}) { if (selectedGroup.value?.type === type && selectedGroup.value?.key === key) { return; @@ -997,14 +1031,27 @@ clearSelectedAvatars(); } + /** + * + */ function clearSelectedAvatars() { selectedFavoriteAvatars.value = []; } + /** + * + * @param type + * @param key + */ function isGroupActive(type, key) { return selectedGroup.value?.type === type && selectedGroup.value?.key === key; } + /** + * + * @param type + * @param key + */ function handleGroupClick(type, key) { if (hasSearchInput.value) { avatarFavoriteSearch.value = ''; @@ -1013,6 +1060,9 @@ selectGroup(type, key, { userInitiated: true }); } + /** + * + */ function startLocalGroupCreation() { if (!isLocalUserVrcPlusSupporter.value || isCreatingLocalGroup.value) { return; @@ -1024,11 +1074,17 @@ }); } + /** + * + */ function cancelLocalGroupCreation() { isCreatingLocalGroup.value = false; newLocalGroupName.value = ''; } + /** + * + */ function handleLocalGroupCreationConfirm() { const name = newLocalGroupName.value.trim(); if (!name) { @@ -1044,6 +1100,11 @@ }); } + /** + * + * @param id + * @param value + */ function toggleAvatarSelection(id, value) { if (value) { if (!selectedFavoriteAvatars.value.includes(id)) { @@ -1054,40 +1115,71 @@ } } + /** + * + */ function showAvatarExportDialog() { avatarExportDialogVisible.value = true; } + /** + * + */ function handleRefreshFavorites() { refreshFavorites(); getLocalAvatarFavorites(); } + /** + * + * @param group + * @param visibility + */ function handleVisibilitySelection(group, visibility) { const menuKey = remoteGroupMenuKey(group.key); changeAvatarGroupVisibility(group.name, visibility, menuKey); } + /** + * + * @param group + */ function handleRemoteRename(group) { handleGroupMenuVisible(remoteGroupMenuKey(group.key), false); changeFavoriteGroupName(group); } + /** + * + * @param group + */ function handleRemoteClear(group) { handleGroupMenuVisible(remoteGroupMenuKey(group.key), false); clearFavoriteGroup(group); } + /** + * + * @param groupName + */ function handleLocalRename(groupName) { handleGroupMenuVisible(localGroupMenuKey(groupName), false); promptLocalAvatarFavoriteGroupRename(groupName); } + /** + * + * @param groupName + */ function handleLocalDelete(groupName) { handleGroupMenuVisible(localGroupMenuKey(groupName), false); promptLocalAvatarFavoriteGroupDelete(groupName); } + /** + * + * @param groupName + */ async function handleCheckInvalidAvatars(groupName) { handleGroupMenuVisible(localGroupMenuKey(groupName), false); @@ -1178,11 +1270,18 @@ } } + /** + * + */ function handleHistoryClear() { handleGroupMenuVisible(historyGroupMenuKey, false); promptClearAvatarHistory(); } + /** + * + * @param group + */ function changeFavoriteGroupName(group) { const currentName = group.displayName || group.name; modalStore @@ -1221,6 +1320,12 @@ .catch(() => {}); } + /** + * + * @param name + * @param visibility + * @param menuKey + */ function changeAvatarGroupVisibility(name, visibility, menuKey = null) { const params = { type: 'avatar', @@ -1243,6 +1348,10 @@ }); } + /** + * + * @param ctx + */ function clearFavoriteGroup(ctx) { modalStore .confirm({ @@ -1260,6 +1369,10 @@ .catch(() => {}); } + /** + * + * @param group + */ function promptLocalAvatarFavoriteGroupRename(group) { modalStore .prompt({ @@ -1285,6 +1398,10 @@ .catch(() => {}); } + /** + * + * @param group + */ function promptLocalAvatarFavoriteGroupDelete(group) { modalStore .confirm({ @@ -1299,6 +1416,10 @@ .catch(() => {}); } + /** + * + * @param value + */ function doSearchAvatarFavorites(value) { if (typeof value === 'string') { avatarFavoriteSearch.value = value; @@ -1353,6 +1474,9 @@ } const searchAvatarFavorites = debounce(doSearchAvatarFavorites, 200); + /** + * + */ async function refreshLocalAvatarFavorites() { if (refreshingLocalFavorites.value) { return; @@ -1399,6 +1523,9 @@ } } + /** + * + */ function cancelLocalAvatarRefresh() { if (!refreshingLocalFavorites.value) { return; @@ -1416,6 +1543,9 @@ refreshingLocalFavorites.value = false; } + /** + * + */ function toggleSelectAllAvatars() { if (!activeRemoteGroup.value) { return; @@ -1427,6 +1557,9 @@ } } + /** + * + */ function copySelectedAvatars() { if (!selectedFavoriteAvatars.value.length) { return; @@ -1436,6 +1569,9 @@ showAvatarImportDialog(); } + /** + * + */ function showAvatarBulkUnfavoriteSelectionConfirm() { if (!selectedFavoriteAvatars.value.length) { return; @@ -1455,6 +1591,10 @@ .catch(() => {}); } + /** + * + * @param ids + */ function bulkUnfavoriteSelectedAvatars(ids) { ids.forEach((id) => { favoriteRequest.deleteFavorite({ @@ -1473,6 +1613,10 @@ } }); + /** + * + * @param value + */ function formatVisibility(value) { if (!value) { return ''; @@ -1568,15 +1712,14 @@ border: 1px solid var(--border); padding: 8px; cursor: pointer; - box-shadow: 0 0 6px rgba(15, 23, 42, 0.04); - transition: - box-shadow 0.2s ease, - transform 0.2s ease; + transition: background-color 0.15s ease; } .group-item:hover { - box-shadow: 0 2px 6px rgba(15, 23, 42, 0.07); - transform: translateY(-2px); + background-color: var(--accent); + box-shadow: + 0 4px 6px -1px rgb(0 0 0 / 0.1), + 0 2px 4px -2px rgb(0 0 0 / 0.1); } .group-item__top { @@ -1773,19 +1916,17 @@ border-radius: calc(8px * var(--favorites-card-scale, 1)); padding: var(--favorites-card-padding-y, 8px) var(--favorites-card-padding-x, 10px); cursor: pointer; - transition: - border-color 0.2s ease, - box-shadow 0.2s ease, - transform 0.2s ease; - box-shadow: 0 0 6px rgba(15, 23, 42, 0.04); + transition: background-color 0.15s ease; width: 100%; min-width: var(--favorites-card-min-width, 240px); max-width: var(--favorites-card-target-width, 320px); } :deep(.favorites-search-card:hover) { - box-shadow: 0 4px 14px rgba(15, 23, 42, 0.07); - transform: translateY(calc(-2px * var(--favorites-card-scale, 1))); + background-color: var(--accent); + box-shadow: + 0 4px 6px -1px rgb(0 0 0 / 0.1), + 0 2px 4px -2px rgb(0 0 0 / 0.1); } :deep(.favorites-search-card__content) { diff --git a/src/views/Favorites/FavoritesFriend.vue b/src/views/Favorites/FavoritesFriend.vue index 3f240106..65d73b98 100644 --- a/src/views/Favorites/FavoritesFriend.vue +++ b/src/views/Favorites/FavoritesFriend.vue @@ -1352,15 +1352,14 @@ border: 1px solid var(--border); padding: 8px; cursor: pointer; - box-shadow: 0 0 6px rgba(15, 23, 42, 0.04); - transition: - box-shadow 0.2s ease, - transform 0.2s ease; + transition: background-color 0.15s ease; } .group-item:hover { - box-shadow: 0 2px 6px rgba(15, 23, 42, 0.07); - transform: translateY(-2px); + background-color: var(--accent); + box-shadow: + 0 4px 6px -1px rgb(0 0 0 / 0.1), + 0 2px 4px -2px rgb(0 0 0 / 0.1); } .group-item__top { @@ -1544,19 +1543,17 @@ border-radius: calc(8px * var(--favorites-card-scale, 1)); padding: var(--favorites-card-padding-y, 8px) var(--favorites-card-padding-x, 10px); cursor: pointer; - transition: - border-color 0.2s ease, - box-shadow 0.2s ease, - transform 0.2s ease; - box-shadow: 0 0 6px rgba(15, 23, 42, 0.04); + transition: background-color 0.15s ease; width: 100%; min-width: var(--favorites-card-min-width, 240px); max-width: var(--favorites-card-target-width, 320px); } :deep(.favorites-search-card:hover) { - box-shadow: 0 4px 14px rgba(15, 23, 42, 0.07); - transform: translateY(calc(-2px * var(--favorites-card-scale, 1))); + background-color: var(--accent); + box-shadow: + 0 4px 6px -1px rgb(0 0 0 / 0.1), + 0 2px 4px -2px rgb(0 0 0 / 0.1); } :deep(.favorites-search-card.is-selected) { diff --git a/src/views/Favorites/FavoritesWorld.vue b/src/views/Favorites/FavoritesWorld.vue index 464ad04b..58ee3c92 100644 --- a/src/views/Favorites/FavoritesWorld.vue +++ b/src/views/Favorites/FavoritesWorld.vue @@ -621,11 +621,17 @@ worldToolbarMenuOpen.value = false; }; + /** + * + */ function handleWorldImportClick() { closeWorldToolbarMenu(); showWorldImportDialog(); } + /** + * + */ function handleWorldExportClick() { closeWorldToolbarMenu(); showExportDialog(); @@ -635,6 +641,9 @@ loadWorldSplitterPreferences(); }); + /** + * + */ async function loadWorldSplitterPreferences() { const storedSize = await configRepository.getString('VRCX_FavoritesWorldSplitter', '260'); const parsedSize = Number(storedSize); @@ -889,6 +898,10 @@ const getLocalRowItems = (row) => (row && Array.isArray(row.items) ? row.items : []); + /** + * + * @param value + */ function handleSortFavoritesChange(value) { const next = Boolean(value); if (next !== sortFavorites.value) { @@ -946,6 +959,11 @@ onMounted(() => {}); + /** + * + * @param key + * @param visible + */ function handleGroupMenuVisible(key, visible) { if (visible) { activeGroupMenu.value = key; @@ -956,6 +974,9 @@ } } + /** + * + */ function ensureSelectedGroup() { if (selectedGroup.value && isGroupAvailable(selectedGroup.value)) { return; @@ -963,6 +984,11 @@ selectDefaultGroup(); } + /** + * + * @param type + * @param key + */ function handleGroupClick(type, key) { if (hasSearchInput.value) { worldFavoriteSearch.value = ''; @@ -971,6 +997,9 @@ selectGroup(type, key, { userInitiated: true }); } + /** + * + */ function selectDefaultGroup() { if (!hasUserSelectedWorldGroup.value) { const remoteKey = favoriteWorldGroups.value[0]?.key || worldGroupPlaceholders[0]?.key || null; @@ -991,6 +1020,10 @@ clearSelectedWorlds(); } + /** + * + * @param group + */ function isGroupAvailable(group) { if (!group) { return false; @@ -1007,6 +1040,12 @@ return false; } + /** + * + * @param type + * @param key + * @param options + */ function selectGroup(type, key, options = {}) { if (selectedGroup.value?.type === type && selectedGroup.value?.key === key) { return; @@ -1018,10 +1057,19 @@ clearSelectedWorlds(); } + /** + * + * @param type + * @param key + */ function isGroupActive(type, key) { return selectedGroup.value?.type === type && selectedGroup.value?.key === key; } + /** + * + * @param value + */ function formatVisibility(value) { if (!value) { return ''; @@ -1029,6 +1077,9 @@ return value.charAt(0).toUpperCase() + value.slice(1); } + /** + * + */ function startLocalGroupCreation() { if (isCreatingLocalGroup.value) { return; @@ -1040,11 +1091,17 @@ }); } + /** + * + */ function cancelLocalGroupCreation() { isCreatingLocalGroup.value = false; newLocalGroupName.value = ''; } + /** + * + */ function handleLocalGroupCreationConfirm() { const name = newLocalGroupName.value.trim(); if (!name) { @@ -1058,6 +1115,11 @@ }); } + /** + * + * @param id + * @param value + */ function toggleWorldSelection(id, value) { if (value) { if (!selectedFavoriteWorlds.value.includes(id)) { @@ -1068,10 +1130,16 @@ } } + /** + * + */ function clearSelectedWorlds() { selectedFavoriteWorlds.value = []; } + /** + * + */ function toggleSelectAllWorlds() { if (!activeRemoteGroup.value) { return; @@ -1083,6 +1151,9 @@ } } + /** + * + */ function copySelectedWorlds() { if (!selectedFavoriteWorlds.value.length) { return; @@ -1092,6 +1163,9 @@ showWorldImportDialog(); } + /** + * + */ function showWorldBulkUnfavoriteSelectionConfirm() { if (!selectedFavoriteWorlds.value.length) { return; @@ -1111,6 +1185,10 @@ .catch(() => {}); } + /** + * + * @param ids + */ function bulkUnfavoriteSelectedWorlds(ids) { ids.forEach((id) => { favoriteRequest.deleteFavorite({ @@ -1121,15 +1199,27 @@ worldEditMode.value = false; } + /** + * + */ function showExportDialog() { worldExportDialogVisible.value = true; } + /** + * + */ function handleRefreshFavorites() { refreshFavorites(); getLocalWorldFavorites(); } + /** + * + * @param group + * @param visibility + * @param menuKey + */ function changeWorldGroupVisibility(group, visibility, menuKey = null) { const params = { type: group.type, @@ -1152,6 +1242,10 @@ }); } + /** + * + * @param group + */ function promptLocalWorldFavoriteGroupRename(group) { modalStore .prompt({ @@ -1177,6 +1271,10 @@ .catch(() => {}); } + /** + * + * @param group + */ function promptLocalWorldFavoriteGroupDelete(group) { modalStore .confirm({ @@ -1191,6 +1289,10 @@ .catch(() => {}); } + /** + * + * @param ctx + */ function clearFavoriteGroup(ctx) { modalStore .confirm({ @@ -1208,6 +1310,10 @@ .catch(() => {}); } + /** + * + * @param worldFavoriteSearch + */ function doSearchWorldFavorites(worldFavoriteSearch) { const search = worldFavoriteSearch.trim().toLowerCase(); if (search.length < 3) { @@ -1225,31 +1331,56 @@ } const searchWorldFavorites = debounce(doSearchWorldFavorites, 200); + /** + * + * @param group + * @param visibility + */ function handleVisibilitySelection(group, visibility) { const menuKey = remoteGroupMenuKey(group.key); changeWorldGroupVisibility(group, visibility, menuKey); } + /** + * + * @param group + */ function handleRemoteRename(group) { handleGroupMenuVisible(remoteGroupMenuKey(group.key), false); changeFavoriteGroupName(group); } + /** + * + * @param group + */ function handleRemoteClear(group) { handleGroupMenuVisible(remoteGroupMenuKey(group.key), false); clearFavoriteGroup(group); } + /** + * + * @param groupName + */ function handleLocalRename(groupName) { handleGroupMenuVisible(localGroupMenuKey(groupName), false); promptLocalWorldFavoriteGroupRename(groupName); } + /** + * + * @param groupName + */ function handleLocalDelete(groupName) { handleGroupMenuVisible(localGroupMenuKey(groupName), false); promptLocalWorldFavoriteGroupDelete(groupName); } + /** + * + * @param group + */ function changeFavoriteGroupName(group) { const currentName = group.displayName || group.name; modalStore @@ -1288,6 +1419,9 @@ .catch(() => {}); } + /** + * + */ async function refreshLocalWorldFavorites() { if (refreshingLocalFavorites.value) { return; @@ -1333,6 +1467,9 @@ } } + /** + * + */ function cancelLocalWorldRefresh() { if (!refreshingLocalFavorites.value) { return; @@ -1446,15 +1583,14 @@ border: 1px solid var(--border); padding: 8px; cursor: pointer; - box-shadow: 0 0 6px rgba(15, 23, 42, 0.04); - transition: - box-shadow 0.2s ease, - transform 0.2s ease; + transition: background-color 0.15s ease; } .group-item:hover { - box-shadow: 0 2px 6px rgba(15, 23, 42, 0.07); - transform: translateY(-2px); + background-color: var(--accent); + box-shadow: + 0 4px 6px -1px rgb(0 0 0 / 0.1), + 0 2px 4px -2px rgb(0 0 0 / 0.1); } .group-item__top { @@ -1696,19 +1832,17 @@ border-radius: calc(8px * var(--favorites-card-scale, 1)); padding: var(--favorites-card-padding-y, 8px) var(--favorites-card-padding-x, 10px); cursor: pointer; - transition: - border-color 0.2s ease, - box-shadow 0.2s ease, - transform 0.2s ease; - box-shadow: 0 0 6px rgba(15, 23, 42, 0.04); + transition: background-color 0.15s ease; width: 100%; min-width: var(--favorites-card-min-width, 240px); max-width: var(--favorites-card-target-width, 320px); } :deep(.favorites-search-card:hover) { - box-shadow: 0 4px 14px rgba(15, 23, 42, 0.07); - transform: translateY(calc(-2px * var(--favorites-card-scale, 1))); + background-color: var(--accent); + box-shadow: + 0 4px 6px -1px rgb(0 0 0 / 0.1), + 0 2px 4px -2px rgb(0 0 0 / 0.1); } :deep(.favorites-search-card.is-selected) { diff --git a/src/views/FriendsLocations/components/FriendsLocationsCard.vue b/src/views/FriendsLocations/components/FriendsLocationsCard.vue index cf2a2489..3c9a9017 100644 --- a/src/views/FriendsLocations/components/FriendsLocationsCard.vue +++ b/src/views/FriendsLocations/components/FriendsLocationsCard.vue @@ -241,16 +241,17 @@ display: grid; gap: calc(14px * var(--card-scale) * var(--card-spacing)); border-radius: 8px; - transition: - box-shadow 0.2s ease, - transform 0.2s ease; + transition: background-color 0.15s ease; width: 100%; max-width: var(--friend-card-target-width, 220px); min-width: var(--friend-card-min-width, 220px); box-sizing: border-box; &:hover { - transform: translateY(calc(-2px * var(--card-scale))); + background-color: var(--accent); + box-shadow: + 0 4px 6px -1px rgb(0 0 0 / 0.1), + 0 2px 4px -2px rgb(0 0 0 / 0.1); } } diff --git a/src/views/MyAvatars/components/MyAvatarCard.vue b/src/views/MyAvatars/components/MyAvatarCard.vue index 0f87e2bf..25b8305c 100644 --- a/src/views/MyAvatars/components/MyAvatarCard.vue +++ b/src/views/MyAvatars/components/MyAvatarCard.vue @@ -1,13 +1,11 @@