client/settings: rearrange the form, add hints
This commit is contained in:
parent
d5a00fe4b9
commit
9383fd2b27
2 changed files with 11 additions and 9 deletions
|
@ -15,13 +15,13 @@ form
|
|||
display: block
|
||||
padding: 0.3em 0
|
||||
.input
|
||||
margin-bottom: 1em
|
||||
margin-bottom: 2em
|
||||
.input li:first-child label:not(.radio):not(.checkbox):not(.file-dropper),
|
||||
.input li:first-child
|
||||
padding-top: 0
|
||||
margin-top: 0
|
||||
.hint
|
||||
margin-top: 0.5em
|
||||
margin-top: 0.2em
|
||||
margin-bottom: 0
|
||||
color: $inactive-link-color
|
||||
font-size: 80%
|
||||
|
|
|
@ -4,22 +4,24 @@
|
|||
<p>These settings are saved to the browser's local storage and are not coupled to the user account, so they don't apply to other devices or browsers alike.</p>
|
||||
<div class='input'>
|
||||
<ul>
|
||||
<li>
|
||||
<%= ctx.makeCheckbox({text: 'Upscale small posts', id: 'upscale-small-posts', name: 'upscale-small-posts', checked: ctx.browsingSettings.upscaleSmallPosts}) %>
|
||||
</li>
|
||||
<li>
|
||||
<%= ctx.makeCheckbox({text: 'Endless scroll', id: 'endless-scroll', name: 'endless-scroll', checked: ctx.browsingSettings.endlessScroll}) %>
|
||||
<p class='hint'>Rather than using a paged navigation, smoothly scroll through the content.</p>
|
||||
</li>
|
||||
<li>
|
||||
<%= ctx.makeCheckbox({text: 'Enable keyboard shortcuts', id: 'keyboard-shortcuts', name: 'keyboard-shortcuts', checked: ctx.browsingSettings.keyboardShortcuts}) %>
|
||||
<a class='append icon' href='/help/keyboard'><i class='fa fa-question-circle-o'></i></a>
|
||||
</li>
|
||||
<li>
|
||||
<%= ctx.makeCheckbox({text: 'Upscale small posts', id: 'upscale-small-posts', name: 'upscale-small-posts', checked: ctx.browsingSettings.upscaleSmallPosts}) %>
|
||||
</li>
|
||||
<li>
|
||||
<%= ctx.makeCheckbox({text: 'Endless scroll', id: 'endless-scroll', name: 'endless-scroll', checked: ctx.browsingSettings.endlessScroll}) %>
|
||||
<p class='hint'>Rather than using a paged navigation, smoothly scrolls through the content.</p>
|
||||
</li>
|
||||
<li>
|
||||
<%= ctx.makeCheckbox({text: 'Enable transparency grid', id: 'transparency-grid', name: 'transparency-grid', checked: ctx.browsingSettings.transparencyGrid}) %>
|
||||
<p class='hint'>Renders a checkered pattern behind posts with transparent background.</p>
|
||||
</li>
|
||||
<li>
|
||||
<%= ctx.makeCheckbox({text: 'Show tag suggestions', id: 'tag-suggestions', name: 'tag-suggestions', checked: ctx.browsingSettings.tagSuggestions}) %>
|
||||
<p class='hint'>Shows a popup with suggested tags in edit forms.</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue