]> BookStack Code Mirror - bookstack/blob - resources/views/settings/index.blade.php
added additional color settings into UI
[bookstack] / resources / views / settings / index.blade.php
1 @extends('simple-layout')
2
3 @section('body')
4     <div class="container small">
5
6         <div class="grid left-focus v-center no-row-gap">
7             <div class="py-m">
8                 @include('settings.navbar', ['selected' => 'settings'])
9             </div>
10             <div class="text-right p-m">
11                 <a target="_blank" rel="noopener noreferrer" href="https://github.com/BookStackApp/BookStack/releases">
12                     BookStack @if(strpos($version, 'v') !== 0) version @endif {{ $version }}
13                 </a>
14             </div>
15         </div>
16
17         <div class="card content-wrap auto-height">
18             <h2 class="list-heading">{{ trans('settings.app_features_security') }}</h2>
19             <form action="{{ url("/settings") }}" method="POST">
20                 {!! csrf_field() !!}
21
22                 <div class="setting-list">
23
24
25                     <div class="grid half gap-xl">
26                         <div>
27                             <label for="setting-app-public" class="setting-list-label">{{ trans('settings.app_public_access') }}</label>
28                             <p class="small">{!! trans('settings.app_public_access_desc') !!}</p>
29                             @if(userCan('users-manage'))
30                                 <p class="small mb-none">
31                                     <a href="{{ url($guestUser->getEditUrl()) }}">{!! trans('settings.app_public_access_desc_guest') !!}</a>
32                                 </p>
33                             @endif
34                         </div>
35                         <div>
36                             @include('components.toggle-switch', [
37                                 'name' => 'setting-app-public',
38                                 'value' => setting('app-public'),
39                                 'label' => trans('settings.app_public_access_toggle'),
40                             ])
41                         </div>
42                     </div>
43
44                     <div class="grid half gap-xl">
45                         <div>
46                             <label class="setting-list-label">{{ trans('settings.app_secure_images') }}</label>
47                             <p class="small">{{ trans('settings.app_secure_images_desc') }}</p>
48                         </div>
49                         <div>
50                             @include('components.toggle-switch', [
51                                 'name' => 'setting-app-secure-images',
52                                 'value' => setting('app-secure-images'),
53                                 'label' => trans('settings.app_secure_images_toggle'),
54                             ])
55                         </div>
56                     </div>
57
58                     <div class="grid half gap-xl">
59                         <div>
60                             <label class="setting-list-label">{{ trans('settings.app_disable_comments') }}</label>
61                             <p class="small">{!! trans('settings.app_disable_comments_desc') !!}</p>
62                         </div>
63                         <div>
64                             @include('components.toggle-switch', [
65                                 'name' => 'setting-app-disable-comments',
66                                 'value' => setting('app-disable-comments'),
67                                 'label' => trans('settings.app_disable_comments_toggle'),
68                             ])
69                         </div>
70                     </div>
71
72
73                 </div>
74
75                 <div class="form-group text-right">
76                     <button type="submit" class="button">{{ trans('settings.settings_save') }}</button>
77                 </div>
78             </form>
79         </div>
80
81         <div class="card content-wrap auto-height">
82             <h2 class="list-heading">{{ trans('settings.app_customization') }}</h2>
83             <form action="{{ url("/settings") }}" method="POST" enctype="multipart/form-data">
84                 {!! csrf_field() !!}
85
86                 <div class="setting-list">
87
88                     <div class="grid half gap-xl">
89                         <div>
90                             <label for="setting-app-name" class="setting-list-label">{{ trans('settings.app_name') }}</label>
91                             <p class="small">{{ trans('settings.app_name_desc') }}</p>
92                         </div>
93                         <div>
94                             <input type="text" value="{{ setting('app-name', 'BookStack') }}" name="setting-app-name" id="setting-app-name">
95                             @include('components.toggle-switch', [
96                                 'name' => 'setting-app-name-header',
97                                 'value' => setting('app-name-header'),
98                                 'label' => trans('settings.app_name_header'),
99                             ])
100                         </div>
101                     </div>
102
103                     <div class="grid half gap-xl">
104                         <div>
105                             <label class="setting-list-label">{{ trans('settings.app_editor') }}</label>
106                             <p class="small">{{ trans('settings.app_editor_desc') }}</p>
107                         </div>
108                         <div>
109                             <select name="setting-app-editor" id="setting-app-editor">
110                                 <option @if(setting('app-editor') === 'wysiwyg') selected @endif value="wysiwyg">WYSIWYG</option>
111                                 <option @if(setting('app-editor') === 'markdown') selected @endif value="markdown">Markdown</option>
112                             </select>
113                         </div>
114                     </div>
115
116                     <div class="grid half gap-xl">
117                         <div>
118                             <label class="setting-list-label">{{ trans('settings.app_logo') }}</label>
119                             <p class="small">{!! trans('settings.app_logo_desc') !!}</p>
120                         </div>
121                         <div>
122                             @include('components.image-picker', [
123                                      'removeName' => 'setting-app-logo',
124                                      'removeValue' => 'none',
125                                      'defaultImage' => url('/logo.png'),
126                                      'currentImage' => setting('app-logo'),
127                                      'name' => 'app_logo',
128                                      'imageClass' => 'logo-image',
129                                  ])
130                         </div>
131                     </div>
132
133                     <!-- Primary Color -->
134                     <div class="grid half gap-xl">
135                         <div>
136                             <label class="setting-list-label">{{ trans('settings.app_primary_color') }}</label>
137                             <p class="small">{!! trans('settings.app_primary_color_desc') !!}</p>
138                         </div>
139                         <div setting-app-color-picker class="text-m-right">
140                             <input type="color" data-default="#206ea7" data-current="{{ setting('app-color') }}" value="{{ setting('app-color') }}" name="setting-app-color" id="setting-app-color" placeholder="#206ea7">
141                             <input type="hidden" value="{{ setting('app-color-light') }}" name="setting-app-color-light" id="setting-app-color-light">
142                             <br>
143                             <button type="button" class="text-button text-muted mt-s mx-s" setting-app-color-picker-default>{{ trans('common.default') }}</button>
144                             <span class="sep">|</span>
145                             <button type="button" class="text-button text-muted mt-s mx-s" setting-app-color-picker-reset>{{ trans('common.reset') }}</button>
146                         </div>
147                     </div>
148
149                     <!-- Shelf Color -->
150                     <div class="grid half gap-xl">
151                         <div>
152                             <label class="setting-list-label">{{ trans('settings.bookshelf_color') }}</label>
153                             <p class="small">{!! trans('settings.bookshelf_color_desc') !!}</p>
154                         </div>
155                         <div setting-color-picker class="text-m-right">
156                             <input type="color" data-default="#a94747" data-current="{{ setting('bookshelf-color') }}" value="{{ setting('bookshelf-color') }}" name="setting-bookshelf-color" id="setting-bookshelf-color" placeholder="#a94747">
157                             <br>
158                             <button type="button" class="text-button text-muted mt-s mx-s" setting-color-picker-default>{{ trans('common.default') }}</button>
159                             <span class="sep">|</span>
160                             <button type="button" class="text-button text-muted mt-s mx-s" setting-color-picker-reset>{{ trans('common.reset') }}</button>
161                         </div>
162                     </div>
163
164                     <!-- Book Color -->
165                     <div class="grid half gap-xl">
166                         <div>
167                             <label class="setting-list-label">{{ trans('settings.book_color') }}</label>
168                             <p class="small">{!! trans('settings.book_color_desc') !!}</p>
169                         </div>
170                         <div setting-color-picker class="text-m-right">
171                             <input type="color" data-default="#077b70" data-current="{{ setting('book-color') }}" value="{{ setting('book-color') }}" name="setting-book-color" id="setting-book-color" placeholder="#077b70">
172                             <br>
173                             <button type="button" class="text-button text-muted mt-s mx-s" setting-color-picker-default>{{ trans('common.default') }}</button>
174                             <span class="sep">|</span>
175                             <button type="button" class="text-button text-muted mt-s mx-s" setting-color-picker-reset>{{ trans('common.reset') }}</button>
176                         </div>
177                     </div>
178
179                     <!-- Chapter Color -->
180                     <div class="grid half gap-xl">
181                         <div>
182                             <label class="setting-list-label">{{ trans('settings.chapter_color') }}</label>
183                             <p class="small">{!! trans('settings.chapter_color_desc') !!}</p>
184                         </div>
185                         <div setting-color-picker class="text-m-right">
186                             <input type="color" data-default="#af4d0d" data-current="{{ setting('chapter-color') }}" value="{{ setting('chapter-color') }}" name="setting-chapter-color" id="setting-chapter-color" placeholder="#af4d0d">
187                             <br>
188                             <button type="button" class="text-button text-muted mt-s mx-s" setting-color-picker-default>{{ trans('common.default') }}</button>
189                             <span class="sep">|</span>
190                             <button type="button" class="text-button text-muted mt-s mx-s" setting-color-picker-reset>{{ trans('common.reset') }}</button>
191                         </div>
192                     </div>
193
194                     <!-- Page Color -->
195                     <div class="grid half gap-xl">
196                         <div>
197                             <label class="setting-list-label">{{ trans('settings.page_color') }}</label>
198                             <p class="small">{!! trans('settings.page_color_desc') !!}</p>
199                         </div>
200                         <div setting-color-picker class="text-m-right">
201                             <input type="color" data-default="#206ea7" data-current="{{ setting('page-color') }}" value="{{ setting('page-color') }}" name="setting-page-color" id="setting-page-color" placeholder="#206ea7">
202                             <br>
203                             <button type="button" class="text-button text-muted mt-s mx-s" setting-color-picker-default>{{ trans('common.default') }}</button>
204                             <span class="sep">|</span>
205                             <button type="button" class="text-button text-muted mt-s mx-s" setting-color-picker-reset>{{ trans('common.reset') }}</button>
206                         </div>
207                     </div>
208
209                     <!-- Page Draft Color -->
210                     <div class="grid half gap-xl">
211                         <div>
212                             <label class="setting-list-label">{{ trans('settings.page_draft_color') }}</label>
213                             <p class="small">{!! trans('settings.page_draft_color_desc') !!}</p>
214                         </div>
215                         <div setting-color-picker class="text-m-right">
216                             <input type="color" data-default="#7e50b1" data-current="{{ setting('page-draft-color') }}" value="{{ setting('page-draft-color') }}" name="setting-page-draft-color" id="setting-page-draft-color" placeholder="#7e50b1">
217                             <br>
218                             <button type="button" class="text-button text-muted mt-s mx-s" setting-color-picker-default>{{ trans('common.default') }}</button>
219                             <span class="sep">|</span>
220                             <button type="button" class="text-button text-muted mt-s mx-s" setting-color-picker-reset>{{ trans('common.reset') }}</button>
221                         </div>
222                     </div>
223
224                     <div homepage-control id="homepage-control" class="grid half gap-xl">
225                         <div>
226                             <label for="setting-app-homepage" class="setting-list-label">{{ trans('settings.app_homepage') }}</label>
227                             <p class="small">{{ trans('settings.app_homepage_desc') }}</p>
228                         </div>
229                         <div>
230                             <select name="setting-app-homepage-type" id="setting-app-homepage-type">
231                                 <option @if(setting('app-homepage-type') === 'default') selected @endif value="default">{{ trans('common.default') }}</option>
232                                 <option @if(setting('app-homepage-type') === 'books') selected @endif value="books">{{ trans('entities.books') }}</option>
233                                 <option @if(setting('app-homepage-type') === 'bookshelves') selected @endif value="bookshelves">{{ trans('entities.shelves') }}</option>
234                                 <option @if(setting('app-homepage-type') === 'page') selected @endif value="page">{{ trans('entities.pages_specific') }}</option>
235                             </select>
236
237                             <div page-picker-container style="display: none;" class="mt-m">
238                                 @include('components.page-picker', ['name' => 'setting-app-homepage', 'placeholder' => trans('settings.app_homepage_select'), 'value' => setting('app-homepage')])
239                             </div>
240                         </div>
241                     </div>
242
243
244                     <div>
245                         <label for="setting-app-custom-head" class="setting-list-label">{{ trans('settings.app_custom_html') }}</label>
246                         <p class="small">{{ trans('settings.app_custom_html_desc') }}</p>
247                         <textarea name="setting-app-custom-head" id="setting-app-custom-head" class="simple-code-input mt-m">{{ setting('app-custom-head', '') }}</textarea>
248                         <p class="small text-right">{{ trans('settings.app_custom_html_disabled_notice') }}</p>
249                     </div>
250
251
252                 </div>
253
254                 <div class="form-group text-right">
255                     <button type="submit" class="button">{{ trans('settings.settings_save') }}</button>
256                 </div>
257             </form>
258         </div>
259
260         <div class="card content-wrap auto-height">
261             <h2 class="list-heading">{{ trans('settings.reg_settings') }}</h2>
262             <form action="{{ url("/settings") }}" method="POST">
263                 {!! csrf_field() !!}
264
265                 <div class="setting-list">
266                     <div class="grid half gap-xl">
267                         <div>
268                             <label class="setting-list-label">{{ trans('settings.reg_enable') }}</label>
269                             <p class="small">{!! trans('settings.reg_enable_desc') !!}</p>
270                         </div>
271                         <div>
272                             @include('components.toggle-switch', [
273                                 'name' => 'setting-registration-enabled',
274                                 'value' => setting('registration-enabled'),
275                                 'label' => trans('settings.reg_enable_toggle')
276                             ])
277
278                             <label for="setting-registration-role">{{ trans('settings.reg_default_role') }}</label>
279                             <select id="setting-registration-role" name="setting-registration-role" @if($errors->has('setting-registration-role')) class="neg" @endif>
280                                 @foreach(\BookStack\Auth\Role::all() as $role)
281                                     <option value="{{$role->id}}" data-role-name="{{ $role->name }}"
282                                             @if(setting('registration-role', \BookStack\Auth\Role::first()->id) == $role->id) selected @endif
283                                     >
284                                         {{ $role->display_name }}
285                                     </option>
286                                 @endforeach
287                             </select>
288                         </div>
289                     </div>
290
291                     <div class="grid half gap-xl">
292                         <div>
293                             <label for="setting-registration-restrict" class="setting-list-label">{{ trans('settings.reg_confirm_restrict_domain') }}</label>
294                             <p class="small">{!! trans('settings.reg_confirm_restrict_domain_desc') !!}</p>
295                         </div>
296                         <div>
297                             <input type="text" id="setting-registration-restrict" name="setting-registration-restrict" placeholder="{{ trans('settings.reg_confirm_restrict_domain_placeholder') }}" value="{{ setting('registration-restrict', '') }}">
298                         </div>
299                     </div>
300
301                     <div class="grid half gap-xl">
302                         <div>
303                             <label class="setting-list-label">{{ trans('settings.reg_email_confirmation') }}</label>
304                             <p class="small">{{ trans('settings.reg_confirm_email_desc') }}</p>
305                         </div>
306                         <div>
307                             @include('components.toggle-switch', [
308                                 'name' => 'setting-registration-confirmation',
309                                 'value' => setting('registration-confirmation'),
310                                 'label' => trans('settings.reg_email_confirmation_toggle')
311                             ])
312                         </div>
313                     </div>
314
315                 </div>
316
317                 <div class="form-group text-right">
318                     <button type="submit" class="button">{{ trans('settings.settings_save') }}</button>
319                 </div>
320             </form>
321         </div>
322
323     </div>
324
325     @include('components.image-manager', ['imageType' => 'system'])
326     @include('components.entity-selector-popup', ['entityTypes' => 'page'])
327 @stop