diff --git a/themes/finc/js/finc.js b/themes/finc/js/finc.js new file mode 100644 index 0000000000000000000000000000000000000000..c70b2c9a855c5c3127462f1bd6c302670ee7eddd --- /dev/null +++ b/themes/finc/js/finc.js @@ -0,0 +1,12 @@ +// remove when fixed in BS + +// Remove/add aria-hidden + add modalTitle for screen-reader access +$(document).on('shown.bs.modal', function () { + $('#modal').attr('aria-hidden', 'false').show(); + $('#modal h2').attr('id', 'modalTitle'); + $('#modal').focus(); // check if necessary! +}); + +$(document).on('hidden.bs.modal', function () { + $('#modal').attr('aria-hidden', 'true').hide(); +}); diff --git a/themes/finc/scss/compiled.scss b/themes/finc/scss/compiled.scss index 0b60e9e358117d3f2e348b77177fb4eab37fd9be..a6f1d3e22678521987755e0a648fe7f9fd682711 100644 --- a/themes/finc/scss/compiled.scss +++ b/themes/finc/scss/compiled.scss @@ -1779,6 +1779,13 @@ footer ul { } } +@media (min-width: $screen-md-min) { + // Automatically set modal's width for larger viewports + .modal-dialog { + width: $modal-lg; + } +} + @media (min-width: $screen-lg-min) { .modal-dialog { max-width: em(900px); diff --git a/themes/finc/templates/layout/layout.phtml b/themes/finc/templates/layout/layout.phtml index e82dffac90501867b0a83f46393821950bb6df01..c6ba1d18fc875feaeb6c7d2b84bcd2ed27882070 100644 --- a/themes/finc/templates/layout/layout.phtml +++ b/themes/finc/templates/layout/layout.phtml @@ -51,7 +51,7 @@ 'loading' => 'Loading', 'more' => 'more', 'number_thousands_separator' => [ - 'number_thousands_separator', null, ',' + 'number_thousands_separator', null, ',' ], 'sms_success' => 'sms_success' ] @@ -182,15 +182,24 @@ if (!isset($this->layout()->searchbox)) { <!-- MODAL IN CASE WE NEED ONE --> -<div id="modal" class="modal fade hidden-print" tabindex="-1" role="dialog" aria-labelledby="modalTitle" aria-hidden="true"> +<? /* remove aria-hidden attr via JS, move X button to logical pos. in structure + make accessible via tab */ ?> +<div id="modal" class="modal fade hidden-print" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="modalTitle" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> - <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <div class="modal-body"><?=$this->transEsc('Loading')?> ...</div> + <button type="button" class="close" data-dismiss="modal" tabindex="0"> + <span class="sr-only"><?=$this->transEsc('Close')?></span> + <i class="fa fa-times" aria-hidden="true"></i> + </button> </div> </div> </div> -<div class="offcanvas-toggle" data-toggle="offcanvas"><i class="fa" title="<?=$this->transEsc('sidebar_expand')?>"></i></div> + +<div class="offcanvas-toggle" data-toggle="offcanvas" tabindex="0"> + <i class="fa" title="<?=$this->transEsc('sidebar_expand')?>"></i> + <span class="sr-only"><?=$this->transEsc('sidebar_expand')?></span> +</div> + <div class="offcanvas-overlay" data-toggle="offcanvas"></div> <?=$this->googleanalytics()?> <?=$this->piwik()?> diff --git a/themes/finc/theme.config.php b/themes/finc/theme.config.php index 4ade313e43d1b747e2a3d11fd6285ce189c300b2..7dd44f1de5bf2eb47a5495c0c1dd40eff1c53702 100644 --- a/themes/finc/theme.config.php +++ b/themes/finc/theme.config.php @@ -4,6 +4,7 @@ return array( 'js' => array( 'openurl.js', 'check_item_statuses.js', + 'finc.js', ), 'helpers' => array( 'factories' => array(