82 lines
3.3 KiB
TypeScript
82 lines
3.3 KiB
TypeScript
import { Field, PageHeader } from '../components/shared'
|
|
import { Icons } from '../components/shared/Icons'
|
|
import { Button } from '../components/ui'
|
|
|
|
export default function DomainPage() {
|
|
return (
|
|
<div>
|
|
<PageHeader />
|
|
|
|
{/* Panel container - full-bleed borders */}
|
|
<div className="-mx-6 lg:-mx-10 mt-6">
|
|
{/* Subdomain */}
|
|
<div className="px-6 lg:px-10 py-5">
|
|
<div className="text-xs font-medium text-muted uppercase tracking-wide">Subdomain</div>
|
|
<div className="text-xs text-muted mt-0.5">Your default blog address</div>
|
|
</div>
|
|
<div className="px-6 lg:px-10 py-6 space-y-3">
|
|
<div className="flex items-center gap-2">
|
|
<input
|
|
type="text"
|
|
className="input flex-1"
|
|
placeholder="myblog"
|
|
defaultValue=""
|
|
/>
|
|
<span className="text-sm text-muted">.writekit.dev</span>
|
|
</div>
|
|
<p className="text-xs text-muted">
|
|
This is your default blog URL. You can also add a custom domain below.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="border-t border-border" />
|
|
|
|
{/* Custom Domain */}
|
|
<div className="px-6 lg:px-10 py-5">
|
|
<div className="text-xs font-medium text-muted uppercase tracking-wide">Custom Domain</div>
|
|
<div className="text-xs text-muted mt-0.5">Use your own domain for your blog</div>
|
|
</div>
|
|
<div className="px-6 lg:px-10 py-6 space-y-4">
|
|
<Field
|
|
label="Domain"
|
|
value=""
|
|
onChange={() => {}}
|
|
placeholder="blog.example.com"
|
|
hint="Enter your custom domain without https://"
|
|
/>
|
|
<div className="p-4 bg-border/30 space-y-3">
|
|
<h4 className="text-sm font-medium">DNS Configuration</h4>
|
|
<p className="text-xs text-muted">
|
|
Point your domain to our servers by adding these DNS records:
|
|
</p>
|
|
<div className="space-y-2 overflow-x-auto">
|
|
<div className="flex items-center gap-4 p-2 bg-surface border border-border text-xs font-mono min-w-max">
|
|
<span className="text-muted w-16">Type</span>
|
|
<span className="text-muted w-24">Name</span>
|
|
<span className="text-text">Value</span>
|
|
</div>
|
|
<div className="flex items-center gap-4 p-2 bg-surface border border-border text-xs font-mono min-w-max">
|
|
<span className="w-16">CNAME</span>
|
|
<span className="w-24">blog</span>
|
|
<span>cname.writekit.dev</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="flex flex-wrap items-center gap-4">
|
|
<div className="flex items-center gap-2">
|
|
<span className="w-2 h-2 rounded-full bg-warning" />
|
|
<span className="text-sm text-muted">DNS: Pending</span>
|
|
</div>
|
|
<div className="flex items-center gap-2">
|
|
<span className="w-2 h-2 rounded-full bg-muted" />
|
|
<span className="text-sm text-muted">SSL: Not configured</span>
|
|
</div>
|
|
</div>
|
|
<Button variant="secondary" Icon={Icons.Refresh}>
|
|
Check DNS
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|