66 lines
4.1 KiB
PHP
66 lines
4.1 KiB
PHP
@extends('layouts.app')
|
|
|
|
@section('content')
|
|
<div class="relative isolate overflow-hidden">
|
|
<div class="absolute inset-x-0 top-0 -z-10 h-[34rem] bg-[radial-gradient(circle_at_top_right,rgba(34,211,238,0.16),transparent_45%),radial-gradient(circle_at_top_left,rgba(99,102,241,0.16),transparent_42%)]"></div>
|
|
|
|
<div class="mx-auto grid max-w-7xl gap-16 px-6 py-20 lg:grid-cols-[1.1fr_0.9fr] lg:items-center lg:px-8 lg:py-28">
|
|
<div>
|
|
<div class="mb-6 inline-flex items-center gap-2 rounded-full border border-cyan-300/20 bg-cyan-300/10 px-3 py-1 text-xs font-medium uppercase tracking-[0.18em] text-cyan-200">
|
|
<span class="size-1.5 rounded-full bg-cyan-300"></span>
|
|
HTTP request workspace
|
|
</div>
|
|
<h1 class="max-w-3xl text-4xl font-semibold tracking-tight text-white sm:text-6xl">
|
|
See every webhook exactly as it arrives.
|
|
</h1>
|
|
<p class="mt-6 max-w-2xl text-lg leading-8 text-slate-300">
|
|
Create a temporary endpoint, send it requests from any service, and inspect headers, query data and payloads in one focused workspace.
|
|
</p>
|
|
|
|
<div class="mt-10 flex flex-wrap items-center gap-4">
|
|
<form action="{{ route('inspectors.store') }}" method="POST">
|
|
@csrf
|
|
<button type="submit" class="rounded-xl bg-cyan-400 px-5 py-3 font-semibold text-slate-950 shadow-lg shadow-cyan-950/30 transition hover:bg-cyan-300">
|
|
Create test URL
|
|
</button>
|
|
</form>
|
|
@guest
|
|
@if (Route::has('register'))
|
|
<a href="{{ route('register') }}" class="rounded-xl border border-white/15 px-5 py-3 font-medium text-white transition hover:border-cyan-300/50 hover:text-cyan-200">Create a private workspace</a>
|
|
@endif
|
|
@endguest
|
|
</div>
|
|
</div>
|
|
|
|
<div class="rounded-3xl border border-white/10 bg-slate-900/80 p-5 shadow-2xl shadow-black/30 backdrop-blur sm:p-6">
|
|
<div class="flex items-center justify-between border-b border-white/10 pb-4">
|
|
<div class="flex items-center gap-2 text-sm font-medium text-slate-200">
|
|
<span class="size-2 rounded-full bg-emerald-400"></span>
|
|
Incoming request
|
|
</div>
|
|
<span class="font-mono text-xs text-slate-500">LIVE</span>
|
|
</div>
|
|
<div class="space-y-4 py-5 font-mono text-sm">
|
|
<div class="flex items-center justify-between gap-4"><span class="text-cyan-300">POST</span><span class="truncate text-slate-400">/hook/••••••••••••</span></div>
|
|
<div class="rounded-xl border border-white/10 bg-black/20 p-4 text-slate-300">
|
|
<div class="text-slate-500">content-type</div>
|
|
<div class="mt-1">application/json</div>
|
|
<div class="mt-4 text-slate-500">body</div>
|
|
<div class="mt-1 text-emerald-300">{ "event": "payment.created" }</div>
|
|
</div>
|
|
<div class="flex items-center justify-between text-xs text-slate-500"><span>127.0.0.1</span><span>just now</span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mx-auto grid max-w-7xl gap-4 px-6 pb-20 sm:grid-cols-3 lg:px-8">
|
|
@foreach ([['Temporary URLs', 'Start without an account.'], ['Full request context', 'Headers, query and raw body.'], ['Live updates', 'Requests appear as they arrive.']] as [$title, $description])
|
|
<div class="rounded-2xl border border-white/10 bg-white/[0.03] p-5">
|
|
<h2 class="font-medium text-white">{{ $title }}</h2>
|
|
<p class="mt-2 text-sm leading-6 text-slate-400">{{ $description }}</p>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
@endsection
|