1
0
mirror of https://github.com/BookStackApp/BookStack.git synced 2025-08-07 23:03:00 +03:00

Started interface user shortcut form interface

Built controller actions and initual UI.
Still needs JS logic for shortcut input handling.
This commit is contained in:
Dan Brown
2022-11-08 21:17:45 +00:00
parent 1fc994177f
commit 66c8809799
13 changed files with 232 additions and 40 deletions

View File

@@ -0,0 +1,11 @@
<div class="flex-container-row justify-space-between items-center gap-m item-list-row">
<label for="shortcut-{{ $label }}" class="bold flex px-m py-xs">{{ $label }}</label>
<div class="px-m py-xs">
<input type="text"
class="small flex-none shortcut-input px-s py-xs"
id="shortcut-{{ $id }}"
name="shortcut[{{ $id }}]"
readonly
value="{{ $shortcuts->getShortcut($id) }}">
</div>
</div>

View File

@@ -0,0 +1,78 @@
@extends('layouts.simple')
@section('body')
<div class="container small my-xl">
<section class="card content-wrap">
<form action="{{ url('/preferences/shortcuts') }}" method="post">
{{ method_field('put') }}
{{ csrf_field() }}
<h1 class="list-heading">Interface Keyboard Shortcuts</h1>
<div class="flex-container-row items-center gap-m wrap mb-m">
<p class="flex mb-none min-width-m text-small text-muted">
Here you can enable or disable keyboard system interface shortcuts, used for navigation
and actions. You can customize each of the shortcuts below.
</p>
<div class="flex min-width-m text-m-right">
@include('form.toggle-switch', [
'name' => 'enabled',
'value' => $enabled,
'label' => 'Keyboard shortcuts enabled',
])
</div>
</div>
<hr>
<h2 class="list-heading mb-m">Navigation</h2>
<div class="flex-container-row wrap gap-m mb-xl">
<div class="flex min-width-l item-list">
@include('users.preferences.parts.shortcut-control', ['label' => 'Homepage', 'id' => 'home_view'])
@include('users.preferences.parts.shortcut-control', ['label' => trans('entities.shelves'), 'id' => 'shelves_view'])
@include('users.preferences.parts.shortcut-control', ['label' => trans('entities.books'), 'id' => 'books_view'])
@include('users.preferences.parts.shortcut-control', ['label' => trans('settings.settings'), 'id' => 'settings_view'])
@include('users.preferences.parts.shortcut-control', ['label' => trans('entities.my_favourites'), 'id' => 'favourites_view'])
</div>
<div class="flex min-width-l item-list">
@include('users.preferences.parts.shortcut-control', ['label' => trans('common.view_profile'), 'id' => 'profile_view'])
@include('users.preferences.parts.shortcut-control', ['label' => trans('auth.logout'), 'id' => 'logout'])
@include('users.preferences.parts.shortcut-control', ['label' => 'Global Search', 'id' => 'global_search'])
@include('users.preferences.parts.shortcut-control', ['label' => trans('common.next'), 'id' => 'next'])
@include('users.preferences.parts.shortcut-control', ['label' => trans('common.previous'), 'id' => 'previous'])
</div>
</div>
<h2 class="list-heading mb-m">Common Actions</h2>
<div class="flex-container-row wrap gap-m mb-xl">
<div class="flex min-width-l item-list">
@include('users.preferences.parts.shortcut-control', ['label' => trans('common.new'), 'id' => 'new'])
@include('users.preferences.parts.shortcut-control', ['label' => trans('common.edit'), 'id' => 'edit'])
@include('users.preferences.parts.shortcut-control', ['label' => trans('common.copy'), 'id' => 'copy'])
@include('users.preferences.parts.shortcut-control', ['label' => trans('common.delete'), 'id' => 'delete'])
@include('users.preferences.parts.shortcut-control', ['label' => trans('common.favourite'), 'id' => 'favourite'])
</div>
<div class="flex min-width-l item-list">
@include('users.preferences.parts.shortcut-control', ['label' => trans('entities.export'), 'id' => 'export'])
@include('users.preferences.parts.shortcut-control', ['label' => trans('common.sort'), 'id' => 'sort'])
@include('users.preferences.parts.shortcut-control', ['label' => trans('entities.permissions'), 'id' => 'permissions'])
@include('users.preferences.parts.shortcut-control', ['label' => trans('common.move'), 'id' => 'move'])
@include('users.preferences.parts.shortcut-control', ['label' => trans('entities.revisions'), 'id' => 'revisions'])
</div>
</div>
<p class="text-small text-muted">
Note: When shortcuts are enabled a helper overlay is available via pressing "?" which will
highlight the available shortcuts for actions currently visible on the screen.
</p>
<div class="form-group text-right">
<button class="button">{{ 'Save Shortcuts' }}</button>
</div>
</form>
</section>
</div>
@stop