fix gradient safari
This commit is contained in:
parent
eec6c974c9
commit
90b8137b4d
@ -3,21 +3,19 @@
|
||||
<!-- Background image with overlay -->
|
||||
<div class="absolute inset-0">
|
||||
<img src="/image005.jpg" alt="Background" class="h-full w-full object-cover" />
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-[var(--c-purple)]/70 to-[var(--c-deep-navy)]/80" style="background: linear-gradient(135deg, rgba(76, 29, 149, 0.70), rgba(30, 27, 75, 0.80));"></div>
|
||||
<div
|
||||
class="absolute inset-0 bg-[#1e1b4b]/80"
|
||||
style="background: linear-gradient(135deg, rgba(76, 29, 149, 0.7), rgba(30, 27, 75, 0.8))"
|
||||
></div>
|
||||
</div>
|
||||
|
||||
<div class="relative z-10 mx-auto max-w-5xl px-4">
|
||||
<div
|
||||
class="group relative overflow-hidden rounded-3xl border border-[var(--c-purple)]/30 bg-gradient-to-br from-[var(--card)]/80 to-[var(--card)]/90 p-8 text-center shadow-2xl ring-1 ring-[var(--c-purple)]/40 backdrop-blur-sm md:p-12"
|
||||
class="group relative overflow-hidden rounded-3xl border border-[#4c1d95]/30 bg-[#1e1b4b] p-8 text-center shadow-2xl ring-1 ring-[#4c1d95]/40 backdrop-blur-sm md:p-12"
|
||||
>
|
||||
<!-- Soft radial glows -->
|
||||
<div class="pointer-events-none absolute -top-24 -left-24 h-56 w-56 rounded-full bg-[var(--c-purple)]/25 blur-3xl"></div>
|
||||
<div class="pointer-events-none absolute -right-24 -bottom-24 h-56 w-56 rounded-full bg-[var(--c-gold)]/20 blur-3xl"></div>
|
||||
|
||||
<!-- Hover gold sweep -->
|
||||
<!-- <div
|
||||
class="pointer-events-none absolute inset-0 bg-gradient-to-br from-transparent via-[var(--c-gold)]/10 to-transparent opacity-0 transition-opacity duration-700 group-hover:opacity-100"
|
||||
></div> -->
|
||||
<div class="pointer-events-none absolute -top-24 -left-24 h-56 w-56 rounded-full bg-[#4c1d95]/25 blur-3xl"></div>
|
||||
<div class="pointer-events-none absolute -right-24 -bottom-24 h-56 w-56 rounded-full bg-[#f59e0b]/20 blur-3xl"></div>
|
||||
|
||||
<!-- Subtle pattern overlay -->
|
||||
<div class="absolute inset-0 opacity-10 mix-blend-soft-light">
|
||||
@ -28,19 +26,19 @@
|
||||
|
||||
<div class="relative z-10 flex flex-col items-center">
|
||||
<span
|
||||
class="mb-4 inline-flex items-center rounded-full bg-[var(--c-purple)]/40 px-3 py-1 text-xs font-bold tracking-wider text-[var(--c-white)]/90 ring-1 ring-[var(--c-purple)]/40 backdrop-blur-sm"
|
||||
class="mb-4 inline-flex items-center rounded-full bg-[#4c1d95]/40 px-3 py-1 text-xs font-bold tracking-wider text-white/90 ring-1 ring-[#4c1d95]/40 backdrop-blur-sm"
|
||||
>Consultation</span
|
||||
>
|
||||
|
||||
<h2 class="text-4xl font-black text-[var(--c-white)] drop-shadow-md md:text-5xl">Amplifiez Votre Oracle</h2>
|
||||
<p class="mx-auto mt-4 max-w-2xl text-lg text-[var(--c-white)]/90 drop-shadow-md">
|
||||
<h2 class="text-4xl font-black text-white drop-shadow-md md:text-5xl">Amplifiez Votre Oracle</h2>
|
||||
<p class="mx-auto mt-4 max-w-2xl text-lg text-white/90 drop-shadow-md">
|
||||
Pour une guidance plus approfondie, réservez une consultation personnalisée avec Kris Saint Ange.
|
||||
</p>
|
||||
|
||||
<div class="mt-8 flex flex-col items-center gap-4 sm:flex-row sm:justify-center">
|
||||
<button
|
||||
@click="goToBooking"
|
||||
class="gold-trail-btn relative inline-flex h-12 min-w-[160px] items-center justify-center overflow-hidden rounded-full bg-gradient-to-r from-[var(--c-gold)] to-yellow-400 px-8 font-bold tracking-wide text-[var(--c-purple)] shadow-lg transition-all duration-300 hover:shadow-[var(--c-gold)]/40"
|
||||
class="gold-trail-btn relative inline-flex h-12 min-w-[160px] items-center justify-center overflow-hidden rounded-full bg-gradient-to-r from-[#f59e0b] to-[#eab308] px-8 font-bold tracking-wide text-[#1e1b4b] shadow-lg transition-all duration-300 hover:shadow-[#f59e0b]/40"
|
||||
>
|
||||
<span class="relative z-10">Réserver une Consultation</span>
|
||||
<span
|
||||
@ -49,15 +47,13 @@
|
||||
</button>
|
||||
<button
|
||||
@click="goToOffers"
|
||||
class="inline-flex h-12 min-w-[160px] items-center justify-center rounded-full border-2 border-[var(--c-purple)] bg-transparent px-8 font-bold text-[var(--c-white)] backdrop-blur-sm transition-all hover:bg-[var(--c-purple)]"
|
||||
class="inline-flex h-12 min-w-[160px] items-center justify-center rounded-full border-2 border-[#4c1d95] bg-transparent px-8 font-bold text-white backdrop-blur-sm transition-all hover:bg-[#4c1d95]"
|
||||
>
|
||||
Découvrir les Lectures
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<p class="mt-6 text-xs text-[var(--c-white)]/70 backdrop-blur-sm">
|
||||
Paiements sécurisés. Annulation possible 24h avant la session.
|
||||
</p>
|
||||
<p class="mt-6 text-xs text-white/70 backdrop-blur-sm">Paiements sécurisés. Annulation possible 24h avant la session.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -100,13 +96,4 @@ const goToOffers = () => router.visit('/tirage');
|
||||
transition-property: color, background-color, transform, opacity, box-shadow;
|
||||
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
|
||||
/* Custom color variables */
|
||||
:root {
|
||||
--c-purple: #4c1d95;
|
||||
--c-deep-navy: #1e1b4b;
|
||||
--c-white: #ffffff;
|
||||
--c-gold: rgba(245, 158, 11, 0.9);
|
||||
--card: #1e1b4b;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -71,7 +71,7 @@
|
||||
>
|
||||
<button
|
||||
@click="goToShuffle"
|
||||
class="gold-button group relative mt-4 flex h-14 w-full cursor-pointer items-center justify-center overflow-hidden rounded-full bg-gradient-to-r from-amber-400 to-yellow-500 px-8 text-lg font-bold tracking-wide text-white transition-all duration-500 md:h-16 md:w-auto md:px-10"
|
||||
class="gold-button group relative mt-4 flex h-14 w-full cursor-pointer items-center justify-center overflow-hidden rounded-full bg-gradient-to-r from-[var(--c-gold)] to-yellow-600 px-8 text-lg font-bold tracking-wide text-white transition-all duration-500 md:h-16 md:w-auto md:px-10"
|
||||
:class="{ 'shadow-lg shadow-amber-500/40': buttonHover }"
|
||||
@mouseenter="buttonHover = true"
|
||||
@mouseleave="buttonHover = false"
|
||||
|
||||
@ -13,9 +13,9 @@
|
||||
Plus Qu’un Guide,
|
||||
</span>
|
||||
<span class="citadel-script mt-2 block from-yellow-400 to-purple-500 text-5xl md:mt-0 md:ml-2 md:inline-block md:text-6xl">
|
||||
<span class="inline-block cursor-default transition-all duration-500 hover:scale-110 hover:rotate-2">Un</span>
|
||||
<span class="mx-2 inline-block cursor-default transition-all duration-500 hover:scale-110 hover:-rotate-2">Manuscrit</span>
|
||||
<span class="inline-block cursor-default transition-all duration-500 hover:scale-110 hover:rotate-2">Stratégique</span>
|
||||
<span class="inline-block cursor-default transition-all duration-500 hover:scale-110">Un</span>
|
||||
<span class="mx-2 inline-block cursor-default transition-all duration-500 hover:scale-110">Manuscrit</span>
|
||||
<span class="inline-block cursor-default transition-all duration-500 hover:scale-110">Stratégique</span>
|
||||
</span>
|
||||
</h2>
|
||||
|
||||
|
||||
@ -34,7 +34,7 @@
|
||||
<div class="relative z-10 mx-auto grid max-w-6xl grid-cols-1 gap-8 px-4 md:grid-cols-2 lg:grid-cols-3">
|
||||
<!-- Free Tier -->
|
||||
<div
|
||||
class="group relative flex flex-col gap-6 overflow-hidden rounded-2xl border border-[var(--c-purple)]/30 bg-gradient-to-b from-[var(--card)] to-[var(--card)]/90 p-8 shadow-lg transition-all duration-500 hover:-translate-y-3 hover:shadow-2xl"
|
||||
class="group relative flex flex-col gap-6 overflow-hidden rounded-2xl border border-[var(--c-purple)]/30 bg-[#1e1b4b] p-8 shadow-lg transition-all duration-500 hover:-translate-y-3 hover:shadow-2xl"
|
||||
>
|
||||
<!-- Animated border effect -->
|
||||
<div class="absolute inset-0 rounded-2xl opacity-0 transition-opacity duration-700 group-hover:opacity-100">
|
||||
@ -91,7 +91,7 @@
|
||||
</ul>
|
||||
|
||||
<button
|
||||
class="relative z-10 mt-4 flex h-12 w-full items-center justify-center overflow-hidden rounded-full border border-[var(--c-purple)]/40 bg-gradient-to-r from-[var(--c-purple)]/20 to-[var(--c-purple)]/30 px-8 font-bold tracking-wide text-[var(--c-white)] transition-all duration-300 group-hover:from-[var(--c-purple)]/40 group-hover:to-[var(--c-purple)]/50 group-hover:shadow-lg"
|
||||
class="relative z-10 mt-4 flex h-12 w-full items-center justify-center overflow-hidden rounded-full border border-[var(--c-purple)]/40 bg-[#2d1b69] px-8 font-bold tracking-wide text-[var(--c-white)] transition-all duration-300 group-hover:bg-[#3d2485] group-hover:shadow-lg"
|
||||
>
|
||||
<span class="relative z-10 transition-transform duration-300 group-hover:translate-x-1">Commencer</span>
|
||||
<svg
|
||||
@ -110,7 +110,7 @@
|
||||
|
||||
<!-- Featured Tier -->
|
||||
<div
|
||||
class="group relative flex scale-105 flex-col gap-6 overflow-hidden rounded-2xl bg-gradient-to-br from-[var(--c-purple)] to-purple-900 p-8 shadow-lg ring-2 ring-[var(--c-gold)] transition-all duration-500 hover:-translate-y-3 hover:scale-[1.03] hover:shadow-2xl"
|
||||
class="group relative flex scale-105 flex-col gap-6 overflow-hidden rounded-2xl bg-gradient-to-br from-[#4c1d95] to-[#371a70] p-8 shadow-lg ring-2 ring-[var(--c-gold)] transition-all duration-500 hover:-translate-y-3 hover:scale-[1.03] hover:shadow-2xl"
|
||||
>
|
||||
<!-- Popular badge with animation -->
|
||||
<div class="absolute top-4 right-4 z-10">
|
||||
@ -195,7 +195,7 @@
|
||||
|
||||
<!-- Premium Tier -->
|
||||
<div
|
||||
class="group relative flex flex-col gap-6 overflow-hidden rounded-2xl border border-[var(--c-purple)]/30 bg-gradient-to-b from-[var(--card)] to-[var(--card)]/90 p-8 shadow-lg transition-all duration-500 hover:-translate-y-3 hover:shadow-2xl"
|
||||
class="group relative flex flex-col gap-6 overflow-hidden rounded-2xl border border-[var(--c-purple)]/30 bg-[#1e1b4b] p-8 shadow-lg transition-all duration-500 hover:-translate-y-3 hover:shadow-2xl"
|
||||
>
|
||||
<!-- Golden particles -->
|
||||
<div
|
||||
@ -256,7 +256,7 @@
|
||||
</ul>
|
||||
|
||||
<button
|
||||
class="relative z-10 mt-4 flex h-12 w-full items-center justify-center overflow-hidden rounded-full border border-[var(--c-purple)]/40 bg-gradient-to-r from-[var(--c-purple)]/20 to-[var(--c-purple)]/30 px-8 font-bold tracking-wide text-[var(--c-white)] transition-all duration-300 group-hover:from-[var(--c-purple)]/40 group-hover:to-[var(--c-purple)]/50 group-hover:shadow-lg"
|
||||
class="relative z-10 mt-4 flex h-12 w-full items-center justify-center overflow-hidden rounded-full border border-[var(--c-purple)]/40 bg-[#2d1b69] px-8 font-bold tracking-wide text-[var(--c-white)] transition-all duration-300 group-hover:bg-[#3d2485] group-hover:shadow-lg"
|
||||
>
|
||||
<span class="relative z-10 transition-transform duration-300 group-hover:translate-x-1">Explorer</span>
|
||||
<svg
|
||||
@ -276,7 +276,7 @@
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
<script setup lang="ts">
|
||||
// Define features for each tier
|
||||
const freeFeatures = ["Lecture d'une carte", 'Interprétation générale', 'Conseils rapides'];
|
||||
|
||||
@ -368,7 +368,6 @@ const premiumFeatures = ['Lecture de quatre cartes', 'Exploration approfondie',
|
||||
--c-purple: #4c1d95;
|
||||
--c-white: #ffffff;
|
||||
--c-gold: rgba(245, 158, 11, 0.5);
|
||||
--card: #1e1b4b;
|
||||
}
|
||||
|
||||
/* Smooth transitions for all elements */
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<section class="bg-gradient-to-b from-[var(--c-purple)]/10 to-[var(--c-purple)]/5 py-20 sm:py-24" id="testimonials" style="background: linear-gradient(to bottom, rgba(76, 29, 149, 0.10), rgba(76, 29, 149, 0.05));">
|
||||
<section class="py-20 sm:py-24" id="testimonials" style="background: linear-gradient(to bottom, rgba(76, 29, 149, 0.1), rgba(76, 29, 149, 0.05))">
|
||||
<h2 class="mb-16 transform text-center text-4xl font-bold text-white transition-all duration-700 hover:scale-105 md:text-5xl">
|
||||
Ce Que Nos Initiés Disent
|
||||
</h2>
|
||||
@ -7,7 +7,7 @@
|
||||
<div class="mx-auto grid max-w-6xl grid-cols-1 gap-8 px-4 md:grid-cols-2 lg:grid-cols-3">
|
||||
<!-- Testimonial 1 -->
|
||||
<div
|
||||
class="group relative overflow-hidden rounded-2xl border border-[var(--c-purple)]/30 bg-gradient-to-b from-[var(--card)] to-[var(--card)]/90 p-8 shadow-lg transition-all duration-500 hover:-translate-y-2 hover:shadow-xl"
|
||||
class="group relative overflow-hidden rounded-2xl border border-[#4c1d95]/30 bg-[#1e1b4b] p-8 shadow-lg transition-all duration-500 hover:-translate-y-2 hover:shadow-xl"
|
||||
>
|
||||
<div
|
||||
class="absolute inset-0 bg-gradient-to-br from-transparent via-purple-400/5 to-transparent opacity-0 transition-opacity duration-700 group-hover:opacity-100"
|
||||
@ -15,14 +15,14 @@
|
||||
<div class="relative z-10">
|
||||
<div class="mb-4 flex items-center gap-4">
|
||||
<div
|
||||
class="h-14 w-14 rounded-full bg-cover bg-center ring-2 ring-[var(--c-gold)]/50 transition-all duration-300 group-hover:ring-[var(--c-gold)]"
|
||||
class="h-14 w-14 rounded-full bg-cover bg-center ring-2 ring-[#f59e0b]/50 transition-all duration-300 group-hover:ring-[#f59e0b]"
|
||||
style="
|
||||
background-image: url('https://lh3.googleusercontent.com/aida-public/AB6AXuDFCMVcWHXeHbptxH6HmDJlSpMyAhuoQv_qO0rkUx2EAWltD1WisKuZBoojbWd6-4cnE_K2LXTnhhzlULi5nUeWKQAvci7rM2rDsO4-uvHW8Oe7Jl9TLi1m0-oTJg1X5wdyrxunLWT6CZuD5MQiKC0pxYbq34-HFvBJ2iQKbOgmdlkAwV7xYwWNBeEePBjlAsZ7_MSLMqCAFskClsAEFkJU2YBzQflFeD1fmpK0iXqaXYhQS_kABCFx49W9bb73ShytrweHfDUJkJg');
|
||||
"
|
||||
></div>
|
||||
<div>
|
||||
<p class="text-lg font-bold text-white transition-colors duration-300 group-hover:text-[var(--c-gold)]">Sophie Dubois</p>
|
||||
<div class="flex text-[var(--c-gold)]">
|
||||
<p class="text-lg font-bold text-white transition-colors duration-300 group-hover:text-[#f59e0b]">Sophie Dubois</p>
|
||||
<div class="flex text-[#f59e0b]">
|
||||
<svg class="h-5 w-5 transform transition-all duration-300 hover:scale-125" fill="currentColor" viewBox="0 0 256 256">
|
||||
<path
|
||||
d="M234.5,114.38l-45.1,39.36,13.51,58.6a16,16,0,0,1-23.84,17.34l-51.11-31-51,31a16,16,0,0,1-23.84-17.34L66.61,153.8,21.5,114.38a16,16,0,0,1,9.11-28.06l59.46-5.15,23.21-55.36a15.95,15.95,0,0,1,29.44,0h0L166,81.17l59.44,5.15a16,16,0,0,1,9.11,28.06Z"
|
||||
@ -60,22 +60,22 @@
|
||||
|
||||
<!-- Testimonial 2 -->
|
||||
<div
|
||||
class="group relative overflow-hidden rounded-2xl border border-[var(--c-purple)]/30 bg-gradient-to-b from-[var(--card)] to-[var(--card)]/90 p-8 shadow-lg transition-all duration-500 hover:-translate-y-2 hover:shadow-xl"
|
||||
class="group relative overflow-hidden rounded-2xl border border-[#4c1d95]/30 bg-[#1e1b4b] p-8 shadow-lg transition-all duration-500 hover:-translate-y-2 hover:shadow-xl"
|
||||
>
|
||||
<div
|
||||
class="absolute inset-0 bg-gradient-to-br from-transparent via-[var(--c-gold)]/5 to-transparent opacity-0 transition-opacity duration-700 group-hover:opacity-100"
|
||||
class="absolute inset-0 bg-gradient-to-br from-transparent via-[#f59e0b]/5 to-transparent opacity-0 transition-opacity duration-700 group-hover:opacity-100"
|
||||
></div>
|
||||
<div class="relative z-10">
|
||||
<div class="mb-4 flex items-center gap-4">
|
||||
<div
|
||||
class="h-14 w-14 rounded-full bg-cover bg-center ring-2 ring-[var(--c-gold)]/50 transition-all duration-300 group-hover:ring-[var(--c-gold)]"
|
||||
class="h-14 w-14 rounded-full bg-cover bg-center ring-2 ring-[#f59e0b]/50 transition-all duration-300 group-hover:ring-[#f59e0b]"
|
||||
style="
|
||||
background-image: url('https://lh3.googleusercontent.com/aida-public/AB6AXuCYwDtbzamxSUEWCWG7j3saRw40YQI6KQIVhrw_IrJI8FZXKKHOYej_hGrkM6B5S_MiY-vZ3sWqQDJdPEiYnuH81hSwoHOwfuZWZqY_QoW2UvbtvqCVIiFzd0wk-P63V9j-AgIYgqtonlEzqX1FvYGPZrsocOKx6sArVQACeo6MrVYkm2IVwDGWFyFL0L5U9bzRD8-Zo7hRvn_1hmJxOPS72z61S3jZnDTZPQe6tX9_jJk8ei7qludF6Gs-Qb92jXbRR68FpIoxPHg');
|
||||
"
|
||||
></div>
|
||||
<div>
|
||||
<p class="text-lg font-bold text-white transition-colors duration-300 group-hover:text-[var(--c-gold)]">Jean Martin</p>
|
||||
<div class="flex text-[var(--c-gold)]">
|
||||
<p class="text-lg font-bold text-white transition-colors duration-300 group-hover:text-[#f59e0b]">Jean Martin</p>
|
||||
<div class="flex text-[#f59e0b]">
|
||||
<svg class="h-5 w-5 transform transition-all duration-300 hover:scale-125" fill="currentColor" viewBox="0 0 256 256">
|
||||
<path
|
||||
d="M234.5,114.38l-45.1,39.36,13.51,58.6a16,16,0,0,1-23.84,17.34l-51.11-31-51,31a16,16,0,0,1-23.84-17.34L66.61,153.8,21.5,114.38a16,16,0,0,1,9.11-28.06l59.46-5.15,23.21-55.36a15.95,15.95,0,0,1,29.44,0h0L166,81.17l59.44,5.15a16,16,0,0,1,9.11,28.06Z"
|
||||
@ -97,7 +97,7 @@
|
||||
></path>
|
||||
</svg>
|
||||
<svg
|
||||
class="h-5 w-5 transform text-[var(--c-purple)]/30 transition-all duration-300"
|
||||
class="h-5 w-5 transform text-[#4c1d95]/30 transition-all duration-300"
|
||||
fill="currentColor"
|
||||
viewBox="0 0 256 256"
|
||||
>
|
||||
@ -116,7 +116,7 @@
|
||||
|
||||
<!-- Testimonial 3 -->
|
||||
<div
|
||||
class="group relative overflow-hidden rounded-2xl border border-[var(--c-purple)]/30 bg-gradient-to-b from-[var(--card)] to-[var(--card)]/90 p-8 shadow-lg transition-all duration-500 hover:-translate-y-2 hover:shadow-xl"
|
||||
class="group relative overflow-hidden rounded-2xl border border-[#4c1d95]/30 bg-[#1e1b4b] p-8 shadow-lg transition-all duration-500 hover:-translate-y-2 hover:shadow-xl"
|
||||
>
|
||||
<div
|
||||
class="absolute inset-0 bg-gradient-to-br from-transparent via-purple-400/5 to-transparent opacity-0 transition-opacity duration-700 group-hover:opacity-100"
|
||||
@ -124,16 +124,14 @@
|
||||
<div class="relative z-10">
|
||||
<div class="mb-4 flex items-center gap-4">
|
||||
<div
|
||||
class="h-14 w-14 rounded-full bg-cover bg-center ring-2 ring-[var(--c-gold)]/50 transition-all duration-300 group-hover:ring-[var(--c-gold)]"
|
||||
class="h-14 w-14 rounded-full bg-cover bg-center ring-2 ring-[#f59e0b]/50 transition-all duration-300 group-hover:ring-[#f59e0b]"
|
||||
style="
|
||||
background-image: url('https://lh3.googleusercontent.com/aida-public/AB6AXuDFCMVcWHXeHbptxH6HmDJlSpMyAhuoQv_qO0rkUx2EAWltD1WisKuZBoojbWd6-4cnE_K2LXTnhhzlULi5nUeWKQAvci7rM2rDsO4-uvHW8Oe7Jl9TLi1m0-oTJg1X5wdyrxunLWT6CZuD5MQiKC0pxYbq34-HFvBJ2iQKbOgmdlkAwV7xYwWNBeEePBjlAsZ7_MSLMqCAFskClsAEFkJU2YBzQflFeD1fmpK0iXqaXYhQS_kABCFx49W9bb73ShytrweHfDUJkJg');
|
||||
"
|
||||
></div>
|
||||
<div>
|
||||
<p class="text-lg font-bold text-white transition-colors duration-300 group-hover:text-[var(--c-gold)]">
|
||||
Isabelle Lefevre
|
||||
</p>
|
||||
<div class="flex text-[var(--c-gold)]">
|
||||
<p class="text-lg font-bold text-white transition-colors duration-300 group-hover:text-[#f59e0b]">Isabelle Lefevre</p>
|
||||
<div class="flex text-[#f59e0b]">
|
||||
<svg class="h-5 w-5 transform transition-all duration-300 hover:scale-125" fill="currentColor" viewBox="0 0 256 256">
|
||||
<path
|
||||
d="M234.5,114.38l-45.1,39.36,13.51,58.6a16,16,0,0,1-23.84,17.34l-51.11-31-51,31a16,16,0,0,1-23.84-17.34L66.61,153.8,21.5,114.38a16,16,0,0,1,9.11-28.06l59.46-5.15,23.21-55.36a15.95,15.95,0,0,1,29.44,0h0L166,81.17l59.44,5.15a16,16,0,0,1,9.11,28.06Z"
|
||||
@ -202,7 +200,7 @@ export default {
|
||||
.testimonial-quote::before {
|
||||
content: '"';
|
||||
font-size: 2rem;
|
||||
color: var(--c-gold);
|
||||
color: #f59e0b;
|
||||
position: absolute;
|
||||
left: -0.5rem;
|
||||
top: -1rem;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user