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

improve mobile layout of the subscriptions page

Browse source
This commit is contained in:
Bnyro 2022-07-28 19:58:57 +02:00
parent d35ad02c7c
commit aaeac2ff7f
2 changed files with 7 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/App.vue
View file

@ -106,7 +106,7 @@ b {
}
.btn {
@apply py-2 px-4 rounded cursor-pointer;
@apply h-full py-2 <md:(px-2) md:(px-4) rounded cursor-pointer;
}
.reset {
@ -132,10 +132,6 @@ b {
@apply h-8;
}
.btn {
@apply h-full;
}
.checkbox {
@apply h-4 w-4;
}

12
src/components/SubscriptionsPage.vue
View file

@ -1,9 +1,9 @@
<template>
<h1 class="font-bold text-center" v-t="'titles.subscriptions'" />
<h1 class="font-bold text-center my-4" v-t="'titles.subscriptions'" />
<div v-if="authenticated" class="flex justify-between w-full">
<div>
<button class="btn mr-0.5">
<div class="flex">
<button class="btn mx-1">
<router-link to="/import" v-t="'actions.import_from_json'" />
</button>
<button class="btn" @click="exportHandler" v-t="'actions.export_to_json'" />
@ -15,10 +15,10 @@
<div class="grid">
<div class="mb-3" v-for="subscription in subscriptions" :key="subscription.url">
<div class="flex justify-center place-items-center">
<div class="w-full grid grid-cols-3">
<router-link :to="subscription.url" class="col-start-2 block flex text-center font-bold text-4xl">
<div class="w-full flex justify-between items-center">
<router-link :to="subscription.url" class="flex text-center font-bold text-4xl">
<img :src="subscription.avatar" class="rounded-full" width="48" height="48" />
<span v-text="subscription.name" />
<span class="mx-2" v-text="subscription.name" />
</router-link>
<button
class="btn !w-min"