summaryrefslogtreecommitdiff
path: root/packages/frontend/src/components/MkPagePreview.vue
diff options
context:
space:
mode:
Diffstat (limited to 'packages/frontend/src/components/MkPagePreview.vue')
-rw-r--r--packages/frontend/src/components/MkPagePreview.vue19
1 files changed, 18 insertions, 1 deletions
diff --git a/packages/frontend/src/components/MkPagePreview.vue b/packages/frontend/src/components/MkPagePreview.vue
index f6dc00698c..8559d4b96e 100644
--- a/packages/frontend/src/components/MkPagePreview.vue
+++ b/packages/frontend/src/components/MkPagePreview.vue
@@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
-->
<template>
-<MkA :to="`/@${page.user.username}/pages/${page.name}`" class="vhpxefrj" tabindex="-1">
+<MkA :to="`/@${page.user.username}/pages/${page.name}`" class="vhpxefrj">
<div v-if="page.eyeCatchingImage" class="thumbnail">
<MediaImage
:image="page.eyeCatchingImage"
@@ -50,12 +50,29 @@ const props = defineProps<{
<style lang="scss" scoped>
.vhpxefrj {
display: block;
+ position: relative;
&:hover {
text-decoration: none;
color: var(--accent);
}
+ &:focus-within {
+ outline: none;
+
+ &::after {
+ content: "";
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ border-radius: var(--radius);
+ pointer-events: none;
+ box-shadow: inset 0 0 0 2px var(--focus);
+ }
+ }
+
> .thumbnail {
& + article {
border-radius: 0 0 var(--radius) var(--radius);