Skip to content

Commit ec50963

Browse files
simonhampclaude
simonhamp
and
claude
authored
feat(ads): add Bifrost & Desktop sidebar ads, cross-platform rotation (#421)
- Add a Bifrost cloud-platform ad and a NativePHP Desktop ad to the sidebar ad rotation - Rotate the Desktop ad on Mobile docs and the Mobile ad on Desktop docs (never a platform's own ad) - Remove the "Early Bird Pricing" label from the Masterclass ad - Set an explicit white page background in light mode on the main site layout - Add feature tests for the rotation, cross-platform docs wiring, and Early Bird removal Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
1 parent 6cf5f02 commit ec50963

5 files changed

Lines changed: 200 additions & 10 deletions

File tree

‎package-lock.json‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎resources/views/components/blog/ad-rotation.blade.php‎

Lines changed: 121 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
@props(['ads' => ['mobile', 'devkit', 'ultra', 'vibes', 'masterclass']])
1+
@props(['ads' => ['mobile', 'desktop', 'bifrost', 'devkit', 'ultra', 'vibes', 'masterclass']])
22

33
@php
44
$adsJson = json_encode($ads);
@@ -76,6 +76,126 @@ class="h-15 w-36 rotate-30 rounded-full bg-violet-300 blur-xl dark:bg-violet-400
7676
</a>
7777
@endif
7878

79+
{{-- NativePHP Desktop Ad --}}
80+
@if (in_array('desktop', $ads))
81+
<a
82+
x-show="ad === 'desktop'"
83+
x-cloak
84+
href="/docs/desktop"
85+
class="group relative z-0 grid place-items-center overflow-hidden rounded-2xl bg-gray-100 px-4 pt-10 text-center text-pretty transition duration-200 hover:bg-gray-200/70 hover:ring-1 hover:ring-black/60 dark:bg-mirage dark:hover:bg-haiti dark:hover:ring-cloud"
86+
>
87+
{{-- Logo --}}
88+
<div>
89+
<x-logo class="h-5" />
90+
<span class="sr-only">NativePHP</span>
91+
</div>
92+
93+
{{-- Tagline --}}
94+
<div class="mt-3">
95+
Bring your
96+
<strong>Laravel</strong>
97+
skills to the
98+
<strong>desktop.</strong>
99+
</div>
100+
101+
{{-- Macbook --}}
102+
<div class="mt-4 -mb-4">
103+
<img
104+
src="{{ Vite::asset('resources/images/home/macbook.webp') }}"
105+
alt=""
106+
aria-hidden="true"
107+
class="w-40 transition duration-200 will-change-transform group-hover:-translate-y-1 dark:brightness-80 dark:contrast-150"
108+
width="400"
109+
height="250"
110+
loading="lazy"
111+
/>
112+
</div>
113+
114+
{{-- Star 1 --}}
115+
<x-icons.star
116+
class="absolute top-6 right-3 z-10 w-4 -rotate-7 text-white dark:w-3 dark:text-slate-300 animate-ping"
117+
/>
118+
{{-- Star 2 --}}
119+
<x-icons.star
120+
class="absolute top-3 right-14 z-10 w-3 rotate-5 text-white dark:w-2 dark:text-slate-300 animate-spin "
121+
/>
122+
{{-- Star 3 --}}
123+
<x-icons.star
124+
class="absolute top-2.5 right-7.5 z-10 w-2.5 text-white dark:w-2 dark:text-slate-300 animate-pulse"
125+
/>
126+
{{-- White blur --}}
127+
<div class="absolute top-5 -right-10 -z-5">
128+
<div
129+
class="h-5 w-36 rotate-30 rounded-full bg-white/80 blur-md dark:bg-white/5"
130+
></div>
131+
</div>
132+
{{-- Sky blur --}}
133+
<div class="absolute top-5 -right-20 -z-10">
134+
<div
135+
class="h-15 w-36 rotate-30 rounded-full bg-sky-300 blur-xl dark:bg-sky-500/30"
136+
></div>
137+
</div>
138+
{{-- Violet blur --}}
139+
<div class="absolute -top-10 -right-5 -z-10">
140+
<div
141+
class="h-15 w-36 rotate-30 rounded-full bg-violet-300 blur-xl dark:bg-violet-400/30"
142+
></div>
143+
</div>
144+
</a>
145+
@endif
146+
147+
{{-- Bifrost Ad --}}
148+
@if (in_array('bifrost', $ads))
149+
<a
150+
x-show="ad === 'bifrost'"
151+
x-cloak
152+
href="https://bifrost.nativephp.com/"
153+
target="_blank"
154+
rel="noopener noreferrer"
155+
onclick="fathom.trackEvent('bifrost_ad_click');"
156+
class="group relative z-0 grid place-items-center overflow-hidden rounded-2xl bg-gradient-to-br from-sky-500 via-indigo-500 to-purple-600 px-4 py-8 text-center text-pretty transition duration-200 hover:from-sky-400 hover:via-indigo-400 hover:to-purple-500 hover:ring-1 hover:ring-sky-300"
157+
>
158+
{{-- Badge --}}
159+
<div class="inline-flex w-fit items-center gap-1.5 rounded-full bg-white/20 px-2.5 py-1 text-xs font-medium text-white backdrop-blur-sm">
160+
<x-heroicon-s-cloud class="size-3" />
161+
Cloud Platform
162+
</div>
163+
164+
{{-- Logo --}}
165+
<div class="mt-4">
166+
<x-logos.bifrost class="mx-auto h-5 text-white" />
167+
<span class="sr-only">Bifrost</span>
168+
</div>
169+
170+
{{-- Tagline --}}
171+
<div class="mt-3 text-sm text-sky-50">
172+
Build your NativePHP apps
173+
<strong class="text-white">in the cloud.</strong>
174+
</div>
175+
176+
{{-- CTA --}}
177+
<div class="mt-4 rounded-lg bg-white/20 px-4 py-1.5 text-sm font-medium text-white backdrop-blur-sm transition group-hover:bg-white/30">
178+
Ship it!
179+
</div>
180+
181+
{{-- Price hint --}}
182+
<div class="mt-2 text-xs text-sky-100">
183+
Plans from $19/mo
184+
</div>
185+
186+
{{-- Decorative stars --}}
187+
<x-icons.star
188+
class="absolute top-4 right-3 z-10 w-3 -rotate-7 text-sky-200 animate-ping "
189+
/>
190+
<x-icons.star
191+
class="absolute top-8 left-4 z-10 w-2 rotate-12 text-indigo-200 animate-spin "
192+
/>
193+
<x-icons.star
194+
class="absolute bottom-12 right-6 z-10 w-2.5 text-purple-200 animate-pulse "
195+
/>
196+
</a>
197+
@endif
198+
79199
{{-- Plugin Dev Kit Ad --}}
80200
@if (in_array('devkit', $ads))
81201
<a
@@ -239,11 +359,6 @@ class="group relative z-0 grid place-items-center overflow-hidden rounded-2xl bg
239359
Learn More
240360
</div>
241361

242-
{{-- Early Bird Label --}}
243-
<div class="mt-2 text-xs text-emerald-100">
244-
Early Bird Pricing
245-
</div>
246-
247362
{{-- Decorative stars --}}
248363
<x-icons.star
249364
class="absolute top-4 right-3 z-10 w-3 -rotate-7 text-emerald-200 animate-ping "

‎resources/views/components/layout.blade.php‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -116,7 +116,7 @@
116116
scrolled = window.scrollY > 1
117117
})
118118
"
119-
class="font-poppins min-h-screen overflow-x-clip antialiased selection:bg-black selection:text-[#b4a9ff] dark:bg-[#050714] dark:text-white"
119+
class="font-poppins min-h-screen overflow-x-clip bg-white antialiased selection:bg-black selection:text-[#b4a9ff] dark:bg-[#050714] dark:text-white"
120120
>
121121
<x-the-vibes-banner />
122122

‎resources/views/docs/index.blade.php‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@
2727
<x-docs.toc-and-sponsors :tableOfContents="$tableOfContents">
2828
{{-- Ad rotation --}}
2929
<x-blog.ad-rotation
30-
:ads="$platform === 'desktop' ? ['mobile', 'ultra', 'vibes', 'masterclass'] : ['devkit', 'ultra', 'vibes', 'masterclass']"
30+
:ads="$platform === 'desktop' ? ['mobile', 'bifrost', 'ultra', 'vibes', 'masterclass'] : ['desktop', 'bifrost', 'devkit', 'ultra', 'vibes', 'masterclass']"
3131
/>
3232
</x-docs.toc-and-sponsors>
3333
</x-slot>
@@ -164,6 +164,6 @@ class="flex items-center justify-end gap-1.5 opacity-60"
164164
{{-- Mobile ad rotation --}}
165165
<x-blog.ad-rotation
166166
class="mx-auto mt-5 max-w-52 xl:hidden"
167-
:ads="$platform === 'desktop' ? ['mobile', 'ultra', 'vibes', 'masterclass'] : ['devkit', 'ultra', 'vibes', 'masterclass']"
167+
:ads="$platform === 'desktop' ? ['mobile', 'bifrost', 'ultra', 'vibes', 'masterclass'] : ['desktop', 'bifrost', 'devkit', 'ultra', 'vibes', 'masterclass']"
168168
/>
169169
</x-docs-layout>

‎tests/Feature/AdRotationTest.php‎

Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
<?php
2+
3+
namespace Tests\Feature;
4+
5+
use Illuminate\Foundation\Testing\RefreshDatabase;
6+
use PHPUnit\Framework\Attributes\Test;
7+
use Tests\TestCase;
8+
9+
class AdRotationTest extends TestCase
10+
{
11+
use RefreshDatabase;
12+
13+
#[Test]
14+
public function the_bifrost_ad_is_included_in_the_default_rotation()
15+
{
16+
$this->blade('<x-blog.ad-rotation />')
17+
->assertSee('https://bifrost.nativephp.com/')
18+
->assertSee("ad === 'bifrost'", false)
19+
->assertSee('Cloud Platform')
20+
->assertSee('Ship it!');
21+
}
22+
23+
#[Test]
24+
public function the_bifrost_ad_can_be_rendered_on_its_own()
25+
{
26+
$this->blade('<x-blog.ad-rotation :ads="[\'bifrost\']" />')
27+
->assertSee('https://bifrost.nativephp.com/')
28+
->assertDontSee('/docs/mobile');
29+
}
30+
31+
#[Test]
32+
public function the_bifrost_ad_is_omitted_when_not_in_the_ad_list()
33+
{
34+
$this->blade('<x-blog.ad-rotation :ads="[\'ultra\']" />')
35+
->assertDontSee('https://bifrost.nativephp.com/')
36+
->assertDontSee("ad === 'bifrost'", false);
37+
}
38+
39+
#[Test]
40+
public function the_desktop_ad_is_included_in_the_default_rotation()
41+
{
42+
$this->blade('<x-blog.ad-rotation />')
43+
->assertSee("ad === 'desktop'", false)
44+
->assertSee('href="/docs/desktop"', false)
45+
->assertSee('macbook');
46+
}
47+
48+
#[Test]
49+
public function the_masterclass_ad_no_longer_shows_early_bird_pricing()
50+
{
51+
$this->blade('<x-blog.ad-rotation :ads="[\'masterclass\']" />')
52+
->assertSee('The Masterclass')
53+
->assertDontSee('Early Bird Pricing');
54+
}
55+
56+
#[Test]
57+
public function desktop_docs_rotate_the_mobile_ad_but_never_the_desktop_ad()
58+
{
59+
$this->followingRedirects()
60+
->get('/docs/desktop')
61+
->assertOk()
62+
->assertSee("ad === 'mobile'", false)
63+
->assertDontSee("ad === 'desktop'", false);
64+
}
65+
66+
#[Test]
67+
public function mobile_docs_rotate_the_desktop_ad_but_never_the_mobile_ad()
68+
{
69+
$this->followingRedirects()
70+
->get('/docs/mobile')
71+
->assertOk()
72+
->assertSee("ad === 'desktop'", false)
73+
->assertDontSee("ad === 'mobile'", false);
74+
}
75+
}

0 commit comments

Comments
 (0)