Fix:iSpot.org.uk

Your place to share nature.

Welcome to iSpot! Learn more about wildlife, share your interest with a friendly community and get help identifying what you have seen. iSpot is part of The OpenScience Laboratory - an online centre at the cutting edge of practical science. This is an initiative of The Open University and The Wolfson Foundation.

iSpot logo. Loading..

Accessibility and usability fixes for the nature community site.

Includes accessibility enhancements and fixes for the new "ispot_2013" theme.

Fixes

%YAML 1.2
---
_CONFIG_:
    name: {{PAGENAME}}
    description: ""
    includes:
        - http://www.ispot.org.uk/*
    test_urls:
        - http://www.ispotnature.org/
        - http://www.ispot.org.uk/
        - http://ispot.org.uk/
        - http://ispot-approval.open.ac.uk/
        - http://ispot-dev.open.ac.uk/
        - http://ispot/
    default_locale: en-GB

#
# Fixes.
#
a[href = '#'], a[href = 'javascript:void(0)'], .rpx-icon-small:
    role: button
    tabindex: 0

a[target='_blank']:
    title: Opens in new window

"#header":
    role: header

"#main-menu":
    role: navigation
    aria-label: Site menu

"#footer":
    role: contentinfo

"#main-content, #main-content-front":
    role: main
    aria-labelledby: "#main-content > h2"

.block-search:
    role: search
    aria-labelledby: .block-search > h2

input#edit-search-block-form-1:
    placeholder: Search iSpot
    required: ""
    aria-required: true

input#edit-name, input#edit-pass:
    required: ""
    aria-required: true

img#fb-connect-button:
    role: button
    tabindex: 0
    title: Connect with Facebook
    aria-label: Connect and login via Facebook

.jcarousel-prev[disabled = 'disabled'], .jcarousel-prev-disabled, .jcarousel-next-disabled:
    role: ""
    tabindex: ""
    title: ""

.jcarousel-prev[disabled = 'false'], .jcarousel-prev:
    role: button
    tabindex: 0
    title: Previous

.jcarousel-next[disabled = 'false'], .jcarousel-next:
    role: button
    tabindex: 0
    title: Next

img#tosl-logo:
    aria-label: The OpenScience Laboratory, opens in a new window

img#ou-logo:
    aria-label: The Open University, opens in a new window


#
# "ispot_2013" theme.
#
"#main-header":
    role: header

footer:
    role: contentinfo

"#main-content":
    role: main
    aria-labelledby: "#main-content > h2"

.navbar-nav:
    role: navigation
    aria-label: Main iSpot drop-down menu

.navbar-toggle:
    title: Expand/ collapse menu

".nav-tabs, #user-block, #block-menu-menu-administration, #block-menu-menu-ispot-admin":
    role: navigation

"#search-block-form":
    ##block-search-0
    role: search
    aria-labelledby: "#block-search-0 h3"

...

Style

/* Experimental! */

a:focus, input:focus, button:focus {
  outline: 2px solid #ec971f;
  outline-offset: 2px;
}

#partner-logos {
  background-color: #fafafa;
  opacity: .6;
}