@extends('layouts.admin')

@section('title', 'SEO settings')

@section('content')
<div class="row">
    <div class="col-lg-8">
        <form method="POST" action="{{ route('admin.seo.update') }}" class="card card-body form-card">
            @csrf
            @method('PUT')
            <div class="mb-3">
                <label for="seo_title" class="form-label">Default title tag</label>
                <input type="text" class="form-control @error('seo_title') is-invalid @enderror" id="seo_title"
                       name="seo_title" value="{{ old('seo_title', $settings['seo_title'] ?? '') }}" maxlength="190" required>
                @error('seo_title')<div class="invalid-feedback">{{ $message }}</div>@enderror
                <div class="form-text">Aim for 50-60 characters.</div>
            </div>
            <div class="mb-3">
                <label for="seo_description" class="form-label">Meta description</label>
                <textarea class="form-control @error('seo_description') is-invalid @enderror" id="seo_description"
                          name="seo_description" rows="3" maxlength="300" required>{{ old('seo_description', $settings['seo_description'] ?? '') }}</textarea>
                @error('seo_description')<div class="invalid-feedback">{{ $message }}</div>@enderror
                <div class="form-text">Aim for 140-160 characters.</div>
            </div>
            <div class="mb-3">
                <label for="seo_keywords" class="form-label">Keywords (comma separated)</label>
                <input type="text" class="form-control" id="seo_keywords" name="seo_keywords"
                       value="{{ old('seo_keywords', $settings['seo_keywords'] ?? '') }}" maxlength="500">
            </div>
            <div class="mb-3">
                <label for="og_image" class="form-label">Open Graph image URL</label>
                <input type="url" class="form-control @error('og_image') is-invalid @enderror" id="og_image"
                       name="og_image" value="{{ old('og_image', $settings['og_image'] ?? '') }}" maxlength="500"
                       placeholder="https://example.com/og.png">
                @error('og_image')<div class="invalid-feedback">{{ $message }}</div>@enderror
                <div class="form-text">1200 x 630 px recommended.</div>
            </div>
            <div class="mb-3">
                <label for="twitter_handle" class="form-label">Twitter/X handle</label>
                <input type="text" class="form-control @error('twitter_handle') is-invalid @enderror" id="twitter_handle"
                       name="twitter_handle" value="{{ old('twitter_handle', $settings['twitter_handle'] ?? '') }}" maxlength="50" placeholder="@yoursite">
                @error('twitter_handle')<div class="invalid-feedback">{{ $message }}</div>@enderror
            </div>
            <div class="mb-3">
                <label for="google_verification" class="form-label">Google site verification code</label>
                <input type="text" class="form-control" id="google_verification" name="google_verification"
                       value="{{ old('google_verification', $settings['google_verification'] ?? '') }}" maxlength="190">
            </div>
            <button type="submit" class="btn btn-gradient align-self-start px-4">Save changes</button>
        </form>
    </div>
</div>
@endsection