Skip to content

Instantly share code, notes, and snippets.

@jwebcat
jwebcat / dabblet.css
Created October 16, 2012 08:19 — forked from anonymous/dabblet.css
Checkbox Hack
/* Checkbox Hack */
input[type=checkbox] {
position: absolute;
clip:rect(0 0 0 0);
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
@jwebcat
jwebcat / markdown.xml
Created February 28, 2013 09:01 — forked from lg0/markdown.xml
<!-- copy this to YOUR_THEME.tmTheme-->
<dict>
<key>name</key>
<string>diff: deleted</string>
<key>scope</key>
<string>markup.deleted</string>
<key>settings</key>
<dict>
<key>background</key>
<string>#EAE3CA</string>
<dict>
<key>name</key>
<string>diff: deleted</string>
<key>scope</key>
<string>markup.deleted</string>
<key>settings</key>
<dict>
<key>background</key>
<string>#EAE3CA</string>
<key>fontStyle</key>
# This is a template .gitignore file for git-managed WordPress projects.
#
# Fact: you don't want WordPress core files, or your server-specific
# configuration files etc., in your project's repository. You just don't.
#
# Solution: stick this file up your repository root (which it assumes is
# also the WordPress root directory) and add exceptions for any plugins,
# themes, and other directories that should be under version control.
#
# See the comments below for more info on how to add exceptions for your
// ---
// Sass (v3.2.9)
// ---
// Styling elements based on sibling count
// http://lea.verou.me/2011/01/styling-children-based-on-their-number-with-css3/
@mixin adjust-form-siblings-count($max: 10, $property: width) {
$i: 0;
@while ($i < $max) {

What if controlling your media queries was as easy as adding on to a Sass list? What if I told you it now is?

This snippet comes from a modified version of mixins in the Aura Responsive Framework and came from me hijacking the respond-to mixin namespace but still wanting to use it for custom media queries. It's a little ugly and requires Sass 3.2+ (for now, (sudo) gem install sass --pre), but it works a charm.

There are two fairly mundane caveats to this method. First, every media query needs to be named. Second, every media query needs a size and assumes min-width and screen. If you want to change min-width, simply add your operator as another option, but if you want to change screen, you need to also include your operator even if you want it to be min-width.

Also, I haven't built in warnings yet for when you do bad things, so bear that in mind.

Without further adue, tada.

# This is a template .gitignore file for git-managed WordPress projects.
#
# Fact: you don't want WordPress core files, or your server-specific
# configuration files etc., in your project's repository. You just don't.
#
# Solution: stick this file up your repository root (which it assumes is
# also the WordPress root directory) and add exceptions for any plugins,
# themes, and other directories that should be under version control.
#
# See the comments below for more info on how to add exceptions for your
@jwebcat
jwebcat / detect-mobile-browser.js
Created June 2, 2016 07:56 — forked from niksmac/detect-mobile-browser.js
Nodejs Express code to redirect mobile user agets
var express = require('express'),
app = express();
app.listen(80);
app.get('/', function(req, res){
var ua = req.header('user-agent');
// Check the user-agent string to identyfy the device.
if(/mobile|iphone|ipod|android|blackberry|opera|mini|windows\sce|palm|smartphone|iemobile|ipad|android|android 3.0|xoom|sch-i800|playbook|tablet|kindle/i.test(ua)) {
res.sendfile(__dirname + '/mobile.html');
} else {
res.sendfile(__dirname + '/index.html');
@jwebcat
jwebcat / lightbox.css
Created June 10, 2016 07:20 — forked from Shiti/lightbox.css
AngularJS Lightbox directive
.modal {
width: 800px;
left: 40%;
}
.lightbox-content {
width: 100%;
}
.lightbox-image {
@jwebcat
jwebcat / add_two_times.js
Last active November 5, 2017 11:32 — forked from joseluisq/add_two_times.js
Sum two times values HH:mm:ss with javascript
/**
* Sum two times values HH:mm:ss with javascript
* Usage:
* > addTimes('04:20:10', '21:15:10');
* > "25:35:20"
*
* @param {string} start
* @param {string} end
* @returns {String}
*/