diff --git a/ui/component/claimPreviewTile/view.jsx b/ui/component/claimPreviewTile/view.jsx
index e95673ddf..3ffe7a484 100644
--- a/ui/component/claimPreviewTile/view.jsx
+++ b/ui/component/claimPreviewTile/view.jsx
@@ -225,18 +225,21 @@ function ClaimPreviewTile(props: Props) {
)}
-
-
-
- {isChannel && (
-
-
-
- )}
- {/* CHECK CLAIM MENU LIST PARAMS (IS REPOST?) */}
-
-
-
+
+
+
+
+ {isChannel && (
+
+
+
+ )}
+
+
+ {/* CHECK CLAIM MENU LIST PARAMS (IS REPOST?) */}
+
+
+
{isChannel ? (
diff --git a/ui/scss/component/_claim-list.scss b/ui/scss/component/_claim-list.scss
index b029bc046..d16439fe2 100644
--- a/ui/scss/component/_claim-list.scss
+++ b/ui/scss/component/_claim-list.scss
@@ -471,7 +471,7 @@
cursor: pointer;
.claim__menu-button {
- display: block;
+ opacity: 1;
}
.collection-preview__overlay-thumbs {
opacity: 1;
@@ -536,11 +536,6 @@
font-size: var(--font-small);
min-height: 2rem;
- .claim__menu-button {
- right: 0.2rem;
- top: var(--spacing-s);
- }
-
@media (min-width: $breakpoint-small) {
min-height: 2.5rem;
padding-right: var(--spacing-m);
@@ -737,6 +732,23 @@
}
}
+.claim-tile__header {
+ position: relative;
+
+ .claim__menu-button {
+ right: 0.2rem;
+ top: var(--spacing-s);
+
+ &:focus {
+ opacity: 1;
+ .icon {
+ background-color: var(--color-button-alt-bg);
+ border-radius: var(--border-radius);
+ }
+ }
+ }
+}
+
.claim__menu-button {
position: absolute;
top: var(--spacing-xs);
@@ -748,7 +760,7 @@
@media (min-width: $breakpoint-small) {
&:not([aria-expanded='true']) {
- display: none;
+ opacity: 0;
}
}
}