MrUnknownDE/VRCX
1
0
Fork 0
mirror of https://github.com/MrUnknownDE/VRCX.git synced 2026-04-15 12:53:51 +02:00
Code Issues Packages Projects Releases Wiki Activity

clean up element plus css

Browse Source
This commit is contained in:
pa
2026-01-16 20:50:41 +09:00
committed by Natsumi
parent 78f3bc512d
commit 093fe082f2
29 changed files with 108 additions and 1268 deletions
Download Patch File Download Diff File Expand all files Collapse all files

881
src/app.css
View File

File diff suppressed because it is too large Load Diff

2
src/components/AvatarInfo.vue
View File

@@ -5,7 +5,7 @@
<Unlock v-else-if="avatarType === '(public)'" class="h-4 w-4" />
</span>
<span class="mr-2">{{ avatarName }}</span>
<span v-if="avatarTags" style="color: var(--el-text-color-secondary); font-size: 12px">{{ avatarTags }}</span>
<span v-if="avatarTags" style="font-size: 12px">{{ avatarTags }}</span>
</div>
</template>

12
src/components/InstanceInfo.vue
View File

@@ -49,17 +49,13 @@
>{{ props.instance.userCount }}/{{ props.instance.capacity }}</span
>
<span v-if="props.friendcount" style="margin-left: 5px">({{ props.friendcount }})</span>
<span
v-if="state.isValidInstance && !props.instance.hasCapacityForYou"
style="margin-left: 5px; color: var(--el-color-danger)"
>{{ t('dialog.user.info.instance_full') }}</span
>
<span v-if="state.isValidInstance && !props.instance.hasCapacityForYou" style="margin-left: 5px">{{
t('dialog.user.info.instance_full')
}}</span>
<span v-if="props.instance.queueSize" style="margin-left: 5px"
>{{ t('dialog.user.info.instance_queue') }} {{ props.instance.queueSize }}</span
>
<span v-if="state.isAgeGated" style="margin-left: 5px; color: var(--el-color-danger)">{{
t('dialog.user.info.instance_age_gated')
}}</span>
<span v-if="state.isAgeGated" style="margin-left: 5px">{{ t('dialog.user.info.instance_age_gated') }}</span>
</div>
</template>

93
src/components/NavMenu.vue
View File

@@ -42,7 +42,9 @@
<SidebarMenuItem v-else>
<Collapsible
class="group/collapsible"
:default-open="activeMenuIndex && item.children?.some((e) => e.index === activeMenuIndex)">
:default-open="
activeMenuIndex && item.children?.some((e) => e.index === activeMenuIndex)
">
<template #default="{ open }">
<CollapsibleTrigger as-child>
<SidebarMenuButton
@@ -63,9 +65,7 @@
</CollapsibleTrigger>
<CollapsibleContent>
<SidebarMenuSub>
<SidebarMenuSubItem
v-for="entry in item.children"
:key="entry.index">
<SidebarMenuSubItem v-for="entry in item.children" :key="entry.index">
<SidebarMenuSubButton
:is-active="activeMenuIndex === entry.index"
@click="handleSubmenuClick(entry, item.index)">
@@ -93,7 +93,8 @@
<DropdownMenu>
<DropdownMenuTrigger as-child>
<SidebarMenuButton :tooltip="t('nav_tooltip.help_support')">
<i class="ri-question-line inline-flex size-6 items-center justify-center text-[19px]" />
<i
class="ri-question-line inline-flex size-6 items-center justify-center text-[19px]" />
<span v-show="!isCollapsed">{{ t('nav_tooltip.help_support') }}</span>
</SidebarMenuButton>
</DropdownMenuTrigger>
@@ -122,7 +123,8 @@
<DropdownMenu>
<DropdownMenuTrigger as-child>
<SidebarMenuButton :tooltip="t('nav_tooltip.manage')">
<i class="ri-settings-3-line inline-flex size-6 items-center justify-center text-[19px]" />
<i
class="ri-settings-3-line inline-flex size-6 items-center justify-center text-[19px]" />
<span v-show="!isCollapsed">{{ t('nav_tooltip.manage') }}</span>
</SidebarMenuButton>
</DropdownMenuTrigger>
@@ -166,17 +168,24 @@
<DropdownMenuSubTrigger>
<span>{{ t('view.settings.appearance.theme_color.header') }}</span>
</DropdownMenuSubTrigger>
<DropdownMenuSubContent side="right" align="start" class="w-72 max-h-80 overflow-auto">
<DropdownMenuSubContent
side="right"
align="start"
class="w-72 max-h-80 overflow-auto">
<DropdownMenuItem
v-for="color in colorFamilies"
:key="color.name"
:disabled="isApplyingPrimaryColor"
@click="handleThemeColorSelect(color)">
<span class="flex items-center gap-2 min-w-0 flex-1">
<span class="h-3 w-3 shrink-0 rounded-sm" :style="{ backgroundColor: color.base }" />
<span
class="h-3 w-3 shrink-0 rounded-sm"
:style="{ backgroundColor: color.base }" />
<span class="truncate">{{ color.name }}</span>
</span>
<span v-if="currentPrimary === color.base" class="text-muted-foreground">✓</span>
<span v-if="currentPrimary === color.base" class="text-muted-foreground"
>✓</span
>
</DropdownMenuItem>
</DropdownMenuSubContent>
</DropdownMenuSub>
@@ -213,26 +222,6 @@
</template>
<script setup>
import { computed, defineAsyncComponent, onMounted, ref } from 'vue';
import dayjs from 'dayjs';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router';
import { ChevronRight } from 'lucide-vue-next';
import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible';
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuLabel,
DropdownMenuSeparator,
DropdownMenuSub,
DropdownMenuSubContent,
DropdownMenuSubTrigger,
DropdownMenuTrigger
} from '@/components/ui/dropdown-menu';
import {
Sidebar,
SidebarContent,
@@ -247,6 +236,25 @@
SidebarMenuSubItem,
SidebarRail
} from '@/components/ui/sidebar';
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuLabel,
DropdownMenuSeparator,
DropdownMenuSub,
DropdownMenuSubContent,
DropdownMenuSubTrigger,
DropdownMenuTrigger
} from '@/components/ui/dropdown-menu';
import { computed, defineAsyncComponent, onMounted, ref, watch } from 'vue';
import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible';
import { ChevronRight } from 'lucide-vue-next';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router';
import dayjs from 'dayjs';
import {
useAppearanceSettingsStore,
@@ -258,7 +266,6 @@
} from '../stores';
import { THEME_CONFIG, links, navDefinitions } from '../shared/constants';
import { openExternalLink } from '../shared/utils';
import { useThemePrimaryColor } from '../composables/useElementTheme';
import configRepository from '../service/config';
@@ -388,14 +395,14 @@
const themes = computed(() => Object.keys(THEME_CONFIG));
const {
currentPrimary,
isApplying: isApplyingPrimaryColor,
applyCustomPrimaryColor,
initPrimaryColor,
colorFamilies,
selectPaletteColor
} = useThemePrimaryColor();
// const {
// currentPrimary,
// isApplying: isApplyingPrimaryColor,
// applyCustomPrimaryColor,
// initPrimaryColor,
// colorFamilies,
// selectPaletteColor
// } = useThemePrimaryColor();
watch(
() => locale.value,
@@ -495,9 +502,9 @@
appearanceSettingsStore.setThemeMode(theme);
};
const handleThemeColorSelect = async (colorFamily) => {
await selectPaletteColor(colorFamily);
};
// const handleThemeColorSelect = async (colorFamily) => {
// await selectPaletteColor(colorFamily);
// };
const openGithub = () => {
openExternalLink('https://github.com/vrcx-team/VRCX');
@@ -680,7 +687,7 @@
};
onMounted(async () => {
await initPrimaryColor();
// await initPrimaryColor();
await loadNavMenuConfig();
});
</script>
@@ -712,7 +719,6 @@
inline-size: 14px;
block-size: 14px;
border-radius: 4px;
border: 1px solid var(--el-border-color-lighter);
flex: none;
}
@@ -726,7 +732,6 @@
.nav-menu-theme__custom-label {
font-size: 13px;
color: var(--el-text-color-regular);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;

2
src/components/dialogs/AvatarDialog/SetAvatarTagsDialog.vue
View File

@@ -79,12 +79,10 @@
<span
v-if="avatar.releaseStatus === 'public'"
class="extra"
style="color: var(--el-color-success)"
v-text="avatar.releaseStatus"></span>
<span
v-else-if="avatar.releaseStatus === 'private'"
class="extra"
style="color: var(--el-color-danger)"
v-text="avatar.releaseStatus"></span>
<span v-else class="extra" v-text="avatar.releaseStatus"></span>
<span class="extra" v-text="avatarTagStrings.get(avatar.id)"></span>

6
src/components/dialogs/CustomNavDialog.vue
View File

@@ -548,7 +548,6 @@
}
.custom-nav-entry {
border: 1px solid var(--el-border-color);
border-radius: 8px;
padding: 10px 12px;
display: flex;
@@ -606,7 +605,6 @@
.custom-nav-entry__folder-empty {
font-size: 12px;
color: var(--el-text-color-secondary);
}
.custom-nav-dialog__footer {
@@ -645,13 +643,11 @@
}
.folder-editor__column {
border: 1px solid var(--el-border-color);
border-radius: 8px;
padding: 10px;
min-height: 220px;
display: flex;
flex-direction: column;
background: var(--el-fill-color-blank);
}
.folder-editor__column-title {
@@ -665,7 +661,6 @@
align-items: center;
justify-content: center;
font-size: 12px;
color: var(--el-text-color-secondary);
text-align: center;
}
@@ -692,7 +687,6 @@
align-items: center;
gap: 12px;
padding: 6px 0;
border-bottom: 1px solid var(--el-border-color-light);
}
.folder-editor__selected-item:last-child {

74
src/components/dialogs/UserDialog/UserDialog.vue
View File

@@ -410,13 +410,10 @@
<div class="x-friend-item" @click="toggleAvatarCopying">
<div class="detail">
<span class="name">{{ t('dialog.user.info.avatar_cloning') }}</span>
<span
v-if="currentUser.allowAvatarCopying"
class="extra"
style="color: var(--el-color-success)"
>{{ t('dialog.user.info.avatar_cloning_allow') }}</span
>
<span v-else class="extra" style="color: var(--el-color-danger)">{{
<span v-if="currentUser.allowAvatarCopying" class="extra">{{
t('dialog.user.info.avatar_cloning_allow')
}}</span>
<span v-else class="extra">{{
t('dialog.user.info.avatar_cloning_deny')
}}</span>
</div>
@@ -424,13 +421,10 @@
<div class="x-friend-item" @click="toggleAllowBooping">
<div class="detail">
<span class="name">{{ t('dialog.user.info.booping') }}</span>
<span
v-if="currentUser.isBoopingEnabled"
class="extra"
style="color: var(--el-color-success)"
>{{ t('dialog.user.info.avatar_cloning_allow') }}</span
>
<span v-else class="extra" style="color: var(--el-color-danger)">{{
<span v-if="currentUser.isBoopingEnabled" class="extra">{{
t('dialog.user.info.avatar_cloning_allow')
}}</span>
<span v-else class="extra">{{
t('dialog.user.info.avatar_cloning_deny')
}}</span>
</div>
@@ -438,13 +432,10 @@
<div class="x-friend-item" @click="toggleSharedConnectionsOptOut">
<div class="detail">
<span class="name">{{ t('dialog.user.info.show_mutual_friends') }}</span>
<span
v-if="!currentUser.hasSharedConnectionsOptOut"
class="extra"
style="color: var(--el-color-success)"
>{{ t('dialog.user.info.avatar_cloning_allow') }}</span
>
<span v-else class="extra" style="color: var(--el-color-danger)">{{
<span v-if="!currentUser.hasSharedConnectionsOptOut" class="extra">{{
t('dialog.user.info.avatar_cloning_allow')
}}</span>
<span v-else class="extra">{{
t('dialog.user.info.avatar_cloning_deny')
}}</span>
</div>
@@ -454,13 +445,10 @@
<div class="x-friend-item" style="cursor: default">
<div class="detail">
<span class="name">{{ t('dialog.user.info.avatar_cloning') }}</span>
<span
v-if="userDialog.ref.allowAvatarCopying"
class="extra"
style="color: var(--el-color-success)"
>{{ t('dialog.user.info.avatar_cloning_allow') }}</span
>
<span v-else class="extra" style="color: var(--el-color-danger)">{{
<span v-if="userDialog.ref.allowAvatarCopying" class="extra">{{
t('dialog.user.info.avatar_cloning_allow')
}}</span>
<span v-else class="extra">{{
t('dialog.user.info.avatar_cloning_deny')
}}</span>
</div>
@@ -622,7 +610,7 @@
<span
style="
margin-left: 10px;
color: var(--el-text-color-secondary);
font-size: 10px;
"
>{{ t('dialog.user.groups.hold_shift') }}</span
@@ -849,7 +837,7 @@
size="icon-sm"
variant="outline"
v-if="shiftHeld"
style="color: var(--el-color-danger); margin-left: 5px"
style="margin-left: 5px"
@click.stop="leaveGroup(group.id)">
<LogOut />
</Button>
@@ -871,8 +859,7 @@
<span style="font-weight: bold; font-size: 16px">{{
t('dialog.user.groups.own_groups')
}}</span>
<span
style="color: var(--el-text-color-secondary); font-size: 12px; margin-left: 5px"
<span style="font-size: 12px; margin-left: 5px"
>{{ userGroups.ownGroups.length }}/{{
cachedConfig?.constants?.GROUPS?.MAX_OWNED
}}</span
@@ -918,10 +905,9 @@
<span style="font-weight: bold; font-size: 16px">{{
t('dialog.user.groups.mutual_groups')
}}</span>
<span
style="color: var(--el-text-color-secondary); font-size: 12px; margin-left: 5px"
>{{ userGroups.mutualGroups.length }}</span
>
<span style="font-size: 12px; margin-left: 5px">{{
userGroups.mutualGroups.length
}}</span>
<div
class="x-friend-list"
style="margin-top: 10px; margin-bottom: 15px; min-height: 60px">
@@ -963,12 +949,7 @@
<span style="font-weight: bold; font-size: 16px">{{
t('dialog.user.groups.groups')
}}</span>
<span
style="
color: var(--el-text-color-secondary);
font-size: 12px;
margin-left: 5px;
">
<span style="font-size: 12px; margin-left: 5px">
{{ userGroups.remainingGroups.length }}
<template v-if="currentUser.id === userDialog.id">
/
@@ -1125,12 +1106,7 @@
:class="userFavoriteWorldsStatus(list[1])">
</i>
<span style="font-weight: bold; font-size: 14px" v-text="list[0]"></span>
<span
style="
color: var(--el-text-color-secondary);
font-size: 10px;
margin-left: 5px;
"
<span style="font-size: 10px; margin-left: 5px"
>{{ list[2].length }}/{{ favoriteLimits.maxFavoritesPerGroup.world }}</span
>
</span>
@@ -1266,13 +1242,11 @@
<span
v-if="avatar.releaseStatus === 'public'"
class="extra"
style="color: var(--el-color-success)"
v-text="avatar.releaseStatus">
</span>
<span
v-else-if="avatar.releaseStatus === 'private'"
class="extra"
style="color: var(--el-color-danger)"
v-text="avatar.releaseStatus">
</span>
<span v-else class="extra" v-text="avatar.releaseStatus"></span>

2
src/composables/useElementTheme.js
View File

@@ -5,7 +5,7 @@ import colors from 'tailwindcss/colors';
import configRepository from '../service/config';
// Tailwind indigo-500 in OKLCH
export const DEFAULT_PRIMARY_COLOR = 'oklch(58.5% 0.233 277.117)';
const DEFAULT_PRIMARY_COLOR = 'oklch(58.5% 0.233 277.117)';
const DARK_WEIGHT = 0.2;
const CONFIG_KEY = 'VRCX_elPrimaryColor';
const STYLE_ID = 'el-dynamic-theme';

8
src/plugin/ui.js
View File

@@ -1,10 +1,10 @@
import {
changeAppDarkStyle,
// changeAppDarkStyle,
changeAppThemeStyle,
changeHtmlLangAttribute,
getThemeMode,
refreshCustomCss,
setLoginContainerStyle
refreshCustomCss
// setLoginContainerStyle
} from '../shared/utils/base/ui';
import { i18n, loadLocalizedStrings } from './i18n';
@@ -23,7 +23,7 @@ export async function initUi() {
const { initThemeMode, isDarkMode } =
await getThemeMode(configRepository);
setLoginContainerStyle(isDarkMode);
// setLoginContainerStyle(isDarkMode);
changeAppThemeStyle(initThemeMode);
} catch (error) {
console.error('Error initializing locale and theme:', error);

44
src/shared/utils/base/ui.js
View File

@@ -260,53 +260,11 @@ function formatJsonVars(ref) {
return sortedRef;
}
function getNextDialogIndex() {
let z = 2000;
document.querySelectorAll('.el-overlay,.el-modal-dialog').forEach((v) => {
// @ts-ignore
if (v.style.display === 'none') {
return;
}
// @ts-ignore
const _z = Number(v.style.zIndex) || 0;
if (_z > z) {
z = _z;
}
});
return z + 1;
}
function changeHtmlLangAttribute(language) {
const htmlElement = document.documentElement;
htmlElement.setAttribute('lang', language);
}
// prevent flicker on login page
function setLoginContainerStyle(isDarkMode) {
const loginContainerStyle = document.createElement('style');
loginContainerStyle.id = 'login-container-style';
loginContainerStyle.type = 'text/css';
const backgroundFallback = isDarkMode ? '#101010' : '#ffffff';
const inputBackgroundFallback = isDarkMode ? '#1f1f1f' : '#ffffff';
const borderFallback = isDarkMode ? '#3b3b3b' : '#DCDFE6';
loginContainerStyle.innerHTML = `
.x-login-container {
background-color: var(--el-bg-color-page, ${backgroundFallback}) !important;
transition: background-color 0.3s ease;
}
.x-login-container .el-input__wrapper {
background-color: var(--el-bg-color, ${inputBackgroundFallback}) !important;
border: 1px solid var(--el-border-color, ${borderFallback}) !important;
transition: background-color 0.3s ease, border-color 0.3s ease;
}
`;
document.head.insertBefore(loginContainerStyle, document.head.firstChild);
}
async function getThemeMode(configRepository) {
const initThemeMode = await configRepository.getString(
'VRCX_ThemeMode',
@@ -340,9 +298,7 @@ export {
HueToHex,
HSVtoRGB,
formatJsonVars,
getNextDialogIndex,
changeHtmlLangAttribute,
setLoginContainerStyle,
getThemeMode,
redirectToToolsTab
};

5
src/stores/settings/appearance.js
View File

@@ -13,7 +13,6 @@ import { database } from '../../service/database';
import { getNameColour } from '../../shared/utils';
import { languageCodes } from '../../localization';
import { loadLocalizedStrings } from '../../plugin';
import { useElementTheme } from '../../composables/useElementTheme';
import { useFeedStore } from '../feed';
import { useGameLogStore } from '../gameLog';
import { useModalStore } from '../modal';
@@ -42,7 +41,7 @@ export const useAppearanceSettingsStore = defineStore(
const MAX_TABLE_PAGE_SIZE = 1000;
const DEFAULT_TABLE_PAGE_SIZES = [10, 15, 20, 25, 50, 100];
const { initPrimaryColor } = useElementTheme();
// const { initPrimaryColor } = useElementTheme();
const appLanguage = ref('en');
const themeMode = ref('');
@@ -204,7 +203,7 @@ export const useAppearanceSettingsStore = defineStore(
themeMode.value = themeModeConfig;
setThemeMode(themeModeConfig);
await initPrimaryColor();
// await initPrimaryColor();
displayVRCPlusIconsAsAvatar.value =
displayVRCPlusIconsAsAvatarConfig;

13
src/styles/globals.css
View File

@@ -4,15 +4,14 @@
@custom-variant dark (&:is(.dark *));
:root {
--primary: var(--el-color-primary);
--ring: var(--el-color-primary);
--background: oklch(1 0 0);
--foreground: oklch(0.145 0 0);
--card: oklch(1 0 0);
--card-foreground: oklch(0.145 0 0);
--popover: oklch(1 0 0);
--popover-foreground: oklch(0.145 0 0);
/* --primary: oklch(0.205 0 0); */
--primary: oklch(0.205 0 0);
--primary-foreground: oklch(0.985 0 0);
--secondary: oklch(0.97 0 0);
--secondary-foreground: oklch(0.205 0 0);
@@ -24,7 +23,7 @@
--destructive-foreground: oklch(0.577 0.245 27.325);
--border: oklch(0.922 0 0);
--input: oklch(0.922 0 0);
/* --ring: oklch(0.708 0 0); */
--ring: oklch(0.708 0 0);
--chart-1: oklch(0.646 0.222 41.116);
--chart-2: oklch(0.6 0.118 184.704);
--chart-3: oklch(0.398 0.07 227.392);
@@ -42,15 +41,13 @@
}
.dark {
--primary: var(--el-color-primary);
--ring: var(--el-color-primary);
--background: oklch(0.145 0 0);
--foreground: oklch(0.985 0 0);
--card: oklch(0.145 0 0);
--card-foreground: oklch(0.985 0 0);
--popover: oklch(0.145 0 0);
--popover-foreground: oklch(0.985 0 0);
/* --primary: oklch(0.985 0 0); */
--primary: oklch(0.985 0 0);
--primary-foreground: oklch(0.205 0 0);
--secondary: oklch(0.269 0 0);
--secondary-foreground: oklch(0.985 0 0);
@@ -62,7 +59,7 @@
--destructive-foreground: oklch(0.637 0.237 25.331);
--border: oklch(0.269 0 0);
--input: oklch(0.269 0 0);
/* --ring: oklch(0.439 0 0); */
--ring: oklch(0.439 0 0);
--chart-1: oklch(0.488 0.243 264.376);
--chart-2: oklch(0.696 0.17 162.48);
--chart-3: oklch(0.769 0.188 70.08);

6
src/views/Charts/components/InstanceActivity.vue
View File

@@ -739,18 +739,12 @@
align-items: center;
justify-content: center;
margin-top: 100px;
color: var(--el-text-color-secondary);
}
.divider {
padding: 0 400px;
transition: top 0.3s ease;
}
// override el-ui
.el-date-editor.el-input,
.el-date-editor.el-input__inner {
width: 200px;
}
.status-online {
display: flex;
justify-content: center;

4
src/views/Charts/components/MutualFriends.vue
View File

@@ -754,7 +754,6 @@
margin-top: 12px;
padding: 12px 16px;
border-radius: 6px;
border: 1px solid var(--el-border-color);
background: transparent;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
@@ -784,7 +783,6 @@
margin-top: 12px;
padding: 40px;
text-align: center;
border: 1px dashed var(--el-border-color);
border-radius: 8px;
flex: 1;
display: flex;
@@ -794,7 +792,6 @@
.mutual-graph__force-description {
margin: 0 0 12px 0;
color: var(--el-text-color-regular);
font-size: 13px;
}
@@ -817,7 +814,6 @@
.mutual-graph__helper {
margin-top: 4px;
font-size: 12px;
color: var(--el-text-color-secondary);
line-height: 1.4;
}
</style>

56
src/views/Favorites/FavoritesAvatar.vue
View File

@@ -1657,7 +1657,6 @@
}
.group-item {
border: 1px solid var(--el-border-color);
border-radius: 8px;
padding: 8px;
cursor: pointer;
@@ -1693,7 +1692,6 @@
.group-item__count {
font-size: 12px;
color: var(--el-text-color-secondary);
}
.group-item__bottom {
@@ -1703,11 +1701,6 @@
gap: 8px;
}
.group-item.is-active {
border-color: var(--el-color-primary);
background-color: var(--el-color-primary-light-9, rgba(64, 158, 255, 0.12));
}
.group-item--placeholder {
pointer-events: none;
opacity: 0.7;
@@ -1717,7 +1710,6 @@
width: 64px;
height: 18px;
border-radius: 999px;
background-color: var(--el-fill-color);
}
.group-item--new {
@@ -1726,7 +1718,6 @@
align-items: center;
justify-content: center;
gap: 6px;
color: var(--el-color-primary);
font-size: 14px;
}
@@ -1739,13 +1730,8 @@
width: 100%;
}
.group-item__input :deep(.el-input__wrapper) {
width: 100%;
}
.group-empty {
text-align: center;
color: var(--el-text-color-secondary);
font-size: 12px;
padding: 12px 0;
}
@@ -1772,21 +1758,12 @@
align-self: stretch;
}
.favorites-group-menu__item:hover {
background-color: var(--el-menu-hover-bg-color);
}
.favorites-group-menu__item--danger {
color: var(--el-color-danger);
}
.favorites-group-menu__item--submenu {
padding-right: 8px;
}
.favorites-group-menu__arrow {
margin-left: auto;
color: var(--el-text-color-secondary);
font-size: 12px;
}
@@ -1812,14 +1789,8 @@
align-self: stretch;
}
.group-visibility-menu__item:hover,
.group-visibility-menu__item.is-active {
background-color: var(--el-menu-hover-bg-color);
}
.group-visibility-menu__check {
font-size: 12px;
color: var(--el-color-primary);
}
.favorites-content {
@@ -1850,7 +1821,6 @@
.favorites-content__title small {
font-size: 12px;
font-weight: normal;
color: var(--el-text-color-secondary);
}
.favorites-content__edit {
@@ -1858,7 +1828,6 @@
align-items: center;
gap: 8px;
font-size: 13px;
color: var(--el-text-color-regular);
}
.favorites-content__edit-actions {
@@ -1874,10 +1843,6 @@
margin-bottom: 12px;
}
.favorites-content__actions .el-button {
margin: 0;
}
.favorites-content__list {
flex: 1;
min-height: 0;
@@ -1927,11 +1892,9 @@
display: flex;
align-items: center;
box-sizing: border-box;
border: 1px solid var(--el-border-color);
border-radius: calc(8px * var(--favorites-card-scale, 1));
padding: var(--favorites-card-padding-y, 8px) var(--favorites-card-padding-x, 10px);
cursor: pointer;
background: var(--el-bg-color);
transition:
border-color 0.2s ease,
box-shadow 0.2s ease;
@@ -1946,11 +1909,6 @@
transform: translateY(-2px);
}
:deep(.favorites-search-card.is-selected) {
border-color: var(--el-color-primary);
box-shadow: 0 0 0 1px var(--el-color-primary-light-3, rgba(64, 158, 255, 0.4));
}
:deep(.favorites-search-card__content) {
display: flex;
align-items: center;
@@ -1964,7 +1922,6 @@
height: calc(48px * var(--favorites-card-scale, 1));
border-radius: calc(6px * var(--favorites-card-scale, 1));
overflow: hidden;
background: var(--el-fill-color-lighter);
flex-shrink: 0;
}
@@ -2001,7 +1958,6 @@
:deep(.favorites-search-card__detail .extra) {
font-size: calc(12px * var(--favorites-card-scale, 1));
color: var(--el-text-color-secondary);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
@@ -2017,7 +1973,6 @@
display: inline-flex;
align-items: center;
gap: 4px;
color: var(--el-text-color-secondary);
font-size: 14px;
}
@@ -2070,7 +2025,6 @@
display: flex;
align-items: center;
justify-content: center;
color: var(--el-text-color-secondary);
font-size: 13px;
height: 100%;
}
@@ -2082,30 +2036,20 @@
cursor: default;
}
.favorites-dropdown__control:not(:last-child) {
border-bottom: 1px solid var(--el-border-color-lighter);
}
.favorites-dropdown__control-header {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 13px;
font-weight: 600;
color: var(--el-text-color-primary);
margin-bottom: 6px;
}
.favorites-dropdown__control-value {
font-size: 12px;
color: var(--el-text-color-secondary);
}
.favorites-dropdown__slider {
padding: 0 4px 4px;
}
.favorites-dropdown__slider :deep(.el-slider__runway) {
margin: 0;
}
</style>

32
src/views/Favorites/FavoritesFriend.vue
View File

@@ -947,7 +947,6 @@
}
.group-item {
border: 1px solid var(--el-border-color);
border-radius: 8px;
padding: 8px;
cursor: pointer;
@@ -976,7 +975,6 @@
.group-item__count {
font-size: 12px;
color: var(--el-text-color-secondary);
}
.group-item__bottom {
@@ -987,13 +985,10 @@
}
.group-item.is-active {
border-color: var(--el-color-primary);
background-color: var(--el-color-primary-light-9, rgba(64, 158, 255, 0.12));
}
.group-empty {
text-align: center;
color: var(--el-text-color-secondary);
font-size: 12px;
padding: 12px 0;
}
@@ -1021,11 +1016,9 @@
}
.favorites-group-menu__item:hover {
background-color: var(--el-menu-hover-bg-color);
}
.favorites-group-menu__item--danger {
color: var(--el-color-danger);
}
.favorites-group-menu__item--submenu {
@@ -1034,7 +1027,6 @@
.favorites-group-menu__arrow {
margin-left: auto;
color: var(--el-text-color-secondary);
font-size: 12px;
}
@@ -1062,12 +1054,10 @@
.group-visibility-menu__item:hover,
.group-visibility-menu__item.is-active {
background-color: var(--el-menu-hover-bg-color);
}
.group-visibility-menu__check {
font-size: 12px;
color: var(--el-color-primary);
}
.favorites-content {
@@ -1098,7 +1088,6 @@
.favorites-content__title small {
font-size: 12px;
font-weight: normal;
color: var(--el-text-color-secondary);
}
.favorites-content__edit {
@@ -1106,7 +1095,6 @@
align-items: center;
gap: 8px;
font-size: 13px;
color: var(--el-text-color-regular);
}
.favorites-content__edit-actions {
@@ -1122,10 +1110,6 @@
margin-bottom: 12px;
}
.favorites-content__actions .el-button {
margin: 0;
}
.favorites-content__list {
flex: 1;
min-height: 0;
@@ -1175,11 +1159,9 @@
display: flex;
align-items: center;
box-sizing: border-box;
border: 1px solid var(--el-border-color);
border-radius: calc(8px * var(--favorites-card-scale, 1));
padding: var(--favorites-card-padding-y, 8px) var(--favorites-card-padding-x, 10px);
cursor: pointer;
background: var(--el-bg-color);
transition:
border-color 0.2s ease,
box-shadow 0.2s ease;
@@ -1195,8 +1177,6 @@
}
:deep(.favorites-search-card.is-selected) {
border-color: var(--el-color-primary);
box-shadow: 0 0 0 1px var(--el-color-primary-light-3, rgba(64, 158, 255, 0.4));
}
:deep(.favorites-search-card__content) {
@@ -1212,7 +1192,6 @@
height: calc(48px * var(--favorites-card-scale, 1));
border-radius: calc(6px * var(--favorites-card-scale, 1));
overflow: hidden;
background: var(--el-fill-color-lighter);
flex-shrink: 0;
}
@@ -1249,7 +1228,6 @@
:deep(.favorites-search-card__detail .extra) {
font-size: calc(12px * var(--favorites-card-scale, 1));
color: var(--el-text-color-secondary);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
@@ -1265,7 +1243,6 @@
display: inline-flex;
align-items: center;
gap: 4px;
color: var(--el-text-color-secondary);
font-size: 14px;
}
@@ -1316,7 +1293,6 @@
:deep(.favorites-search-card__location) {
font-size: 12px;
color: var(--el-text-color-secondary);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
@@ -1326,7 +1302,6 @@
display: flex;
align-items: center;
justify-content: center;
color: var(--el-text-color-secondary);
font-size: 13px;
height: 100%;
}
@@ -1339,7 +1314,6 @@
}
.favorites-dropdown__control:not(:last-child) {
border-bottom: 1px solid var(--el-border-color-lighter);
}
.favorites-dropdown__control-header {
@@ -1348,20 +1322,14 @@
justify-content: space-between;
font-size: 13px;
font-weight: 600;
color: var(--el-text-color-primary);
margin-bottom: 6px;
}
.favorites-dropdown__control-value {
font-size: 12px;
color: var(--el-text-color-secondary);
}
.favorites-dropdown__slider {
padding: 0 4px 4px;
}
.favorites-dropdown__slider :deep(.el-slider__runway) {
margin: 0;
}
</style>

37
src/views/Favorites/FavoritesWorld.vue
View File

@@ -1420,7 +1420,6 @@
}
.group-item {
border: 1px solid var(--el-border-color);
border-radius: 8px;
padding: 8px;
cursor: pointer;
@@ -1455,7 +1454,6 @@
.group-item__count {
font-size: 12px;
color: var(--el-text-color-secondary);
}
.group-item__bottom {
@@ -1466,8 +1464,6 @@
}
.group-item.is-active {
border-color: var(--el-color-primary);
background-color: var(--el-color-primary-light-9, rgba(64, 158, 255, 0.12));
}
.group-item--placeholder {
@@ -1479,7 +1475,6 @@
width: 64px;
height: 18px;
border-radius: 999px;
background-color: var(--el-fill-color);
}
.group-item--new {
@@ -1488,7 +1483,6 @@
align-items: center;
justify-content: center;
gap: 6px;
color: var(--el-color-primary);
font-size: 14px;
}
@@ -1496,13 +1490,8 @@
width: 100%;
}
.group-item__input :deep(.el-input__wrapper) {
width: 100%;
}
.group-empty {
text-align: center;
color: var(--el-text-color-secondary);
font-size: 12px;
padding: 12px 0;
}
@@ -1529,11 +1518,9 @@
align-self: stretch;
}
.favorites-group-menu__item:hover {
background-color: var(--el-menu-hover-bg-color);
}
.favorites-group-menu__item--danger {
color: var(--el-color-danger);
}
.favorites-group-menu__item--submenu {
@@ -1542,7 +1529,6 @@
.favorites-group-menu__arrow {
margin-left: auto;
color: var(--el-text-color-secondary);
font-size: 12px;
}
@@ -1570,12 +1556,10 @@
.group-visibility-menu__item:hover,
.group-visibility-menu__item.is-active {
background-color: var(--el-menu-hover-bg-color);
}
.group-visibility-menu__check {
font-size: 12px;
color: var(--el-color-primary);
}
.favorites-content {
@@ -1606,7 +1590,6 @@
.favorites-content__title small {
font-size: 12px;
font-weight: normal;
color: var(--el-text-color-secondary);
}
.favorites-content__edit {
@@ -1614,7 +1597,6 @@
align-items: center;
gap: 8px;
font-size: 13px;
color: var(--el-text-color-regular);
}
.favorites-content__edit-actions {
@@ -1630,10 +1612,6 @@
margin-bottom: 12px;
}
.favorites-content__actions .el-button {
margin: 0;
}
.favorites-content__list {
flex: 1;
min-height: 0;
@@ -1683,11 +1661,9 @@
display: flex;
align-items: center;
box-sizing: border-box;
border: 1px solid var(--el-border-color);
border-radius: calc(8px * var(--favorites-card-scale, 1));
padding: var(--favorites-card-padding-y, 8px) var(--favorites-card-padding-x, 10px);
cursor: pointer;
background: var(--el-bg-color);
transition:
border-color 0.2s ease,
box-shadow 0.2s ease;
@@ -1703,8 +1679,6 @@
}
:deep(.favorites-search-card.is-selected) {
border-color: var(--el-color-primary);
box-shadow: 0 0 0 1px var(--el-color-primary-light-3, rgba(64, 158, 255, 0.4));
}
:deep(.favorites-search-card__content) {
@@ -1720,7 +1694,6 @@
height: calc(48px * var(--favorites-card-scale, 1));
border-radius: calc(6px * var(--favorites-card-scale, 1));
overflow: hidden;
background: var(--el-fill-color-lighter);
flex-shrink: 0;
}
@@ -1757,7 +1730,6 @@
:deep(.favorites-search-card__detail .extra) {
font-size: calc(12px * var(--favorites-card-scale, 1));
color: var(--el-text-color-secondary);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
@@ -1773,7 +1745,6 @@
display: inline-flex;
align-items: center;
gap: 4px;
color: var(--el-text-color-secondary);
font-size: 14px;
}
@@ -1826,7 +1797,6 @@
display: flex;
align-items: center;
justify-content: center;
color: var(--el-text-color-secondary);
font-size: 13px;
height: 100%;
}
@@ -1839,7 +1809,6 @@
}
.favorites-dropdown__control:not(:last-child) {
border-bottom: 1px solid var(--el-border-color-lighter);
}
.favorites-dropdown__control-header {
@@ -1848,20 +1817,14 @@
justify-content: space-between;
font-size: 13px;
font-weight: 600;
color: var(--el-text-color-primary);
margin-bottom: 6px;
}
.favorites-dropdown__control-value {
font-size: 12px;
color: var(--el-text-color-secondary);
}
.favorites-dropdown__slider {
padding: 0 4px 4px;
}
.favorites-dropdown__slider :deep(.el-slider__runway) {
margin: 0;
}
</style>

10
src/views/FriendsLocations/FriendsLocations.vue
View File

@@ -770,7 +770,6 @@
.friend-view__toolbar--loading {
justify-content: flex-end;
color: var(--el-text-color-secondary);
font-size: 13px;
font-weight: 500;
}
@@ -786,7 +785,6 @@
flex: 1;
flex-wrap: wrap;
justify-content: flex-end;
color: var(--el-text-color-regular);
}
.friend-view__virtual {
@@ -836,7 +834,6 @@
.friend-view__scale-value {
font-size: 12px;
font-weight: 600;
color: var(--el-text-color-secondary);
min-width: 42px;
text-align: right;
}
@@ -859,7 +856,6 @@
display: grid;
place-items: center;
min-height: 240px;
color: var(--el-text-color-secondary);
}
.friend-view__grid {
@@ -892,7 +888,6 @@
margin: 5px 10px;
font-weight: 600;
font-size: 13px;
color: var(--el-text-color-primary);
}
.friend-view__divider {
@@ -900,7 +895,6 @@
align-items: center;
gap: 12px;
margin: 16px 4px;
color: var(--el-text-color-regular);
font-size: 13px;
font-weight: 600;
}
@@ -910,7 +904,6 @@
content: '';
flex: 1;
height: 1px;
background: var(--el-border-color);
}
.friend-view__divider-text {
@@ -919,14 +912,12 @@
.friend-view__instance-count {
font-size: 12px;
color: var(--el-text-color-secondary);
}
.friend-view__empty {
display: grid;
place-items: center;
min-height: 240px;
color: var(--el-text-color-secondary);
font-size: 15px;
letter-spacing: 0.5px;
}
@@ -937,7 +928,6 @@
justify-content: center;
gap: 8px;
padding: 18px 0 12px;
color: var(--el-text-color-secondary);
font-size: 14px;
}

11
src/views/FriendsLocations/components/FriendsLocationsCard.vue
View File

@@ -95,9 +95,6 @@
display: grid;
gap: calc(14px * var(--card-scale) * var(--card-spacing));
border-radius: 8px;
background: var(--el-bg-color-overlay);
border: 1px solid var(--el-border-color);
box-shadow: var(--el-box-shadow-lighter);
transition:
box-shadow 0.2s ease,
transform 0.2s ease;
@@ -105,7 +102,6 @@
min-width: var(--friend-card-min-width, 220px);
&:hover {
box-shadow: var(--el-box-shadow-light);
transform: translateY(calc(-2px * var(--card-scale)));
}
}
@@ -123,8 +119,6 @@
}
.friend-card__avatar {
border: 1px solid var(--el-border-color);
box-shadow: var(--el-box-shadow-lighter);
}
.friend-card__status-dot {
@@ -134,8 +128,6 @@
inline-size: calc(12px * var(--card-scale));
block-size: calc(12px * var(--card-scale));
border-radius: 999px;
border: calc(2px * var(--card-scale)) solid var(--el-bg-color-overlay);
box-shadow: var(--el-box-shadow-lighter);
pointer-events: none;
}
@@ -171,7 +163,6 @@
.friend-card__name {
font-size: calc(17px * var(--card-scale));
font-weight: 600;
color: var(--el-text-color-primary);
line-height: 1.2;
overflow: hidden;
text-overflow: ellipsis;
@@ -181,7 +172,6 @@
.friend-card__signature {
margin-top: calc(6px * var(--card-spacing));
font-size: calc(13px * var(--card-scale));
color: var(--el-text-color-secondary);
line-height: 1.4;
overflow: hidden;
text-overflow: ellipsis;
@@ -197,7 +187,6 @@
min-height: calc(40px * var(--card-scale));
padding: calc(6px * var(--card-scale)) calc(10px * var(--card-scale));
border-radius: calc(10px * var(--card-scale));
color: var(--el-text-color-regular);
font-size: calc(12px * var(--card-scale));
line-height: 1.3;
box-sizing: border-box;

4
src/views/Notifications/Notification.vue
View File

@@ -499,9 +499,7 @@
.button-pd-0 {
padding: 0;
}
.ml-5 {
margin-left: 5px !important; /* due to ".el-button + .el-button" */
}
.notification-image {
flex: none;
height: 30px;

10
src/views/PlayerList/components/photonEventColumns.jsx
View File

@@ -169,15 +169,11 @@ function DetailCell({ row, isPrevious, onShowAvatar, onShowGroup, onShowWorld, o
return (
<>
{r.platform === 'Desktop' ? (
<span style="color: var(--el-color-primary)">
Desktop&nbsp;
</span>
<span>Desktop&nbsp;</span>
) : r.platform === 'VR' ? (
<span style="color: var(--el-color-primary)">VR&nbsp;</span>
<span>VR&nbsp;</span>
) : r.platform === 'Quest' ? (
<span style="color: var(--el-color-success)">
Android&nbsp;
</span>
<span>Android&nbsp;</span>
) : null}
<span
class="x-link"

2
src/views/Search/Search.vue
View File

@@ -263,12 +263,10 @@
<span
v-if="avatar.releaseStatus === 'public'"
class="extra"
style="color: var(--el-color-success)"
v-text="avatar.releaseStatus"></span>
<span
v-else-if="avatar.releaseStatus === 'private'"
class="extra"
style="color: var(--el-color-danger)"
v-text="avatar.releaseStatus"></span>
<span v-else class="extra" v-text="avatar.releaseStatus"></span>
<span class="extra" v-text="avatar.authorName"></span>

1
src/views/Sidebar/Sidebar.vue
View File

@@ -179,7 +179,6 @@
<style scoped>
.sidebar-tab-count {
color: var(--el-text-color-secondary);
font-size: 12px;
margin-left: 10px;
}

2
src/views/Tools/Gallery.vue
View File

@@ -1198,13 +1198,11 @@
}
.gallery-tab-count {
color: var(--el-text-color-secondary);
font-size: 12px;
margin-left: 5px;
}
.gallery-meta {
color: var(--el-text-color-secondary);
font-family: monospace;
display: block;
}

5
src/views/Tools/ScreenshotMetadata.vue
View File

@@ -7,7 +7,7 @@
<span class="header">{{ t('dialog.screenshot_metadata.header') }}</span>
</div>
<div v-loading="screenshotMetadataDialog.loading" @dragover.prevent @dragenter.prevent @drop="handleDrop">
<span style="margin-left: 5px; color: var(--el-text-color-secondary); font-family: monospace">{{
<span>{{
t('dialog.screenshot_metadata.drag')
}}</span>
<br />
@@ -101,7 +101,7 @@
v-if="screenshotMetadataDialog.metadata.author"
:userid="screenshotMetadataDialog.metadata.author.id"
:hint="screenshotMetadataDialog.metadata.author.displayName"
style="color: var(--el-text-color-secondary); font-family: monospace" />
/>
<br />
<div class="my-2 w-[90%] ml-17">
<Carousel :opts="{ loop: false }" @init-api="handleScreenshotMetadataCarouselInit">
@@ -146,7 +146,6 @@
<span class="x-link" @click="lookupUser(user)" v-text="user.displayName"></span>
<span
v-if="user.pos"
style="margin-left: 5px; color: var(--el-text-color-secondary); font-family: monospace"
v-text="'(' + user.pos.x + ', ' + user.pos.y + ', ' + user.pos.z + ')'"></span>
<br />
</span>

8
src/views/Tools/Tools.vue
View File

@@ -323,14 +323,12 @@
transition: all 0.2s ease;
&:hover {
background-color: var(--el-color-primary-light-9);
}
.rotation-transition {
font-size: 14px;
margin-right: 8px;
transition: transform 0.3s;
color: var(--el-color-primary);
}
.category-title {
@@ -358,7 +356,6 @@
&:hover {
transform: translateY(-2px);
box-shadow: var(--el-box-shadow-light);
}
.tool-content {
@@ -372,14 +369,11 @@
display: flex;
align-items: center;
justify-content: center;
background-color: var(--el-color-primary-light-9);
border-radius: 12px;
margin-right: 20px;
box-shadow: var(--el-box-shadow-lighter);
i {
font-size: 28px;
color: var(--el-color-primary);
}
}
@@ -389,13 +383,11 @@
.tool-name {
font-size: 18px;
font-weight: 600;
color: var(--el-text-color-primary);
margin-bottom: 4px;
}
.tool-description {
font-size: 14px;
color: var(--el-text-color-secondary);
opacity: 0.8;
}
}

23
src/views/Tools/components/GroupCalendarEventCard.vue
View File

@@ -24,7 +24,7 @@
@mouseleave="scheduleCloseEventPopover">
<div class="flex items-baseline justify-between gap-3 text-xs">
<div class="text-[13px] font-semibold">{{ event.title }}</div>
<div class="whitespace-nowrap text-[var(--el-text-color-regular)]">
<div class="whitespace-nowrap">
{{ formatTimeRange(event.startsAt, event.endsAt) }}
</div>
</div>
@@ -42,19 +42,19 @@
</Button>
</div>
<div class="flex min-w-0 flex-col gap-1">
<div class="text-[var(--el-text-color-regular)]">
<div>
{{ t('dialog.group_calendar.event_card.category') }}
</div>
<div class="font-medium">{{ capitalizeFirst(event.category) }}</div>
</div>
<div class="flex min-w-0 flex-col gap-1">
<div class="text-[var(--el-text-color-regular)]">
<div>
{{ t('dialog.group_calendar.event_card.interested_user') }}
</div>
<div class="font-medium">{{ event.interestedUserCount }}</div>
</div>
<div class="flex min-w-0 flex-col gap-1">
<div class="text-[var(--el-text-color-regular)]">
<div>
{{ t('dialog.group_calendar.event_card.close_time') }}
</div>
<div class="font-medium">
@@ -62,7 +62,7 @@
</div>
</div>
<div class="flex min-w-0 flex-col gap-1">
<div class="text-[var(--el-text-color-regular)]">
<div>
{{ t('dialog.group_calendar.event_card.created') }}
</div>
<div class="font-medium">
@@ -70,7 +70,7 @@
</div>
</div>
<div class="col-span-2 flex min-w-0 flex-col gap-1">
<div class="text-[var(--el-text-color-regular)]">
<div>
{{ t('dialog.group_calendar.event_card.description') }}
</div>
<div class="whitespace-pre-wrap break-words font-normal leading-snug">
@@ -263,7 +263,6 @@
.event-card:hover {
transform: translateY(-2px);
box-shadow: var(--el-box-shadow-light);
}
.event-card.grouped-card {
@@ -312,14 +311,10 @@
height: 24px;
gap: 4px;
border-radius: 50%;
background-color: var(--el-text-color-regular);
color: var(--el-bg-color);
box-shadow: var(--el-box-shadow-lighter);
cursor: pointer;
}
.event-card .badges .following-badge.is-following {
background-color: var(--group-calendar-badge-following, var(--el-color-success));
}
.event-card .badges .share-badge {
@@ -330,9 +325,6 @@
height: 24px;
gap: 4px;
border-radius: 50%;
background-color: var(--el-text-color-regular);
color: var(--el-bg-color);
box-shadow: var(--el-box-shadow-lighter);
cursor: pointer;
margin-right: 5px;
}
@@ -378,7 +370,6 @@
}
.event-card .event-title-content:hover {
color: var(--el-color-primary);
}
.event-card .event-info {
@@ -393,11 +384,9 @@
.grid-view .event-card .event-info {
font-size: 11px;
color: var(--el-text-color-regular);
}
.event-card .event-time {
font-weight: 500;
color: var(--el-color-primary);
}
</style>

6
src/views/Tools/components/GroupCalendarMonth.vue
View File

@@ -187,7 +187,6 @@
}
.calendar-date-content.has-events {
background-color: var(--group-calendar-event-bg, color-mix(in oklch, var(--el-color-primary) 10%, transparent));
}
.calendar-event-badge {
@@ -197,23 +196,19 @@
min-width: 14px;
height: 14px;
border-radius: 9px;
color: var(--el-color-white, #fff);
display: flex;
align-items: center;
justify-content: center;
font-size: 10px;
box-shadow: var(--el-box-shadow-lighter);
z-index: 10;
padding: 0 5px;
line-height: 14px;
}
.calendar-event-badge.has-following {
background-color: var(--group-calendar-badge-following, var(--el-color-success));
}
.calendar-event-badge.no-following {
background-color: var(--group-calendar-badge-normal, var(--el-color-primary));
}
.calendar-event-dot {
@@ -225,7 +220,6 @@
height: 6px;
border-radius: 9999px;
background-color: var(--group-calendar-event-dot, #ef4444);
box-shadow: var(--el-box-shadow-lighter);
z-index: 5;
pointer-events: none;
}

17
src/views/Tools/dialogs/GroupCalendarDialog.vue
View File

@@ -446,12 +446,6 @@
<style scoped>
.x-dialog {
:deep(.el-dialog) {
max-height: 750px;
.el-dialog__body {
height: 680px;
}
}
.top-content {
height: 640px;
position: relative;
@@ -478,7 +472,6 @@
.timeline-timestamp {
font-size: 13px;
font-weight: 600;
color: var(--el-text-color-secondary);
margin-bottom: 8px;
}
@@ -487,7 +480,6 @@
display: flex;
align-items: center;
justify-content: center;
color: var(--el-text-color-secondary);
}
.time-group-container {
display: flex;
@@ -516,7 +508,6 @@
&.has-events {
background-color: var(
--group-calendar-event-bg,
color-mix(in oklch, var(--el-color-primary) 10%, transparent)
);
}
.calendar-event-badge {
@@ -526,21 +517,17 @@
min-width: 16px;
height: 16px;
border-radius: 8px;
color: var(--el-color-white, #fff);
display: flex;
align-items: center;
justify-content: center;
font-size: 10px;
font-weight: bold;
box-shadow: var(--el-box-shadow-lighter);
z-index: 10;
padding: 0 4px;
line-height: 16px;
&.has-following {
background-color: var(--group-calendar-badge-following, var(--el-color-success));
}
&.no-following {
background-color: var(--group-calendar-badge-normal, var(--el-color-primary));
}
}
}
@@ -603,7 +590,6 @@
flex-direction: column;
.search-container {
padding: 2px 20px 12px 20px;
border-bottom: 1px solid var(--el-border-color-lighter);
display: flex;
justify-content: flex-end;
.search-input {
@@ -623,7 +609,6 @@
.group-header {
font-size: 16px;
font-weight: bold;
color: var(--el-text-color-primary);
padding: 4px 12px 10px 12px;
cursor: pointer;
border-radius: 4px;
@@ -635,7 +620,6 @@
font-size: 14px;
margin-right: 8px;
transition: transform 0.3s;
color: var(--el-color-primary);
}
}
.events-row {
@@ -652,7 +636,6 @@
align-items: center;
height: 200px;
font-size: 16px;
color: var(--el-text-color-secondary);
}
}
}