jaredcunha

Front-end Engineer

Responsibilities

• Collaborate with the product team, government/client stakeholders, and other contractors to build new systems and make improvements to existing systems
• Write verifiably accessible code, always
• Design and spec out major functionality
• Participate in planning, including breaking down requirements into tasks
• Test software development methodology in an agile environment
• Work alongside other engineers on the team to elevate technology and consistently apply best practices
• Work with designers to review solutions for technical feasibility and accessibility

jaredcunha

Collaborating for Accessibility

Here are some links and resources that I discussed during the presentation.

Find Me on Social Media

• Twitter
• Instagram
• LinkedIn
• Glass Photo

jaredcunha

document.querySelectorAll('a[href^="#"]').forEach(anchor => {
  const anchorTargetId = anchor.getAttribute("href").replace("#", "");
  const anchorTarget = document.getElementById(anchorTargetId);
  if (anchorTargetId.length) { // if statement gets around errors with href="#"
    anchor.addEventListener('click', function (e) {
        e.preventDefault();
        anchorTarget.setAttribute("tabindex", "-1");
        document.querySelector(this.getAttribute('href')).scrollIntoView({
            behavior: 'smooth'
        });

jaredcunha

rm -rf _site
bundle exec jekyll build
cd _site
git init
git remote add origin https://github.com/[username]/[repo_name].git
git checkout -b gh-pages
git add -A
git commit -m "update site"
git push -f origin gh-pages
cd ../

jaredcunha

.cf:before,
.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.cf:after {
    clear: both;
}

jaredcunha

// ----
// Sass (v3.3.8)
// Compass (v1.0.0.alpha.19)
// ----

$gutterWidthPx: 20;
$columnWidthPx: 60;
$gridWidthPx: 940;

@function calc-cols($target) {

jaredcunha

/* Caculate the end grid details */
$gutterWidthPx: 20;
$columnWidthPx: 60;
$gridWidthPx: 940;

@function calc-cols($target) {
  @return 100% * (($target * $columnWidthPx) + (($target - 1) * $gutterWidthPx)) / $gridWidthPx;
}

/* Caculate the gutter */

jaredcunha

module.exports = function(grunt) {

    "use strict";

    // -------------------------------------------------------------------------
    // #### Load plugins as needed ####
    // Using a 'just in time' approach -- meaning: only load plugins when they
    // are needed -- this will automatically find, then load, any and all
    // plugins that are needed by the task currently being executed. It will
    // scan the devDependencies object, in package.json, and match any of the

jaredcunha

/* 
 *  Scroll Logic
 */

var active = false;
var lastElement, nextElement;
window.addEventListener( 'scroll', onScroll, false)

function onScroll( event ) {

jaredcunha

/* Responsive Table =================================================================*/
$(document).ready(function(){
	/*Declare headings*/
	var theHeads = $('.vert-collapse thead th');
	var allHeadersSaved = new Array();
	
	/*Get content of all table headers, add to array*/
	theHeads.each(function() {
		var headerContent = $(this).text();
		allHeadersSaved.push(headerContent);