sparkbox/mediaQueryBookmarklet

Stars
159
Rank 235,916 (Top 5 %)
Language
JavaScript
Created over 13 years ago
Updated about 2 years ago

sparkbox/mediaQueryBookmarklet

sparkbox

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

Determine current page dimensions and current media query

mediaQuery Bookmarklet

The mediaQuery bookmarklet gives a visual representation of the current viewport dimensions and most recently fired media query. Check out our blog for more info.

Try it out on the docs site.

How to Use

Copy the contents of bookmarklet.js into a bookmark - done.

Legal Stuff

This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 Unported License.

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

Build-Responsively-Workshop

mediaCheck

Control JS with mediaqueries

apprenticeships

📖 A guide to the Sparkbox apprenticeships.

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.