Skip to content

Instantly share code, notes, and snippets.

Marcy Sutton marcysutton

Block or report user

Report or block marcysutton

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@marcysutton
marcysutton / the-deal.md
Last active May 3, 2016
Accessibility Support in HTML5 Audio
View the-deal.md

Here are a few things I found in testing HTML5 Audio in various browsers and screen readers:

  • The controls do work in Safari and Voiceover, they just require more key commands than "space". You have to press Control + Option + Space to toggle playback.
  • I had trouble toggling playback in Safari and Chrome with just the keyboard.
  • Mobile Safari and Voiceover worked fine.
  • Firefox and Edge both work from the keyboard alone
  • Firefox and JAWS required two taps of the space key.
  • Edge and JAWS did not work at all–probably because of immature accessibility support in the new browser.
  • Labeling the audio element with an aria-label attribute would help to give the track a title. It won't work in every browser due to accessible name calculation specs, but it's better than none.
View cascadia-fest-marcysutton.md

The Pacific Northwest conference CascadiaJS grew into something new and amazing this year: a 3-day web conference now called Cascadia Fest. Following the JS Fest format, talks were grouped into server and browser JavaScript days, and a brand-new CSS day. 400 attendees and their families along with speakers and volunteer staff came to the beach for 34 talks and 6 free workshops at Semiahmoo Resort, across Birch Bay from Canada. The venue was right between Vancouver BC and Seattle, both previous locations, as well as Portland.

Cascadia Fest awarded 10 diversity scholarships this year, making a big impact in the community. As Northwest native, I love the message & perspectives at Cascadia Fest: common themes reflect the community’s values. Speakers talk about compelling side projects and talking through the learning process, while admitting vulnerability. They enlighten us about being polite citizens in open source and beyond, elevating our skills, and investing in our careers an

@marcysutton
marcysutton / sample.scss
Created May 7, 2015
Angular Material CSS Best Practice
View sample.scss
// Brittle:
md-dialog {
&> md-dialog-content {
}
}
// better:
md-dialog {
.custom-dialog-content {
View gist:e6c24a8c0a4026a959fa

Open Source Contributions:

Angular Material

  • Accessibility of docs website: skip link, toggle menus, focus management, CSS for high contrast mode
  • Accessibility auditing and development for all components
  • Testing browers with assistive technologies on OSX, Windows, iOS and Android
  • 73 merged pull requests
  • 120 created issues, 128 closed, 66 assigned

Angular.js

@marcysutton
marcysutton / string-wildcard-replacement.js
Created Mar 17, 2015
JavaScript string manipulation
View string-wildcard-replacement.js
var str = '1?101?011';
var repl = ['0', '1'];
var pattern = /\?/g;
var numMatches = str.match(pattern).length;
for(var j=0; j<numMatches; j++){
for(var i=0; i<repl.length; i++){
console.log(str.replace(pattern, repl[i]));
}
}
View using-ngaria.md
@marcysutton
marcysutton / developer-guide.md
Last active Mar 14, 2018
ngAria Developer Guide
View developer-guide.md

The goal of ngAria is to improve Angular's default accessibility by enabling common ARIA attributes that convey state or semantic information for assistive technologies used by persons with disabilities.

##Including ngAria

Using ngAria is as simple as requiring the ngAria module in your application. ngAria hooks into standard AngularJS directives and quietly injects accessibility support into your application at runtime.

@marcysutton
marcysutton / radioButton.spec.js
Last active Aug 29, 2015
Angular Material Radio Button Spec
View radioButton.spec.js
describe('radioButton', function() {
beforeEach(module('material.components.radioButton'));
it('should set roles', inject(function($compile, $rootScope) {
var element = $compile('<material-radio-group ng-model="color">' +
'<material-radio-button value="blue"></material-radio-button>' +
'<material-radio-button value="green"></material-radio-button>' +
'</material-radio-group>')($rootScope);
var rbGroupElement = element;
You can’t perform that action at this time.