feat: Add a shortcut to opening the cards link (#1134)
* Add a shortcut to opening the cards link * minor aesthetic tweaks
This commit is contained in:
parent
ecfbc57aed
commit
49b0633a8d
|
@ -29,6 +29,7 @@
|
||||||
<li><kbd>r</kbd> to reply</li>
|
<li><kbd>r</kbd> to reply</li>
|
||||||
<li><kbd>m</kbd> to mention the author</li>
|
<li><kbd>m</kbd> to mention the author</li>
|
||||||
<li><kbd>p</kbd> to open the author's profile</li>
|
<li><kbd>p</kbd> to open the author's profile</li>
|
||||||
|
<li><kbd>l</kbd> to open the card's link in a new tab</li>
|
||||||
<li><kbd>x</kbd> to show or hide text behind content warning</li>
|
<li><kbd>x</kbd> to show or hide text behind content warning</li>
|
||||||
<li><kbd>y</kbd> to show or hide sensitive media</li>
|
<li><kbd>y</kbd> to show or hide sensitive media</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<a href="{url}" class="status-card" target="_blank" rel="noopener noreferrer">
|
<a ref:cardlink href={url} class="status-card" target="_blank" rel="noopener noreferrer">
|
||||||
<strong class="card-title">
|
<strong class="card-title">
|
||||||
{title}
|
{title}
|
||||||
</strong>
|
</strong>
|
||||||
|
@ -12,6 +12,9 @@
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
|
{#if enableShortcuts}
|
||||||
|
<Shortcut scope={shortcutScope} key="l" on:pressed="open(url)" />
|
||||||
|
{/if}
|
||||||
</a>
|
</a>
|
||||||
<style>
|
<style>
|
||||||
.status-card {
|
.status-card {
|
||||||
|
@ -72,9 +75,11 @@
|
||||||
</style>
|
</style>
|
||||||
<script>
|
<script>
|
||||||
import LazyImage from '../LazyImage.html'
|
import LazyImage from '../LazyImage.html'
|
||||||
|
import Shortcut from '../shortcut/Shortcut.html'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
|
Shortcut,
|
||||||
LazyImage
|
LazyImage
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
@ -83,6 +88,14 @@
|
||||||
url: ({ card }) => card.url,
|
url: ({ card }) => card.url,
|
||||||
description: ({ card }) => card.description || card.provider_name,
|
description: ({ card }) => card.description || card.provider_name,
|
||||||
imageUrl: ({ card }) => card.image
|
imageUrl: ({ card }) => card.image
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
open () {
|
||||||
|
if (this.refs.cardlink) {
|
||||||
|
this.refs.cardlink.click()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
Loading…
Reference in a new issue