FreeTube/src/renderer/components/ft-share-button/ft-share-button.vue

90 lines
2.0 KiB
Vue
Raw Normal View History

2020-06-17 14:15:36 +02:00
<template>
<ft-icon-button
ref="iconButton"
2020-06-17 14:15:36 +02:00
title="Share Video"
theme="secondary"
icon="share-alt"
2020-06-18 18:01:32 +02:00
dropdown-position-x="left"
2020-06-17 14:15:36 +02:00
:forceDropdown="true"
>
<div class="shareLinks">
<div class="header">
<img class="youtubeLogo" src="~../../assets/img/yt_logo_mono_dark.png" alt="YouTube" width="794" height="178">
</div>
2020-06-17 15:36:44 +02:00
<div class="buttons">
<ft-button
class="action"
@click="copyYoutube()"
>
<font-awesome-icon icon="copy"/>
Copy link
</ft-button>
<ft-button
class="action"
@click="openYoutube()"
>
<font-awesome-icon icon="globe"/>
Open link
</ft-button>
<ft-button
class="action"
2020-06-18 18:01:19 +02:00
backgroundColor="var(--accent-color-active)"
2020-06-17 15:36:44 +02:00
@click="copyYoutubeEmbed()"
>
<font-awesome-icon icon="copy"/>
2020-06-17 15:36:44 +02:00
Copy embed
</ft-button>
<ft-button
class="action"
2020-06-18 18:01:19 +02:00
backgroundColor="var(--accent-color-active)"
2020-06-17 15:36:44 +02:00
@click="openYoutubeEmbed()"
>
<font-awesome-icon icon="globe"/>
2020-06-17 15:36:44 +02:00
Open embed
</ft-button>
</div>
2020-06-17 14:15:36 +02:00
<div class="divider"></div>
2020-06-17 15:36:44 +02:00
<div class="header invidious"><span class="invidiousLogo"/>Invidious</div>
2020-06-17 14:15:36 +02:00
2020-06-17 15:36:44 +02:00
<div class="buttons">
<ft-button
class="action"
@click="copyInvidious()"
>
<font-awesome-icon icon="copy"/>
Copy link
</ft-button>
<ft-button
class="action"
@click="openInvidious()"
>
<font-awesome-icon icon="globe"/>
Open link
</ft-button>
2020-06-17 15:58:06 +02:00
<ft-button
class="action"
2020-06-18 18:01:19 +02:00
backgroundColor="var(--accent-color-active)"
2020-06-17 15:58:06 +02:00
@click="copyInvidiousEmbed()"
>
<font-awesome-icon icon="copy"/>
2020-06-17 15:58:06 +02:00
Copy embed
</ft-button>
<ft-button
class="action"
2020-06-18 18:01:19 +02:00
backgroundColor="var(--accent-color-active)"
2020-06-17 15:58:06 +02:00
@click="openInvidiousEmbed()"
>
<font-awesome-icon icon="globe"/>
2020-06-17 15:58:06 +02:00
Open embed
</ft-button>
2020-06-17 15:36:44 +02:00
</div>
2020-06-17 14:15:36 +02:00
</div>
</ft-icon-button>
</template>
<script src="./ft-share-button.js" />
<style scoped lang="sass" src="./ft-share-button.sass" />