44107c0734
Some checks failed
Build and publish / build (push) Failing after 19s
Source moved verbatim from mp/shop/ on 2026-04-29; mp was the first concrete adapter consuming the libreshop toolkit. Builds and publishes git.librete.ch/libreshop/shop on every main / v* push via the standard .gitea/workflows/build.yml shared across libreshop components.
67 lines
2.1 KiB
Vue
67 lines
2.1 KiB
Vue
<template>
|
|
<div class="animate-pulse">
|
|
<!-- Form skeleton -->
|
|
<div v-if="variant === 'form'" class="space-y-6">
|
|
<div v-for="i in fields" :key="i" class="space-y-2">
|
|
<div class="h-4 w-24 bg-gray-200 rounded"></div>
|
|
<div class="h-12 bg-gray-200 rounded-lg"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Delivery methods skeleton -->
|
|
<div v-else-if="variant === 'delivery'" class="space-y-4">
|
|
<div class="h-5 w-48 bg-gray-200 rounded mb-4"></div>
|
|
<div v-for="i in 3" :key="i" class="p-5 border-2 border-gray-200 rounded-lg">
|
|
<div class="flex justify-between">
|
|
<div class="space-y-2">
|
|
<div class="h-5 w-32 bg-gray-200 rounded"></div>
|
|
<div class="h-4 w-48 bg-gray-200 rounded"></div>
|
|
<div class="h-4 w-20 bg-gray-200 rounded mt-2"></div>
|
|
</div>
|
|
<div class="h-5 w-5 bg-gray-200 rounded-full"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Order summary skeleton -->
|
|
<div v-else-if="variant === 'summary'" class="space-y-4">
|
|
<div v-for="i in 2" :key="i" class="flex gap-4">
|
|
<div class="h-20 w-20 bg-gray-200 rounded"></div>
|
|
<div class="flex-1 space-y-2">
|
|
<div class="h-4 w-3/4 bg-gray-200 rounded"></div>
|
|
<div class="h-4 w-1/2 bg-gray-200 rounded"></div>
|
|
<div class="h-4 w-20 bg-gray-200 rounded"></div>
|
|
</div>
|
|
</div>
|
|
<hr class="my-4" />
|
|
<div class="space-y-2">
|
|
<div class="flex justify-between">
|
|
<div class="h-4 w-24 bg-gray-200 rounded"></div>
|
|
<div class="h-4 w-16 bg-gray-200 rounded"></div>
|
|
</div>
|
|
<div class="flex justify-between">
|
|
<div class="h-4 w-20 bg-gray-200 rounded"></div>
|
|
<div class="h-4 w-16 bg-gray-200 rounded"></div>
|
|
</div>
|
|
<div class="flex justify-between pt-2">
|
|
<div class="h-5 w-16 bg-gray-200 rounded"></div>
|
|
<div class="h-5 w-20 bg-gray-200 rounded"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Button skeleton -->
|
|
<div v-if="showButton" class="mt-8">
|
|
<div class="h-12 bg-gray-200 rounded-full w-full"></div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
defineProps<{
|
|
variant: "form" | "delivery" | "summary";
|
|
fields?: number;
|
|
showButton?: boolean;
|
|
}>();
|
|
</script>
|