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:
sgenoud 2019-04-10 16:56:24 +02:00 committed by Nolan Lawson
parent ecfbc57aed
commit 49b0633a8d
2 changed files with 15 additions and 1 deletions

View File

@ -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>

View File

@ -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>