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

Made another mass of accessibility improvements

- 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
This commit is contained in:
Dan Brown
2019-08-25 15:44:51 +01:00
parent ae93a6ed07
commit cf5d51e7b8
48 changed files with 146 additions and 119 deletions

View File

@ -7,7 +7,7 @@
@include('settings.navbar', ['selected' => 'users'])
</div>
<div class="card content-wrap">
<section class="card content-wrap">
<h1 class="list-heading">{{ $user->id === $currentUser->id ? trans('settings.users_edit_profile') : trans('settings.users_edit') }}</h1>
<form action="{{ url("/settings/users/{$user->id}") }}" method="post" enctype="multipart/form-data">
{!! csrf_field() !!}
@ -61,29 +61,31 @@
<button class="button" type="submit">{{ trans('common.save') }}</button>
</div>
</form>
</div>
</section>
@if($currentUser->id === $user->id && count($activeSocialDrivers) > 0)
<div class="card content-wrap auto-height">
<section class="card content-wrap auto-height">
<h2 class="list-heading">{{ trans('settings.users_social_accounts') }}</h2>
<p class="text-muted">{{ trans('settings.users_social_accounts_info') }}</p>
<div class="container">
<div class="grid third">
@foreach($activeSocialDrivers as $driver => $enabled)
<div class="text-center mb-m">
<div>@icon('auth/'. $driver, ['style' => 'width: 56px;height: 56px;'])</div>
<div role="presentation">@icon('auth/'. $driver, ['style' => 'width: 56px;height: 56px;'])</div>
<div>
@if($user->hasSocialAccount($driver))
<a href="{{ url("/login/service/{$driver}/detach") }}" class="button small outline">{{ trans('settings.users_social_disconnect') }}</a>
<a href="{{ url("/login/service/{$driver}/detach") }}" aria-label="{{ trans('settings.users_social_disconnect') }} - {{ $driver }}"
class="button small outline">{{ trans('settings.users_social_disconnect') }}</a>
@else
<a href="{{ url("/login/service/{$driver}") }}" class="button small outline">{{ trans('settings.users_social_connect') }}</a>
<a href="{{ url("/login/service/{$driver}") }}" aria-label="{{ trans('settings.users_social_connect') }} - {{ $driver }}"
class="button small outline">{{ trans('settings.users_social_connect') }}</a>
@endif
</div>
</div>
@endforeach
</div>
</div>
</div>
</section>
@endif
</div>