replace inline styles with utility classes in dialogs

This commit is contained in:
pa
2026-03-09 18:17:37 +09:00
parent e5500f47be
commit feb04b036f
44 changed files with 148 additions and 301 deletions

View File

@@ -26,7 +26,7 @@
v-slot:[`label-${index}`]>
<span>
<i class="x-status-icon" style="margin-right: 8px" :class="userFavoriteWorldsStatus(list[1])"> </i>
<span style="font-weight: bold; font-size: 14px" v-text="list[0]"></span>
<span class="font-bold text-sm" v-text="list[0]"></span>
<span style="font-size: 10px; margin-left: 6px"
>{{ list[2].length }}/{{ favoriteLimits.maxFavoritesPerGroup.world }}</span
>

View File

@@ -14,14 +14,7 @@
t('dialog.user.groups.total_count', { count: userDialog.userGroups.groups.length })
}}</span>
<template v-if="userDialogGroupEditMode">
<span
style="
margin-left: 8px;
font-size: 10px;
"
>{{ t('dialog.user.groups.hold_shift') }}</span
>
<span class="text-[10px]" style="margin-left: 8px">{{ t('dialog.user.groups.hold_shift') }}</span>
</template>
</div>
<div style="display: flex; align-items: center">
@@ -240,8 +233,8 @@
</template>
<template v-else>
<template v-if="userDialog.userGroups.ownGroups.length > 0">
<span style="font-weight: bold; font-size: 16px">{{ t('dialog.user.groups.own_groups') }}</span>
<span style="font-size: 12px; margin-left: 6px"
<span class="text-base font-bold">{{ t('dialog.user.groups.own_groups') }}</span>
<span class="text-xs ml-1.5"
>{{ userDialog.userGroups.ownGroups.length }}/{{
// @ts-ignore
cachedConfig?.constants?.GROUPS?.MAX_OWNED
@@ -281,8 +274,8 @@
</div>
</template>
<template v-if="userDialog.userGroups.mutualGroups.length > 0">
<span style="font-weight: bold; font-size: 16px">{{ t('dialog.user.groups.mutual_groups') }}</span>
<span style="font-size: 12px; margin-left: 6px">{{ userDialog.userGroups.mutualGroups.length }}</span>
<span class="text-base font-bold">{{ t('dialog.user.groups.mutual_groups') }}</span>
<span class="text-xs ml-1.5">{{ userDialog.userGroups.mutualGroups.length }}</span>
<div class="flex flex-wrap items-start" style="margin-top: 8px; margin-bottom: 16px; min-height: 60px">
<div
v-for="group in userDialog.userGroups.mutualGroups"
@@ -317,8 +310,8 @@
</div>
</template>
<template v-if="userDialog.userGroups.remainingGroups.length > 0">
<span style="font-weight: bold; font-size: 16px">{{ t('dialog.user.groups.groups') }}</span>
<span style="font-size: 12px; margin-left: 6px">
<span class="text-base font-bold">{{ t('dialog.user.groups.groups') }}</span>
<span class="text-xs ml-1.5">
{{ userDialog.userGroups.remainingGroups.length }}
<template v-if="currentUser.id === userDialog.id">
/

View File

@@ -78,15 +78,8 @@
<div class="flex-1 overflow-hidden" @click="isEditNoteAndMemoDialogVisible = true">
<span class="block truncate font-medium leading-[18px]">{{ t('dialog.user.info.note') }}</span>
<pre
class="text-xs"
style="
font-family: inherit;
font-size: 12px;
white-space: pre-wrap;
margin: 0 0.5em 0 0;
max-height: 210px;
overflow-y: auto;
"
class="text-xs font-[inherit]"
style="white-space: pre-wrap; margin: 0 0.5em 0 0; max-height: 210px; overflow-y: auto"
>{{ userDialog.note }}</pre
>
</div>
@@ -97,15 +90,8 @@
<div class="flex-1 overflow-hidden" @click="isEditNoteAndMemoDialogVisible = true">
<span class="block truncate font-medium leading-[18px]">{{ t('dialog.user.info.memo') }}</span>
<pre
class="text-xs"
style="
font-family: inherit;
font-size: 12px;
white-space: pre-wrap;
margin: 0 0.5em 0 0;
max-height: 210px;
overflow-y: auto;
"
class="text-xs font-[inherit]"
style="white-space: pre-wrap; margin: 0 0.5em 0 0; max-height: 210px; overflow-y: auto"
>{{ userDialog.memo }}</pre
>
</div>
@@ -180,15 +166,8 @@
<div class="flex-1 overflow-hidden">
<span class="block truncate font-medium leading-[18px]">{{ t('dialog.user.info.bio') }}</span>
<pre
class="text-xs truncate"
style="
font-family: inherit;
font-size: 12px;
white-space: pre-wrap;
margin: 0 0.5em 0 0;
max-height: 210px;
overflow-y: auto;
"
class="text-xs truncate font-[inherit]"
style="white-space: pre-wrap; margin: 0 0.5em 0 0; max-height: 210px; overflow-y: auto"
>{{ bioCache.translated || userDialog.ref.bio || '-' }}</pre
>
<div style="float: right">

View File

@@ -52,8 +52,8 @@
@click="copyUserDisplayName(userDialog.ref.displayName)"></span>
<TooltipWrapper v-if="userDialog.ref.pronouns" side="top" :content="t('dialog.user.pronouns')">
<span
class="x-grey"
style="margin-right: 6px; font-family: monospace; font-size: 12px"
class="x-grey font-mono text-xs"
style="margin-right: 6px"
v-text="userDialog.ref.pronouns"></span>
</TooltipWrapper>
<TooltipWrapper v-for="item in userDialog.ref.$languages" :key="item.key" side="top">
@@ -68,8 +68,8 @@
<template v-if="userDialog.ref.id === currentUser.id">
<br />
<span
class="x-grey"
style="margin-right: 8px; font-family: monospace; font-size: 12px; cursor: pointer"
class="x-grey font-mono text-xs"
style="margin-right: 8px; cursor: pointer"
v-text="currentUser.username"
@click="copyUserDisplayName(currentUser.username)"></span>
</template>
@@ -197,12 +197,9 @@
<div style="display: block; width: 275px; word-break: normal">
<span>{{ badge.badgeName }}</span>
<br />
<span class="x-grey" style="font-size: 12px">{{ badge.badgeDescription }}</span>
<span class="x-grey text-xs">{{ badge.badgeDescription }}</span>
<br />
<span
v-if="badge.assignedAt"
class="x-grey"
style="font-family: monospace; font-size: 12px">
<span v-if="badge.assignedAt" class="x-grey font-mono text-xs">
{{ t('dialog.user.badges.assigned') }}:
{{ formatDateFilter(badge.assignedAt, 'long') }}
</span>
@@ -229,7 +226,7 @@
</TooltipWrapper>
</div>
<div>
<span style="font-size: 12px" v-text="userDialog.ref.statusDescription"></span>
<span class="text-xs" v-text="userDialog.ref.statusDescription"></span>
</div>
</div>