sparkbox/Build-Responsively-Workshop

Stars
243
Rank 166,489 (Top 4 %)
Language
CSS
Created over 12 years ago
Updated about 8 years ago

sparkbox/Build-Responsively-Workshop

sparkbox

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Build Responsively Workshop

Ben Callahan, Sparkbox

The files in this repo are example exercises used in the Build Responsively Workshop series. Following is a list of resources for learning more about responsive web design.

Resources

Emerging Patterns

Navigation

Tables

Images

Responsive JavaScript

Typography

Touch

Sliders

Apps

Some People to Follow

Thanks

The @hearsparkbox crew would like to thank our fantastic clients for trusting us to learn this stuff with them. And I (Ben) would like to thank my team at Sparkbox for busting their butts to get all of this together. You guys rock.

bouncy-ball

🔴 Compare web animation techniques by bouncing a ball with each one.

style-prototype

Example of an HTML/CSS style tile.

standard

How we work and best practices

email-lab

📩 Starter project for designing and testing HTML email templates

mediaCheck

Control JS with mediaqueries

apprenticeships

📖 A guide to the Sparkbox apprenticeships.

mediaQueryBookmarklet

Determine current page dimensions and current media query

Custom-Selectbox

Select box UI replacement

Responsive-Retrofitting

Playing around with a few ideas...

project-init

Our starting point of front-end development

commit-colors

🎨 See a lovely color swatch in your terminal every time you author a commit.

br-frontend-tooling-links

Links and resources for our Build Right: Frontend Tooling workshop

SB-Media

Repo for our Media Query mixin.

mashboard

Mashing the Code Mash website into something more usable

generator-mg

Mg is the Yeoman scaffold for all Sparkbox frontend projects.

logo-experiments

Every possible way to draw the Sparkbox logo, using modern frontend techniques.

design-system-starter

Use this project as a starting point for new design systems

br-frontend-tooling-demo

The demo project for the Frontend Tooling workshop

gulp-starter

A starter kit for static templates based on Gulp.

mina-circle

🚀 A deployment wrapper for mina based, artifact deployment.

cachebust

A simple node cachebust tool

sparkle

A highly customizable utility-based CSS Framework

designsystemssurvey

The Design Systems Survey - Sparkbox

safe-focus

Safe Focus is a utility file that adds custom outline styles for all selectable components.

site-ignite

An Electron app that aims to be a GUI wrapper around our static template projects.

lamppost

💡 Sparkbox's 2016 apprentice project: an aggregate of local tech events.

CodeMash-RWD

Example files for "Hands-On Responsive Web Design"

br-modern-javascript-exercises

react-eq

Element Queries for React

aws-infrastructure

sparkeats

Food reviews and restaurant ratings

sparkpress-wordpress-starter

WordPress Starter within a Docker Container

trivia11y

Questions and answers for either studying or fun (or both).

exploring-cohort

dr-style-prototype

Dress Responsively style prototype for use at Build Responsively

sb

A CLI to generate SSH Certificates after verifying your identity via Slack.

sparkbox-wraith

Receive notifications when potential visual bugs are introduced in your code.

carbon

🌑 Carbon: Core elements for Sparkbox projects

MochaJasmineTests

accessible-components

A set of useful guides to building accessible components.

vue-storybook-starter

A Starter Vue Storybook Project

lunch-bot

A Slack bot to remind us of our lunch duties.

tech-events-dayton

A list of tech-related events in the Dayton, Ohio area.

apprentice-at

An online listing of apprenticeship opportunities.

Responsive-Slider

br-modern-css-demo

A demo for the Build Right Modern CSS Workshop

apprentices-page

A page that shows past and current apprentices at Sparkbox

br-frontend-testing-exercises

Demos and examples for the super, spectacular Build Right: Frontend Testing workshop by @sparkbox

dashing-js-redis

Redis based history store for dashing-js

project-bot

splinter

🐭 Parse and split SCSS files based on functions and mixins.

make-fluid

testing out an idea

apprenticeship-sparkhero

Pow! Bam! The SparkHero App, along with its trusty sidekick the SparkHero API, is the perfect repository to get your feet wet building web applications.

srcN

commit-haikus

A bot that tweets out accidental commit message haikus.

code-styleguides

stuntman

full-stack-beginners-guide

A Beginner's Guide to Learning Full Stack Web Development

select-testing

A repo to test how Dropdown jQuery plugins (Chosen, Select2, possibly more) react under fluid and fixed width environments

ExpressionEngine-Plug-ins

EE2-Gist-Plugin

1000kperminute

cz-sparkbox

Sparkbox Commitizen template

apprentice-application

A Rails project by the current apprentices.

cincicopter-13

Code for Sparkbox AR Drone at CinciCopter on 2013-09-07

carbon-cli

ember-cli-grunticon

"A mystical CSS icon solution" for ember.

mina-cloudflare-purge

Remove files from a Cloudflare zone cache

Grunt-Demo

downpour

fed-final-project

advanced-techniques-in-git

A small repo to practice advanced Git techniques.

testing-code-challenge

sparkbot

Sparkbox's Hubot for Slack.

eslint-config-sparkbox

✅ A set of eslint customizations that we use at Sparkbox.