{{with .Data}}
{{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
<div class="page-title"> Settings </div>

<form id="settings-form" action="/settings" method="POST">
	<input type="hidden" name="csrf_token" value="{{$.Ctx.CSRFToken}}">
	<div class="settings-form-field">
		<label for="visibility"> Default scope </label>
		<select id="visibility" name="visibility">
			<option value="public" {{if eq .Settings.DefaultVisibility "public"}}selected{{end}}>Public</option>
			<option value="unlisted" {{if eq .Settings.DefaultVisibility "unlisted"}}selected{{end}}>Unlisted</option>
			<option value="private" {{if eq .Settings.DefaultVisibility "private"}}selected{{end}}>Private</option>
			<option value="direct" {{if eq .Settings.DefaultVisibility "direct"}}selected{{end}}>Direct</option>
		</select>
	</div>
	<div class="settings-form-field">
		<input id="copy-scope" name="copy_scope" type="checkbox" value="true" {{if .Settings.CopyScope}}checked{{end}}>
		<label for="copy-scope"> Copy scope when replying </label>
	</div>
	<div class="settings-form-field">
		<input id="thread-tab" name="thread_in_new_tab" type="checkbox" value="true" {{if .Settings.ThreadInNewTab}}checked{{end}}>
		<label for="thread-tab"> Open threads in new tab from timeline </label>
	</div>
	<div class="settings-form-field">
		<input id="hide-attachments" name="hide_attachments" type="checkbox" value="true" {{if .Settings.HideAttachments}}checked{{end}}>
		<label for="hide-attachments"> Hide attachments </label>
	</div>
	<div class="settings-form-field">
		<input id="mask-nsfw" name="mask_nsfw" type="checkbox" value="true" {{if .Settings.MaskNSFW}}checked{{end}}>
		<label for="mask-nsfw"> Mask NSFW attachments </label>
	</div>
	<div class="settings-form-field">
		<input id="auto-refresh-notifications" name="auto_refresh_notifications" type="checkbox" value="true" {{if .Settings.AutoRefreshNotifications}}checked{{end}}>
		<label for="auto-refresh-notifications"> Auto refresh notifications </label>
	</div>
	<div class="settings-form-field">
		<input id="fluoride-mode" name="fluoride_mode" type="checkbox" value="true" {{if .Settings.FluorideMode}}checked{{end}}>
		<label for="fluoride-mode"> Enable <abbr title="Enable JavaScript based functionality, e.g., like/retweet without page reload and reply preview on thread page">fluoride mode</abbr> </label>
	</div>
	<div class="settings-form-field">
		<input id="dark-mode" name="dark_mode" type="checkbox" value="true" {{if .Settings.DarkMode}}checked{{end}}>
		<label for="dark-mode"> Use dark theme </label>
	</div>
	<button type="submit"> Save </button>
</form>

{{template "footer.tmpl"}}
{{end}}