MrUnknownDE/VRCX
1
0
Fork 0
mirror of https://github.com/MrUnknownDE/VRCX.git synced 2026-05-07 06:56:04 +02:00
Code Issues Packages Projects Releases Wiki Activity

use tailwind token for border radius instead of hardcoding values

Browse Source
This commit is contained in:
pa
2026-03-08 22:09:41 +09:00
parent a1090fc064
commit ff47255e07
15 changed files with 40 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/dialogs/AvatarDialog/AvatarDialog.vue
+1 -1
View File
@@ -13,7 +13,7 @@
:src="avatarDialog.ref.thumbnailImageUrl" :src="avatarDialog.ref.thumbnailImageUrl"
class="cursor-pointer" class="cursor-pointer"
@click="showFullscreenImageDialog(avatarDialog.ref.imageUrl)" @click="showFullscreenImageDialog(avatarDialog.ref.imageUrl)"
style="width: 160px; height: 120px; border-radius: 12px; object-fit: cover" style="width: 160px; height: 120px; border-radius: var(--radius-xl); object-fit: cover"
loading="lazy" /> loading="lazy" />
</div> </div>
<div style="flex: 1; display: flex; align-items: flex-start; margin-left: 15px"> <div style="flex: 1; display: flex; align-items: flex-start; margin-left: 15px">
src/components/dialogs/GroupDialog/GroupDialog.vue
+10 -4
View File
@@ -12,7 +12,7 @@
<img <img
v-if="!groupDialog.loading" v-if="!groupDialog.loading"
:src="groupDialog.ref.iconUrl" :src="groupDialog.ref.iconUrl"
style="width: 120px; height: 120px; border-radius: 12px" style="width: 120px; height: 120px; border-radius: var(--radius-xl)"
class="cursor-pointer" class="cursor-pointer"
@click="showFullscreenImageDialog(groupDialog.ref.iconUrl)" @click="showFullscreenImageDialog(groupDialog.ref.iconUrl)"
loading="lazy" /> loading="lazy" />
@@ -349,7 +349,13 @@
v-if="!groupDialog.loading" v-if="!groupDialog.loading"
:src="groupDialog.ref.bannerUrl" :src="groupDialog.ref.bannerUrl"
class="cursor-pointer" class="cursor-pointer"
style="flex: none; width: 100%; aspect-ratio: 6/1; object-fit: cover; border-radius: 4px" style="
flex: none;
width: 100%;
aspect-ratio: 6/1;
object-fit: cover;
border-radius: var(--radius-md);
"
@click="showFullscreenImageDialog(groupDialog.ref.bannerUrl)" @click="showFullscreenImageDialog(groupDialog.ref.bannerUrl)"
loading="lazy" /> loading="lazy" />
</div> </div>
@@ -420,7 +426,7 @@
flex: none; flex: none;
width: 60px; width: 60px;
height: 60px; height: 60px;
border-radius: 4px; border-radius: var(--radius-md);
object-fit: cover; object-fit: cover;
" "
@click="showFullscreenImageDialog(groupDialog.announcement.imageUrl)" @click="showFullscreenImageDialog(groupDialog.announcement.imageUrl)"
@@ -774,7 +780,7 @@
flex: none; flex: none;
width: 60px; width: 60px;
height: 60px; height: 60px;
border-radius: 4px; border-radius: var(--radius-md);
object-fit: cover; object-fit: cover;
" "
@click="showFullscreenImageDialog(post.imageUrl)" @click="showFullscreenImageDialog(post.imageUrl)"
src/components/dialogs/GroupDialog/GroupPostEditDialog.vue
+1 -1
View File
@@ -91,7 +91,7 @@
flex: none; flex: none;
width: 60px; width: 60px;
height: 60px; height: 60px;
border-radius: 4px; border-radius: var(--radius-md);
object-fit: cover; object-fit: cover;
" "
@click="showFullscreenImageDialog(gallerySelectDialog.selectedImageUrl)" @click="showFullscreenImageDialog(gallerySelectDialog.selectedImageUrl)"
src/components/dialogs/SendBoopDialog.vue
+1 -1
View File
@@ -37,7 +37,7 @@
v-for="image in emojiTable" v-for="image in emojiTable"
:key="image.id" :key="image.id"
:class="image.id === fileId ? 'x-image-selected' : ''" :class="image.id === fileId ? 'x-image-selected' : ''"
style="cursor: pointer; border: 1px solid transparent; border-radius: 8px" style="cursor: pointer; border: 1px solid transparent; border-radius: var(--radius-xl)"
@click="fileId = image.id"> @click="fileId = image.id">
<div <div
v-if=" v-if="
src/components/dialogs/UserDialog/UserSummaryHeader.vue
+4 -4
View File
@@ -8,14 +8,14 @@
" "
class="cursor-pointer" class="cursor-pointer"
:src="userDialog.ref.profilePicOverrideThumbnail || userDialog.ref.profilePicOverride" :src="userDialog.ref.profilePicOverrideThumbnail || userDialog.ref.profilePicOverride"
style="height: 120px; width: 213.33px; border-radius: 12px; object-fit: cover" style="height: 120px; width: 213.33px; border-radius: var(--radius-xl); object-fit: cover"
@click="showFullscreenImageDialog(userDialog.ref.profilePicOverride)" @click="showFullscreenImageDialog(userDialog.ref.profilePicOverride)"
loading="lazy" /> loading="lazy" />
<img <img
v-else-if="!userDialog.loading" v-else-if="!userDialog.loading"
class="cursor-pointer" class="cursor-pointer"
:src="userDialog.ref.currentAvatarThumbnailImageUrl" :src="userDialog.ref.currentAvatarThumbnailImageUrl"
style="height: 120px; width: 160px; border-radius: 12px; object-fit: cover" style="height: 120px; width: 160px; border-radius: var(--radius-xl); object-fit: cover"
@click="showFullscreenImageDialog(userDialog.ref.currentAvatarImageUrl)" @click="showFullscreenImageDialog(userDialog.ref.currentAvatarImageUrl)"
loading="lazy" /> loading="lazy" />
</div> </div>
@@ -179,7 +179,7 @@
flex: none; flex: none;
height: 32px; height: 32px;
width: 32px; width: 32px;
border-radius: 3px; border-radius: var(--radius-sm);
object-fit: cover; object-fit: cover;
margin-top: 5px; margin-top: 5px;
margin-right: 5px; margin-right: 5px;
@@ -237,7 +237,7 @@
<img <img
class="cursor-pointer" class="cursor-pointer"
:src="userImage(userDialog.ref, true, '256', true)" :src="userImage(userDialog.ref, true, '256', true)"
style="flex: none; width: 120px; height: 120px; border-radius: 12px; object-fit: cover" style="flex: none; width: 120px; height: 120px; border-radius: var(--radius-xl); object-fit: cover"
@click="showFullscreenImageDialog(userDialog.ref.userIcon)" @click="showFullscreenImageDialog(userDialog.ref.userIcon)"
loading="lazy" /> loading="lazy" />
</div> </div>
src/components/dialogs/WorldDialog/WorldDialog.vue
+1 -1
View File
@@ -13,7 +13,7 @@
v-if="!worldDialog.loading" v-if="!worldDialog.loading"
:src="worldDialog.ref.thumbnailImageUrl" :src="worldDialog.ref.thumbnailImageUrl"
class="cursor-pointer" class="cursor-pointer"
style="width: 160px; height: 120px; border-radius: 12px" style="width: 160px; height: 120px; border-radius: var(--radius-xl)"
@click="showFullscreenImageDialog(worldDialog.ref.imageUrl)" @click="showFullscreenImageDialog(worldDialog.ref.imageUrl)"
loading="lazy" /> loading="lazy" />
</div> </div>
src/views/Favorites/FavoritesAvatar.vue
+3 -3
View File
@@ -1708,7 +1708,7 @@
} }
.group-item { .group-item {
border-radius: 8px; border-radius: var(--radius-lg);
border: 1px solid var(--border); border: 1px solid var(--border);
padding: 8px; padding: 8px;
cursor: pointer; cursor: pointer;
@@ -1913,7 +1913,7 @@
align-items: center; align-items: center;
box-sizing: border-box; box-sizing: border-box;
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: calc(8px * var(--favorites-card-scale, 1)); border-radius: calc(var(--radius-lg) * var(--favorites-card-scale, 1));
padding: var(--favorites-card-padding-y, 8px) var(--favorites-card-padding-x, 10px); padding: var(--favorites-card-padding-y, 8px) var(--favorites-card-padding-x, 10px);
cursor: pointer; cursor: pointer;
transition: background-color 0.15s ease; transition: background-color 0.15s ease;
@@ -1940,7 +1940,7 @@
:deep(.favorites-search-card__avatar) { :deep(.favorites-search-card__avatar) {
width: calc(48px * var(--favorites-card-scale, 1)); width: calc(48px * var(--favorites-card-scale, 1));
height: calc(48px * var(--favorites-card-scale, 1)); height: calc(48px * var(--favorites-card-scale, 1));
border-radius: calc(6px * var(--favorites-card-scale, 1)); border-radius: calc(var(--radius-lg) * var(--favorites-card-scale, 1));
overflow: hidden; overflow: hidden;
flex-shrink: 0; flex-shrink: 0;
} }
src/views/Favorites/FavoritesFriend.vue
+3 -3
View File
@@ -1348,7 +1348,7 @@
} }
.group-item { .group-item {
border-radius: 8px; border-radius: var(--radius-lg);
border: 1px solid var(--border); border: 1px solid var(--border);
padding: 8px; padding: 8px;
cursor: pointer; cursor: pointer;
@@ -1540,7 +1540,7 @@
align-items: center; align-items: center;
box-sizing: border-box; box-sizing: border-box;
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: calc(8px * var(--favorites-card-scale, 1)); border-radius: calc(var(--radius-lg) * var(--favorites-card-scale, 1));
padding: var(--favorites-card-padding-y, 8px) var(--favorites-card-padding-x, 10px); padding: var(--favorites-card-padding-y, 8px) var(--favorites-card-padding-x, 10px);
cursor: pointer; cursor: pointer;
transition: background-color 0.15s ease; transition: background-color 0.15s ease;
@@ -1570,7 +1570,7 @@
:deep(.favorites-search-card__avatar) { :deep(.favorites-search-card__avatar) {
width: calc(48px * var(--favorites-card-scale, 1)); width: calc(48px * var(--favorites-card-scale, 1));
height: calc(48px * var(--favorites-card-scale, 1)); height: calc(48px * var(--favorites-card-scale, 1));
border-radius: calc(6px * var(--favorites-card-scale, 1)); border-radius: calc(var(--radius-lg) * var(--favorites-card-scale, 1));
overflow: hidden; overflow: hidden;
flex-shrink: 0; flex-shrink: 0;
} }
src/views/Favorites/FavoritesWorld.vue
+3 -3
View File
@@ -1579,7 +1579,7 @@
} }
.group-item { .group-item {
border-radius: 8px; border-radius: var(--radius-lg);
border: 1px solid var(--border); border: 1px solid var(--border);
padding: 8px; padding: 8px;
cursor: pointer; cursor: pointer;
@@ -1829,7 +1829,7 @@
align-items: center; align-items: center;
box-sizing: border-box; box-sizing: border-box;
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: calc(8px * var(--favorites-card-scale, 1)); border-radius: calc(var(--radius-lg) * var(--favorites-card-scale, 1));
padding: var(--favorites-card-padding-y, 8px) var(--favorites-card-padding-x, 10px); padding: var(--favorites-card-padding-y, 8px) var(--favorites-card-padding-x, 10px);
cursor: pointer; cursor: pointer;
transition: background-color 0.15s ease; transition: background-color 0.15s ease;
@@ -1859,7 +1859,7 @@
:deep(.favorites-search-card__avatar) { :deep(.favorites-search-card__avatar) {
width: calc(48px * var(--favorites-card-scale, 1)); width: calc(48px * var(--favorites-card-scale, 1));
height: calc(48px * var(--favorites-card-scale, 1)); height: calc(48px * var(--favorites-card-scale, 1));
border-radius: calc(6px * var(--favorites-card-scale, 1)); border-radius: calc(var(--radius-lg) * var(--favorites-card-scale, 1));
overflow: hidden; overflow: hidden;
flex-shrink: 0; flex-shrink: 0;
} }
src/views/FriendsLocations/components/FriendsLocationsCard.vue
+2 -2
View File
@@ -240,7 +240,7 @@
position: relative; position: relative;
display: grid; display: grid;
gap: calc(14px * var(--card-scale) * var(--card-spacing)); gap: calc(14px * var(--card-scale) * var(--card-spacing));
border-radius: 8px; border-radius: var(--radius-lg);
transition: background-color 0.15s ease; transition: background-color 0.15s ease;
width: 100%; width: 100%;
max-width: var(--friend-card-target-width, 220px); max-width: var(--friend-card-target-width, 220px);
@@ -355,7 +355,7 @@
justify-content: center; justify-content: center;
min-height: calc(40px * var(--card-scale)); min-height: calc(40px * var(--card-scale));
padding: calc(6px * var(--card-scale)) calc(10px * var(--card-scale)); padding: calc(6px * var(--card-scale)) calc(10px * var(--card-scale));
border-radius: calc(10px * var(--card-scale)); border-radius: calc(var(--radius-lg) * var(--card-scale));
font-size: calc(12px * var(--card-scale)); font-size: calc(12px * var(--card-scale));
line-height: 1.3; line-height: 1.3;
box-sizing: border-box; box-sizing: border-box;
src/views/PlayerList/PlayerList.vue
+1 -1
View File
@@ -9,7 +9,7 @@
<img <img
:src="currentInstanceWorld.ref.thumbnailImageUrl" :src="currentInstanceWorld.ref.thumbnailImageUrl"
class="cursor-pointer" class="cursor-pointer"
style="flex: none; width: 160px; height: 120px; border-radius: 4px" style="flex: none; width: 160px; height: 120px; border-radius: var(--radius-md)"
@click="showFullscreenImageDialog(currentInstanceWorld.ref.imageUrl)" @click="showFullscreenImageDialog(currentInstanceWorld.ref.imageUrl)"
loading="lazy" /> loading="lazy" />
<div style="margin-left: 10px; display: flex; flex-direction: column; min-width: 320px; width: 100%"> <div style="margin-left: 10px; display: flex; flex-direction: column; min-width: 320px; width: 100%">
src/views/Tools/Tools.vue
+3 -3
View File
@@ -501,7 +501,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
padding: 8px 12px; padding: 8px 12px;
border-radius: 6px; border-radius: var(--radius-lg);
margin-bottom: 12px; margin-bottom: 12px;
transition: all 0.2s ease; transition: all 0.2s ease;
@@ -533,7 +533,7 @@
transition: background-color 0.15s ease; transition: background-color 0.15s ease;
position: relative; position: relative;
overflow: visible; overflow: visible;
border-radius: 8px; border-radius: var(--radius-lg);
cursor: pointer; cursor: pointer;
width: 100%; width: 100%;
@@ -555,7 +555,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
border-radius: 12px; border-radius: var(--radius-xl);
margin-right: 20px; margin-right: 20px;
i { i {
src/views/Tools/components/GroupCalendarEventCard.vue
+2 -2
View File
@@ -258,7 +258,7 @@
transition: background-color 0.15s ease; transition: background-color 0.15s ease;
position: relative; position: relative;
overflow: visible; overflow: visible;
border-radius: 8px; border-radius: var(--radius-lg);
width: 100%; width: 100%;
} }
@@ -287,7 +287,7 @@
cursor: pointer; cursor: pointer;
width: 100%; width: 100%;
object-fit: cover; object-fit: cover;
border-radius: 8px 8px 0 0; border-radius: var(--radius-lg) var(--radius-lg) 0 0;
} }
.timeline-view .event-card .banner { .timeline-view .event-card .banner {
src/views/Tools/components/GroupCalendarMonth.vue
+2 -2
View File
@@ -178,7 +178,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
border-radius: 10px; border-radius: var(--radius-lg);
font-size: 18px; font-size: 18px;
position: relative; position: relative;
} }
@@ -189,7 +189,7 @@
right: -4px; right: -4px;
min-width: 14px; min-width: 14px;
height: 16px; height: 16px;
border-radius: 9px; border-radius: var(--radius-lg);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
src/views/Tools/dialogs/GroupCalendarDialog.vue
+3 -3
View File
@@ -500,7 +500,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
border-radius: 8px; border-radius: var(--radius-xl);
font-size: 18px; font-size: 18px;
position: relative; position: relative;
@@ -513,7 +513,7 @@
right: 2px; right: 2px;
min-width: 16px; min-width: 16px;
height: 16px; height: 16px;
border-radius: 8px; border-radius: var(--radius-xl);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@@ -591,7 +591,7 @@
font-weight: bold; font-weight: bold;
padding: 4px 12px 10px 12px; padding: 4px 12px 10px 12px;
cursor: pointer; cursor: pointer;
border-radius: 4px; border-radius: var(--radius-md);
margin: 0 -12px 10px -12px; margin: 0 -12px 10px -12px;
display: flex; display: flex;
align-items: center; align-items: center;