search

joomla / backend-template

backend template for Joomla 4 working area
GNU General Public License v2.0
13 stars 23 forks source link

Mobile toolbar #338

Closed brianteeman closed 5 years ago

brianteeman commented 5 years ago

It took me ages to find the toolbar in any of the list views until I randomly clicked on a piece of text that had no styling etc

image

Accessibility Problems

  1. This is a button not a link so it should have a <button> not an <a>
  2. There is css to remove any indication that this is a link which is really bad but solved as soon as it is made a button 
    
a:not([href]):not([tabindex]),a:not([href]):not([tabindex]):focus,a:not([href]):not([tabindex]):hover {
color: inherit;
text-decoration: none
}

a:not([href]):not([tabindex]):focus { outline: 0 }


3. font icon
`<span class="icon-wrench"></span>`
This should be the same as all the other uses of font-icon
` <span class="icon-wrench" aria-hidden="true"></span` 

4. I appreciate that the text is "toolbar" and that makes sense but the wrench icon is really more for tools/utilities/options. If you dont want to use a burger icon here then how about https://fontawesome.com/icons/caret-square-down?style=solid

5. there may be more issues I stopped at this for now

### Styling issues
1. When this is made into a real button then it will need the appropriate btn classes obviously. It already has classes `class="btn btn-subhead   ` but the class `btn-subhead` doesnt apear anywhere in the css. I am guessing that thi8s might have supposed to been `btn subhead` as I can see js code `    const subHeadToolbar = doc.querySelector('.subhead');` but thats just a guess