Restyle subscriptions page (#413)

This commit is contained in:
IceDBorn 2021-09-04 21:30:13 +03:00 committed by GitHub
parent 6c473d58ac
commit 84e2504d5f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -1,11 +1,11 @@
<template> <template>
<h1 class="uk-text-bold uk-text-center">Subscriptions</h1> <h1 class="uk-text-bold uk-text-center">Subscriptions</h1>
<div style="text-align: center">
<button <button
v-if="authenticated" v-if="authenticated"
@click="exportHandler"
class="uk-button uk-button-small" class="uk-button uk-button-small"
style="background: #222" style="background: #222; margin-right: 0.5rem"
type="button" type="button"
> >
<router-link to="/import"> <router-link to="/import">
@ -13,34 +13,37 @@
</router-link> </router-link>
</button> </button>
<br />
<button <button
v-if="authenticated" v-if="authenticated"
@click="exportHandler" @click="exportHandler"
class="uk-button uk-button-small" class="uk-button uk-button-small"
style="background: #222" style="background: #222; color: white"
type="button" type="button"
> >
Export to JSON Export to JSON
</button> </button>
</div>
<hr />
<div :key="subscription.url" v-for="subscription in subscriptions">
<div :key="subscription.url" v-for="subscription in subscriptions" style="text-align: center;">
<div class="uk-text-primary" :style="[{ background: backgroundColor }]"> <div class="uk-text-primary" :style="[{ background: backgroundColor }]">
<a :href="subscription.url"> <a :href="subscription.url">
<img :src="subscription.avatar" class="uk-margin-small-right uk-border-circle" width="50" height="50" /> <img :src="subscription.avatar" class="uk-margin-small-right uk-border-circle" width="96" height="96" />
<span class="uk-text-truncate">{{ subscription.name }}</span> <span class="uk-text-large" style="width: 30rem; display: inline-block; text-align: center; margin-left: 6rem">{{ subscription.name }}</span>
</a> </a>
<button <button
class="uk-button uk-button-small" class="uk-button uk-button-large"
style="background: #222" style="background: #222; margin-left: 0.5rem; width: 185px"
type="button" type="button"
@click="handleButton(subscription)" @click="handleButton(subscription)"
> >
{{ subscription.subscribed ? "Unsubscribe" : "Subscribe" }} {{ subscription.subscribed ? "Unsubscribe" : "Subscribe" }}
</button> </button>
</div> </div>
<br />
</div> </div>
<br />
</template> </template>
<script> <script>