@@ -86,7 +86,11 @@ class="relative rounded-full px-5 py-2 text-sm font-medium transition"
8686 >
8787 Annual
8888 <span class =" absolute -right-2 -top-2.5 rounded-full bg-emerald-100 px-1.5 py-0.5 text-[10px] font-semibold text-emerald-700 dark:bg-emerald-900/50 dark:text-emerald-300" >
89- Save 16%
89+ @if ($isEapCustomer )
90+ EAP offer
91+ @else
92+ Save 16%
93+ @endif
9094 </span >
9195 </button >
9296 </div >
@@ -124,27 +128,52 @@ class="text-3xl font-semibold"
124128 </h3 >
125129
126130 {{-- Price --}}
127- < div
128- class =" flex items-start gap-1.5 pt-5"
129- :aria-label = " interval === 'month'
130- ? 'Price: $35 per month'
131- : 'Price: $350 per year' "
132- >
133- < div class = " text-5xl font-semibold " >
134- $< span x-text = " interval === 'month' ? '35' : '350' " ></ span >
131+ @if ( $isEapCustomer )
132+ < div class =" flex items-start gap-1.5 pt-5" >
133+ < div class = " text-5xl font-semibold " >
134+ $< span x-text = " interval === 'month' ? '35' : ' {{ $eapYearlyPrice } } ' " ></ span >
135+ </ div >
136+ < div class = " self-end pb-1.5 text-zinc-500 " >
137+ < span x-text = " interval === 'month' ? 'per month' : 'per year' " ></ span >
138+ </ div >
135139 </div >
136- <div class =" self-end pb-1.5 text-zinc-500" >
137- <span x-text =" interval === 'month' ? 'per month' : 'per year'" ></span >
140+ <div
141+ x-show =" interval === 'year'"
142+ x-transition
143+ class =" flex items-center gap-2 pt-1"
144+ >
145+ <span class =" text-lg text-zinc-400 line-through" >${{ $regularYearlyPrice } } /yr</span >
146+ <span class =" rounded-full bg-emerald-100 px-2 py-0.5 text-xs font-semibold text-emerald-700 dark:bg-emerald-900/50 dark:text-emerald-300" >
147+ {{ $eapDiscountPercent } } % off
148+ </span >
138149 </div >
139- </div >
150+ @else
151+ <div
152+ class =" flex items-start gap-1.5 pt-5"
153+ :aria-label =" interval === 'month'
154+ ? 'Price: $35 per month'
155+ : 'Price: $350 per year'"
156+ >
157+ <div class =" text-5xl font-semibold" >
158+ $<span x-text =" interval === 'month' ? '35' : '350'" ></span >
159+ </div >
160+ <div class =" self-end pb-1.5 text-zinc-500" >
161+ <span x-text =" interval === 'month' ? 'per month' : 'per year'" ></span >
162+ </div >
163+ </div >
164+ @endif
140165
141166 {{-- Savings note --}}
142167 <div
143168 x-show =" interval === 'year'"
144169 x-transition
145170 class =" pt-1 text-sm text-emerald-600 dark:text-emerald-400"
146171 >
147- Save $70/year vs monthly
172+ @if ($isEapCustomer )
173+ Save ${{ $eapSavingsVsMonthly } } /year (compared to monthly pricing) with your Early Access discount
174+ @else
175+ Save $70/year vs monthly
176+ @endif
148177 </div >
149178
150179 {{-- CTA Button --}}
@@ -312,16 +341,31 @@ class="rounded-full px-4 py-1.5 text-sm font-medium transition"
312341 <div class =" flex items-baseline justify-between" >
313342 <span class =" text-sm text-gray-600 dark:text-gray-400" >Ultra</span >
314343 <span class =" text-lg font-semibold text-gray-900 dark:text-white" >
315- $<span x-text =" interval === 'month' ? '35' : '350'" ></span ><span class =" text-sm font-normal text-gray-500" >/<span x-text =" interval === 'month' ? 'mo' : 'yr'" ></span ></span >
344+ @if ($isEapCustomer )
345+ $<span x-text =" interval === 'month' ? '35' : '{{ $eapYearlyPrice } } '" ></span ><span class =" text-sm font-normal text-gray-500" >/<span x-text =" interval === 'month' ? 'mo' : 'yr'" ></span ></span >
346+ @else
347+ $<span x-text =" interval === 'month' ? '35' : '350'" ></span ><span class =" text-sm font-normal text-gray-500" >/<span x-text =" interval === 'month' ? 'mo' : 'yr'" ></span ></span >
348+ @endif
316349 </span >
317350 </div >
318- <div
319- x-show =" interval === 'year'"
320- x-transition
321- class =" mt-1 text-xs text-emerald-600 dark:text-emerald-400"
322- >
323- Save $70/year vs monthly
324- </div >
351+ @if ($isEapCustomer )
352+ <div
353+ x-show =" interval === 'year'"
354+ x-transition
355+ class =" mt-1 flex items-center gap-2 text-xs"
356+ >
357+ <span class =" text-zinc-400 line-through" >${{ $regularYearlyPrice } } /yr</span >
358+ <span class =" font-semibold text-emerald-600 dark:text-emerald-400" >EAP discount applied</span >
359+ </div >
360+ @else
361+ <div
362+ x-show =" interval === 'year'"
363+ x-transition
364+ class =" mt-1 text-xs text-emerald-600 dark:text-emerald-400"
365+ >
366+ Save $70/year vs monthly
367+ </div >
368+ @endif
325369 </div >
326370
327371 {{-- Actions --}}
0 commit comments