TeamPiped-mirror/Piped
1
0
Fork 0
mirror of https://github.com/TeamPiped/Piped.git synced 2024-08-14 23:57:27 +00:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #3210 from kskarthik/master

Browse source 
feat: improve the layout of SubscriptionsPage
This commit is contained in:
Bnyro 2023-12-09 18:27:44 +01:00 committed by GitHub
commit 6a2310d874
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 30 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

49
src/components/SubscriptionsPage.vue
View file

@ -1,35 +1,46 @@
<template> <template>
<h1 v-t="'titles.subscriptions'" class="my-4 text-center font-bold" /> <h1 v-t="'titles.subscriptions'" class="my-4 text-center font-bold" />
<!-- import / export section --> <!-- import / export section -->
<div class="w-full flex justify-between"> <div class="flex flex-wrap justify-between">
<div class="flex gap-2"> <div class="flex gap-1">
<!-- import json/csv -->
<button class="btn"> <button class="btn">
<router-link v-t="'actions.import_from_json_csv'" to="/import" /> <router-link v-t="'actions.import_from_json_csv'" to="/import" />
</button> </button>
<!-- export to json -->
<button v-t="'actions.export_to_json'" class="btn" @click="exportHandler" /> <button v-t="'actions.export_to_json'" class="btn" @click="exportHandler" />
<input </div>
id="fileSelector" <div class="flex gap-1 flex-wrap m-1">
ref="fileSelector" <!-- import channel groups to json-->
type="file" <div>
class="display-none" <label
multiple="multiple" for="fileSelector"
@change="importGroupsHandler" class="btn"
/> v-text="`${$t('actions.import_from_json')} (${$t('titles.channel_groups')})`"
<label />
for="fileSelector" <input
class="btn" id="fileSelector"
v-text="`${$t('actions.import_from_json')} (${$t('titles.channel_groups')})`" ref="fileSelector"
/> type="file"
class="hidden"
multiple="multiple"
@change="importGroupsHandler"
/>
</div>
<!-- export channel groups to json -->
<button <button
class="btn" class="btn"
@click="exportGroupsHandler" @click="exportGroupsHandler"
v-text="`${$t('actions.export_to_json')} (${$t('titles.channel_groups')})`" v-text="`${$t('actions.export_to_json')} (${$t('titles.channel_groups')})`"
/> />
</div> </div>
<!-- subscriptions count, only shown if there are any --> <div class="flex gap-1 self-center">
<i18n-t v-if="subscriptions.length > 0" keypath="subscriptions.subscribed_channels_count">{{ <!-- subscriptions count, only shown if there are any -->
subscriptions.length <i18n-t v-if="subscriptions.length > 0" keypath="subscriptions.subscribed_channels_count">{{
}}</i18n-t> subscriptions.length
}}</i18n-t>
</div>
</div> </div>
<br /> <br />
<hr /> <hr />