Instead of blocking all interaction, only block interaction in places

that matter
This commit is contained in:
Henry Jameson 2020-11-02 23:43:32 +02:00
parent f0a66448ee
commit e351665bb3
11 changed files with 45 additions and 2 deletions

View File

@ -120,5 +120,9 @@
color: $fallback--text;
color: var(--text, $fallback--text);
}
._misclick-prevention & {
pointer-events: none !important;
}
}
</style>

View File

@ -35,6 +35,10 @@
color: $fallback--cOrange;
color: var(--cOrange, $fallback--cOrange);
}
._misclick-prevention & {
pointer-events: none !important;
}
}
&.-favorited {

View File

@ -107,6 +107,10 @@
color: $fallback--text;
color: var(--text, $fallback--text);
}
._misclick-prevention & {
pointer-events: none !important;
}
}
</style>

View File

@ -34,6 +34,10 @@
color: $fallback--cBlue;
color: var(--cBlue, $fallback--cBlue);
}
._misclick-prevention & {
pointer-events: none !important;
}
}
}
</style>

View File

@ -45,6 +45,10 @@
color: $fallback--cGreen;
color: var(--cGreen, $fallback--cGreen);
}
._misclick-prevention & {
pointer-events: none !important;
}
}
&.-repeated {

View File

@ -59,6 +59,12 @@ $status-margin: 0.75em;
justify-content: flex-end;
}
.user-avatar {
._misclick-prevention & {
pointer-events: none !important;
}
}
.left-side {
margin-right: $status-margin;
}
@ -108,6 +114,10 @@ $status-margin: 0.75em;
a {
display: inline-block;
word-break: break-all;
._misclick-prevention & {
pointer-events: none !important;
}
}
}
@ -250,6 +260,10 @@ $status-margin: 0.75em;
vertical-align: middle;
object-fit: contain;
}
._misclick-prevention & a {
pointer-events: none !important;
}
}
.status-fadein {

View File

@ -119,6 +119,7 @@
>
<router-link
:to="userProfileLink"
class="user-avatar"
@click.stop.prevent.capture.native="toggleUserExpanded"
>
<UserAvatar

View File

@ -240,6 +240,10 @@ $status-margin: 0.75em;
word-wrap: break-word;
word-break: break-word;
._misclick-prevention & :not(.attachments) a {
pointer-events: none !important;
}
blockquote {
margin: 0.2em 0 0.2em 2em;
font-style: italic;

View File

@ -72,7 +72,7 @@ const Timeline = {
},
classes () {
let rootClasses = !this.embedded ? ['panel', 'panel-default'] : []
if (this.blockingClicks) rootClasses = rootClasses.concat(['-blocked'])
if (this.blockingClicks) rootClasses = rootClasses.concat(['-blocked', '_misclick-prevention'])
return {
root: rootClasses,
header: ['timeline-heading'].concat(!this.embedded ? ['panel-heading'] : []),

View File

@ -113,7 +113,7 @@
}
&.-blocked {
pointer-events: none;
cursor: progress;
}
}

View File

@ -282,6 +282,10 @@
.user-card {
position: relative;
._misclick-prevention & {
pointer-events: none !important;
}
&:hover .Avatar {
--_still-image-img-visibility: visible;
--_still-image-canvas-visibility: hidden;