Commit 84884ba1 authored by Pramith Dayananda's avatar Pramith Dayananda Committed by Robert Lyon
Browse files

Bug 1692758: Tabbable "More options" link on "Pages and Collections"

To improve accessibility, add a CSS outline to the "More options" icon
on "Pages and Collections".

behatnotneeded

Change-Id: I44597a611962d46cd667921f7a95f7228592a5e0
parent 51085613
......@@ -71,6 +71,9 @@
}
}
}
.dropdown-toggle:focus {
outline: 1px dotted $theme-text-lighttone-color;
}
.dropdown-menu {
top: 100%;
......
......@@ -39,8 +39,59 @@
</div>
<div class="panel-footer">
{* Note: This is positioned relative to base of panel-quarter *}
<div class="page-access">
{if $view.accesslist || $view.manageaccess}
<a href="#" class="dropdown-toggle btn btn-link" data-toggle="dropdown" aria-expanded="false" title="{str tag='manageaccess' section='view'}">
<span class="icon icon-chevron-down open-indicator" role="presentation" aria-hidden="true"></span>
<span class="icon {if !$view.accesslist}icon-lock{else}icon-unlock-alt{/if} close-indicator" role="presentation" aria-hidden="true"></span>
<span class="sr-only">{str tag="accessrulesfor" section="view" arg1="$view.vtitle"}</span>
</a>
<ul class="dropdown-menu" role="menu">
{foreach from=$view.manageaccess item=manageitem}
<li>
{if $manageitem->accesstype == 'managesharing'}
<a class="seperator" href="{$WWWROOT}view/accessurl.php?id={$view.id}{if $view.collid}&collection={$view.collid}{/if}">
<span class="icon {if $view.locked}icon-lock{else}icon-unlock-alt{/if} left" role="presentation" aria-hidden="true"></span>
<span class="link-text">{$manageitem->displayname}</span>
<span class="sr-only">{$manageitem->accessibilityname}</span>
</a>
{/if}
</li>
{/foreach}
{foreach from=$view.accesslist item=accessitem}
<li>
<a href="{$WWWROOT}view/accessurl.php?id={$view.id}{if $view.collid}&collection={$view.collid}{/if}">
{if $accessitem->accesstype == 'loggedin'}
<span class="icon icon-user-plus left" role="presentation" aria-hidden="true"></span>
<span class="link-text">{str tag="registeredusers" section="view"}</span>
{elseif $accessitem->accesstype == 'public'}
<span class="icon icon-globe left" role="presentation" aria-hidden="true"></span>
<span class="link-text">{str tag="public" section="view"}</span>
{elseif $accessitem->accesstype == 'friends'}
<span class="icon icon-user-plus left" role="presentation" aria-hidden="true"></span>
<span class="link-text">{str tag="friends" section="view"}</span>
{elseif $accessitem->group}
<span class="icon icon-users left" role="presentation" aria-hidden="true"></span>
<span class="link-text">{$accessitem->displayname}</span>
{elseif $accessitem->institution}
<span class="icon icon-university left" role="presentation" aria-hidden="true"></span>
<span class="link-text">{$accessitem->displayname}</span>
{elseif $accessitem->usr}
<span class="icon icon-user left" role="presentation" aria-hidden="true"></span>
<span class="link-text">{$accessitem->displayname}</span>
{elseif $accessitem->token}
<span class="icon icon-globe left" role="presentation" aria-hidden="true"></span>
<span class="link-text">{str tag="token" section="view"}</span>
{/if}
</a>
</li>
{/foreach}
</ul>
{/if}
</div>
<div class="page-controls">
<a class="dropdown-toggle moremenu btn btn-link" type="button" data-toggle="dropdown" aria-expanded="false" title="{str tag='more...' section='mahara'}">
<a href="#" class="dropdown-toggle moremenu btn btn-link" type="button" data-toggle="dropdown" aria-expanded="false" title="{str tag='more...' section='mahara'}">
<span class="icon icon-chevron-down open-indicator" role="presentation" aria-hidden="true"></span>
<span class="icon icon-ellipsis-v close-indicator" role="presentation" aria-hidden="true"></span>
<span class="sr-only">{str tag=moreoptionsfor section=mahara arg1="$view.vtitle"}</span>
......@@ -93,57 +144,6 @@
</ul>{* hamburger buttons *}
</div>
<div class="page-access">
{if $view.accesslist || $view.manageaccess}
<a href="#" class="dropdown-toggle btn btn-link" data-toggle="dropdown" aria-expanded="false" title="{str tag='manageaccess' section='view'}">
<span class="icon icon-chevron-down open-indicator" role="presentation" aria-hidden="true"></span>
<span class="icon {if !$view.accesslist}icon-lock{else}icon-unlock-alt{/if} close-indicator" role="presentation" aria-hidden="true"></span>
<span class="sr-only">{str tag="accessrulesfor" section="view" arg1="$view.vtitle"}</span>
</a>
<ul class="dropdown-menu" role="menu">
{foreach from=$view.manageaccess item=manageitem}
<li>
{if $manageitem->accesstype == 'managesharing'}
<a class="seperator" href="{$WWWROOT}view/accessurl.php?id={$view.id}{if $view.collid}&collection={$view.collid}{/if}">
<span class="icon {if $view.locked}icon-lock{else}icon-unlock-alt{/if} left" role="presentation" aria-hidden="true"></span>
<span class="link-text">{$manageitem->displayname}</span>
<span class="sr-only">{$manageitem->accessibilityname}</span>
</a>
{/if}
</li>
{/foreach}
{foreach from=$view.accesslist item=accessitem}
<li>
<a href="{$WWWROOT}view/accessurl.php?id={$view.id}{if $view.collid}&collection={$view.collid}{/if}">
{if $accessitem->accesstype == 'loggedin'}
<span class="icon icon-user-plus left" role="presentation" aria-hidden="true"></span>
<span class="link-text">{str tag="registeredusers" section="view"}</span>
{elseif $accessitem->accesstype == 'public'}
<span class="icon icon-globe left" role="presentation" aria-hidden="true"></span>
<span class="link-text">{str tag="public" section="view"}</span>
{elseif $accessitem->accesstype == 'friends'}
<span class="icon icon-user-plus left" role="presentation" aria-hidden="true"></span>
<span class="link-text">{str tag="friends" section="view"}</span>
{elseif $accessitem->group}
<span class="icon icon-users left" role="presentation" aria-hidden="true"></span>
<span class="link-text">{$accessitem->displayname}</span>
{elseif $accessitem->institution}
<span class="icon icon-university left" role="presentation" aria-hidden="true"></span>
<span class="link-text">{$accessitem->displayname}</span>
{elseif $accessitem->usr}
<span class="icon icon-user left" role="presentation" aria-hidden="true"></span>
<span class="link-text">{$accessitem->displayname}</span>
{elseif $accessitem->token}
<span class="icon icon-globe left" role="presentation" aria-hidden="true"></span>
<span class="link-text">{str tag="token" section="view"}</span>
{/if}
</a>
</li>
{/foreach}
</ul>
{/if}
</div>
{if $view.collid}
{assign var=fullnumviews value=$view.numviews}
{if $view.framework}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment