{{- template "document.html" . }}

{{- define "document-title" }}Site settings - {{ .App.Config.Branding.AppName }}{{ end }}

{{- define "document-body" }}
<div class="flex flex-column body-content">
    <main class="content-bounds" style="padding-block: 2rem;">
        <div class="margin-bottom-15">
            <a class="color-subdue" href="{{ .App.Config.Server.BaseURL }}/edit">← Edit</a>
        </div>
        <h1 class="size-h1 margin-bottom-15">Site settings</h1>
        <p class="color-subdue margin-bottom-25">
            Branding shown in the header and footer. Theme colors, server settings,
            and authentication still need YAML — edit <code>{{ .App.ConfigPath }}</code>
            directly for those.
        </p>

        <form method="post" action="{{ .App.Config.Server.BaseURL }}/edit/api/site-settings"
              style="display:flex;flex-direction:column;gap:1rem;max-width:36rem;">

            <label class="form-label widget-header">
                App name
                <input type="text" name="app-name" class="input" value="{{ .SiteSettings.AppName }}" placeholder="Glance">
            </label>

            <label class="form-label widget-header">
                Logo text (header)
                <input type="text" name="logo-text" class="input" value="{{ .SiteSettings.LogoText }}">
                <small class="color-subdue size-h5">Shown if no logo URL is set.</small>
            </label>

            <label class="form-label widget-header">
                Logo URL
                <input type="text" name="logo-url" class="input" value="{{ .SiteSettings.LogoURL }}" placeholder="/assets/logo.svg">
            </label>

            <label class="form-label widget-header">
                Favicon URL
                <input type="text" name="favicon-url" class="input" value="{{ .SiteSettings.FaviconURL }}">
                <small class="color-subdue size-h5">Defaults to the bundled glance favicon.</small>
            </label>

            <label class="form-label widget-header">
                App icon URL (PWA)
                <input type="text" name="app-icon-url" class="input" value="{{ .SiteSettings.AppIconURL }}">
            </label>

            <label class="form-label widget-header">
                App background color (PWA)
                <input type="text" name="app-background-color" class="input" value="{{ .SiteSettings.AppBackgroundColor }}" placeholder="#000000">
            </label>

            <label class="form-label widget-header" style="display:flex;flex-direction:row;align-items:center;gap:0.5rem;">
                <input type="checkbox" name="hide-footer" {{ if .SiteSettings.HideFooter }}checked{{ end }}>
                <span>Hide footer</span>
            </label>

            <label class="form-label widget-header">
                Custom footer (HTML)
                <textarea name="custom-footer" class="input" rows="4">{{ .SiteSettings.CustomFooter }}</textarea>
                <small class="color-subdue size-h5">Replaces the default Glance footer if set.</small>
            </label>

            <div class="flex gap-10 margin-top-10">
                <button type="submit">Save</button>
                <a class="color-subdue" style="align-self:center;" href="{{ .App.Config.Server.BaseURL }}/edit">Cancel</a>
            </div>
        </form>
    </main>
    {{ template "footer.html" . }}
</div>
{{- end }}