Make Tab Panel Title H2

[dubrod]

Per the OSU Interface Requests Image

"Resources" , "Files", and "Elements" need to be <h2>

• [x] Wayne will create CSS
• [x] ExtJs file will be identified and changed
• [x] The parent <li> will also need aria-expanded="true/false"

<li id="ext-comp-1007" class="x-panel menu-section" tabindex="0" style="width: 310px;" aria-expanded="true">

<li id="ext-comp-1007" class="x-panel menu-section x-panel-collapsed" tabindex="-1" style="width: 310px;" aria-expanded="false">

[dubrod]

the <span> inside the <a> for the Main Tree Tabs can now be changed to

<h2 class="x-panel-header-text" id="ext-gen24"><i class="icon icon-sitemap"></i><span class="title">Resources</span></h2>

[theboxer]

@dubrod I can't change the span to h2 as this element is hardcoded in core Ext and can't be changed. I can wrap the inner i + span with h2, so it will look like this:

<a href="javascript:;" tabindex="1" title="" id="ext-gen21" class=" x-panel-header x-unselectable" style="cursor: pointer;">
    <span class="x-panel-header-text" id="ext-gen24">
        <h2>
            <i class="icon icon-sitemap"></i><span class="title">Resources</span>
        </h2>
    </span>
</a>

Let me know please if that works or not.

[dubrod]

That should be fine. I believe this is for the screen reader anyway.

Also i was wrong about the aria expanded. im updating the top comment.

[theboxer]

Is the top comment updated already?

[theboxer]

Should be done, please review & close.

[dubrod]

Looks awesome to me! I'll mark it as needing testing by the stakeholders.