MrSphay/Modrinth-plus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix:icon too bright (#5335)

Browse Source
This commit is contained in:
Truman Gao
2026-02-08 17:59:00 -07:00
committed by GitHub
parent 57e012f9b7
commit a3bc35c303
2 changed files with 11 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
packages/ui/src/components/base/SmartClickable.vue
View File

@@ -31,6 +31,11 @@ defineOptions({
:deep(.smart-clickable\:allow-pointer-events) { :deep(.smart-clickable\:allow-pointer-events) {
pointer-events: all; pointer-events: all;
} }
:deep(.ease-brightness) {
opacity: 1;
transition: opacity 0.125s ease-out;
}
} }
} }
@@ -54,6 +59,10 @@ defineOptions({
:deep(.smart-clickable\:highlight-on-hover) { :deep(.smart-clickable\:highlight-on-hover) {
filter: brightness(var(--hover-brightness, 1.25)); filter: brightness(var(--hover-brightness, 1.25));
} }
:deep(.ease-brightness) {
opacity: 0.85;
transition: opacity 0.125s ease-out;
}
} }
:first-child:focus-visible + .smart-clickable__contents { :first-child:focus-visible + .smart-clickable__contents {

4
packages/ui/src/components/project/card/ProjectCard.vue
View File

@@ -27,7 +27,7 @@
</div> </div>
<div class="p-4 flex flex-col gap-3 grow"> <div class="p-4 flex flex-col gap-3 grow">
<div class="flex gap-3"> <div class="flex gap-3">
<Avatar :src="iconUrl" size="96px" class="project-card__icon" no-shadow /> <Avatar :src="iconUrl" size="96px" class="project-card__icon ease-brightness" no-shadow />
<div class="flex flex-col gap-2 w-full"> <div class="flex flex-col gap-2 w-full">
<div class="grid grid-cols-[1fr_auto] gap-4"> <div class="grid grid-cols-[1fr_auto] gap-4">
<div class="flex flex-col gap-1"> <div class="flex flex-col gap-1">
@@ -84,7 +84,7 @@
<Avatar <Avatar
:src="iconUrl" :src="iconUrl"
size="100px" size="100px"
class="project-card__icon grid-project-card-list__icon" class="project-card__icon grid-project-card-list__icon ease-brightness"
no-shadow no-shadow
/> />
<div class="flex flex-col gap-2 grid-project-card-list__info"> <div class="flex flex-col gap-2 grid-project-card-list__info">