Update external link visibility to use opacity transition (#7786)

Replaces 'hidden' and 'inline-block' classes with 'opacity-0' and 'group-hover:opacity-100' for external link icons in multiple components. This change enables smoother transitions and better control over the visibility of external link icons on hover.
pull/7791/head
Ryan Wang 2025-10-02 11:53:43 +08:00 committed by GitHub
parent 2f561d47a8
commit 80d407cc6d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 5 additions and 5 deletions

View File

@ -74,7 +74,7 @@ const commentText = computed(() => {
<a
target="_blank"
:href="externalUrl"
class="hidden text-gray-600 transition-all hover:text-gray-900 group-hover:inline-block"
class="text-gray-600 opacity-0 transition-all hover:text-gray-900 group-hover:opacity-100"
>
<IconExternalLinkLine class="h-3.5 w-3.5" />
</a>

View File

@ -75,7 +75,7 @@ const commentText = computed(() => {
<a
target="_blank"
:href="externalUrl"
class="hidden text-gray-600 transition-all hover:text-gray-900 group-hover:inline-block"
class="text-gray-600 opacity-0 transition-all hover:text-gray-900 group-hover:opacity-100"
>
<IconExternalLinkLine class="h-3.5 w-3.5" />
</a>

View File

@ -51,7 +51,7 @@ const emit = defineEmits<{
<a
target="_blank"
:href="tag.status?.permalink"
class="hidden text-gray-600 transition-all hover:text-gray-900 group-hover:inline-block"
class="text-gray-600 opacity-0 transition-all hover:text-gray-900 group-hover:opacity-100"
>
<IconExternalLinkLine class="h-3.5 w-3.5" />
</a>

View File

@ -104,7 +104,7 @@ const commentText = computed(() => {
target="_blank"
:href="previewUrl"
:title="previewUrl"
class="hidden text-gray-600 transition-all hover:text-gray-900 group-hover:inline-block"
class="text-gray-600 opacity-0 transition-all hover:text-gray-900 group-hover:opacity-100"
>
<IconExternalLinkLine class="h-3.5 w-3.5" />
</a>

View File

@ -161,7 +161,7 @@ function handleDelete() {
<a
target="_blank"
:href="externalUrl"
class="hidden text-gray-600 transition-all hover:text-gray-900 group-hover:inline-block"
class="text-gray-600 opacity-0 transition-all hover:text-gray-900 group-hover:opacity-100"
>
<IconExternalLinkLine class="h-3.5 w-3.5" />
</a>