wanwu/sub2api
1
0
Fork 0
mirror of https://gitee.com/wanwujie/sub2api synced 2026-04-20 22:54:45 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: streamline purchase embed layout with floating open button

Browse Source
This commit is contained in:
erio
2026-02-28 15:26:16 +08:00
parent 19925e22d9
commit 9230d3cbc9
2 changed files with 17 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
backend/cmd/server/VERSION
View File

@@ -1 +1 @@
0.1.87.3 0.1.87.4

41
frontend/src/views/user/PurchaseSubscriptionView.vue
View File

@@ -1,30 +1,6 @@
<template> <template>
<AppLayout> <AppLayout>
<div class="purchase-page-layout"> <div class="purchase-page-layout">
<div class="flex items-start justify-between gap-4">
<div>
<h2 class="text-lg font-semibold text-gray-900 dark:text-white">
{{ t('purchase.title') }}
</h2>
<p class="mt-1 text-sm text-gray-500 dark:text-dark-400">
{{ t('purchase.description') }}
</p>
</div>
<div class="flex items-center gap-2">
<a
v-if="isValidUrl"
:href="purchaseUrl"
target="_blank"
rel="noopener noreferrer"
class="btn btn-secondary btn-sm"
>
<Icon name="externalLink" size="sm" class="mr-1.5" :stroke-width="2" />
{{ t('purchase.openInNewTab') }}
</a>
</div>
</div>
<div class="card flex-1 min-h-0 overflow-hidden"> <div class="card flex-1 min-h-0 overflow-hidden">
<div v-if="loading" class="flex h-full items-center justify-center py-12"> <div v-if="loading" class="flex h-full items-center justify-center py-12">
<div <div
@@ -71,6 +47,15 @@
</div> </div>
<div v-else class="purchase-embed-shell"> <div v-else class="purchase-embed-shell">
<a
:href="purchaseUrl"
target="_blank"
rel="noopener noreferrer"
class="btn btn-secondary btn-sm purchase-open-fab"
>
<Icon name="externalLink" size="sm" class="mr-1.5" :stroke-width="2" />
{{ t('purchase.openInNewTab') }}
</a>
<iframe <iframe
:src="purchaseUrl" :src="purchaseUrl"
class="purchase-embed-frame" class="purchase-embed-frame"
@@ -176,16 +161,22 @@ onUnmounted(() => {
<style scoped> <style scoped>
.purchase-page-layout { .purchase-page-layout {
@apply flex flex-col gap-6; @apply flex flex-col;
height: calc(100vh - 64px - 4rem); height: calc(100vh - 64px - 4rem);
} }
.purchase-embed-shell { .purchase-embed-shell {
@apply relative;
@apply h-full w-full overflow-auto rounded-2xl; @apply h-full w-full overflow-auto rounded-2xl;
@apply bg-gradient-to-b from-gray-50 to-white dark:from-dark-900 dark:to-dark-950; @apply bg-gradient-to-b from-gray-50 to-white dark:from-dark-900 dark:to-dark-950;
@apply p-3 sm:p-4; @apply p-3 sm:p-4;
} }
.purchase-open-fab {
@apply absolute right-3 top-3 z-10;
@apply shadow-sm backdrop-blur supports-[backdrop-filter]:bg-white/80;
}
.purchase-embed-frame { .purchase-embed-frame {
display: block; display: block;
margin: 0 auto; margin: 0 auto;