feat: replace static images with MessageBus and ProxyDetection components in Features section

This commit is contained in:
2025-10-13 17:39:47 +02:00
parent 8b7f5f7286
commit ce162cd169
4 changed files with 525 additions and 15 deletions

View File

@@ -1,4 +1,7 @@
import Pathfinding from '@/components/Pathfinding'
import MessageBus from '@/components/MessageBus'
import ProxyDetection from '@/components/ProxyDetection'
import ProxyForwarding from '@/components/ProxyForwarding'
export function Features() {
return (
@@ -38,11 +41,7 @@ export function Features() {
<div className="relative lg:col-span-3">
<div className="absolute inset-0 rounded-lg bg-white lg:rounded-tr-4xl" />
<div className="relative flex h-full flex-col overflow-hidden rounded-[calc(var(--radius-lg)+1px)] lg:rounded-tr-[calc(2rem+1px)]">
<img
alt=""
src="https://tailwindcss.com/plus-assets/img/component-images/bento-01-releases.png"
className="h-80 object-cover object-left lg:object-right"
/>
<MessageBus />
<div className="p-10 pt-4">
<h3 className="text-sm/4 font-semibold text-cyan-500">Communication</h3>
<p className="mt-2 text-lg font-medium tracking-tight text-gray-950">
@@ -59,11 +58,7 @@ export function Features() {
<div className="relative lg:col-span-2">
<div className="absolute inset-0 rounded-lg bg-white lg:rounded-bl-4xl" />
<div className="relative flex h-full flex-col overflow-hidden rounded-[calc(var(--radius-lg)+1px)] lg:rounded-bl-[calc(2rem+1px)]">
<img
alt=""
src="https://tailwindcss.com/plus-assets/img/component-images/bento-01-speed.png"
className="h-80 object-cover object-left"
/>
<ProxyDetection className="h-80" />
<div className="p-10 pt-4">
<h3 className="text-sm/4 font-semibold text-cyan-500">Discovery</h3>
<p className="mt-2 text-lg font-medium tracking-tight text-gray-950">
@@ -101,11 +96,7 @@ export function Features() {
<div className="relative lg:col-span-2">
<div className="absolute inset-0 rounded-lg bg-white max-lg:rounded-b-4xl lg:rounded-br-4xl" />
<div className="relative flex h-full flex-col overflow-hidden rounded-[calc(var(--radius-lg)+1px)] max-lg:rounded-b-[calc(2rem+1px)] lg:rounded-br-[calc(2rem+1px)]">
<img
alt=""
src="https://tailwindcss.com/plus-assets/img/component-images/bento-01-network.png"
className="h-80 object-cover"
/>
<ProxyForwarding />
<div className="p-10 pt-4">
<h3 className="text-sm/4 font-semibold text-cyan-500">Delivery</h3>
<p className="mt-2 text-lg font-medium tracking-tight text-gray-950">