sugoidogo/modrinth
1
0
Fork 0
mirror of https://github.com/modrinth/code.git synced 2026-08-31 12:05:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

do not apply opacity on lock or spiner icons

Browse Source
This commit is contained in:
tdgao
2026-03-23 13:03:56 -06:00
parent d01e9d7d52
commit 1999e79188
1 changed files with 7 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui/src/components/servers/ServerListing.vue
+7 -6
View File
@@ -5,7 +5,7 @@
class="flex flex-row items-center overflow-x-hidden rounded-2xl border-[1px] border-solid border-surface-5 bg-bg-raised p-4 transition-transform duration-100"
:class="{
'!rounded-b-none border-b-0': hasNotice,
'opacity-70 bg-surface-2': isDisabled,
'bg-surface-2': isDisabled,
'active:scale-95': !isDisabled && !hasNotice,
}"
data-pyro-server-listing
@@ -15,17 +15,18 @@
v-if="isProvisioning || isUpgrading"
class="flex size-16 items-center justify-center rounded-xl border-[1px] border-solid border-button-border bg-button-bg shadow-sm"
>
<ServerIcon :image="image ?? undefined" />
<SpinnerIcon class="size-8 animate-spin text-constrast brightness-200 absolute" />
<ServerIcon class="opacity-70" :image="image ?? undefined" />
<SpinnerIcon class="size-8 animate-spin absolute" />
</div>
<div
v-else-if="status === 'suspended'"
class="bg-bg-secondary flex size-16 items-center justify-center rounded-xl border-[1px] border-solid border-button-border bg-button-bg shadow-sm"
class="flex size-16 items-center justify-center rounded-xl border-[1px] border-solid border-button-border bg-button-bg shadow-sm"
>
<LockIcon class="size-12 text-secondary" />
<ServerIcon class="opacity-70" :image="image ?? undefined" />
<LockIcon class="size-8 absolute" />
</div>
<ServerIcon v-else :image="image ?? undefined" />
<div class="ml-4 flex flex-col gap-2.5">
<div class="ml-4 flex flex-col gap-2.5" :class="{ 'opacity-70': isDisabled }">
<div class="flex flex-row items-center gap-2">
<h2 class="m-0 text-xl font-bold text-contrast">{{ name }}</h2>
<div