mirror of
https://github.com/BookStackApp/BookStack.git
synced 2024-09-06 01:22:23 +00:00
cf5d51e7b8
- Set proper semantic tags for main parts of content. - Removed focus-trap from tag manager/autosuggest. - Set better accessibility labelling on tag manager. - Updated collapsible sections to be keyboard navigatable. - Improved input focus styling to better fit theme. - Updated custom styled file picker to be accessible via keyboard. Related to #1320
22 lines
1.5 KiB
PHP
22 lines
1.5 KiB
PHP
<div id="tag-manager" entity-id="{{ isset($entity) ? $entity->id : 0 }}" entity-type="{{ $entity ? $entity->getType() : $entityType }}">
|
|
<div class="tags">
|
|
<p class="text-muted small">{!! nl2br(e(trans('entities.tags_explain'))) !!}</p>
|
|
|
|
<draggable :options="{handle: '.handle'}" :list="tags" element="div">
|
|
<div v-for="(tag, i) in tags" :key="tag.key" class="card drag-card">
|
|
<div class="handle" >@icon('grip')</div>
|
|
<div>
|
|
<autosuggest url="{{ url('/ajax/tags/suggest/names') }}" type="name" class="outline" :name="getTagFieldName(i, 'name')"
|
|
v-model="tag.name" @input="tagChange(tag)" @blur="tagBlur(tag)" placeholder="{{ trans('entities.tag_name') }}"/>
|
|
</div>
|
|
<div>
|
|
<autosuggest url="{{ url('/ajax/tags/suggest/values') }}" type="value" class="outline" :name="getTagFieldName(i, 'value')"
|
|
v-model="tag.value" @change="tagChange(tag)" @blur="tagBlur(tag)" placeholder="{{ trans('entities.tag_value') }}"/>
|
|
</div>
|
|
<button type="button" aria-label="{{ trans('entities.tags_remove') }}" v-show="tags.length !== 1" class="text-center drag-card-action text-neg" @click="removeTag(tag)">@icon('close')</button>
|
|
</div>
|
|
</draggable>
|
|
|
|
<button @click="addEmptyTag" type="button" class="text-button">{{ trans('entities.tags_add') }}</button>
|
|
</div>
|
|
</div> |