Skip to content

Instantly share code, notes, and snippets.

View yatil's full-sized avatar
💭
Workin’

Eric Eggert yatil

💭
Workin’
View GitHub Profile
@nuxodin
nuxodin / focusin focusout support for firefox.js
Last active February 7, 2024 16:40
focusin focusout support for firefox
/* Copyright (c) 2016 Tobias Buschor https://goo.gl/gl0mbf | MIT License https://goo.gl/HgajeK */
/* focusin/out event polyfill (firefox) */
!function(){
var w = window,
d = w.document;
if (w.onfocusin === undefined) {
d.addEventListener('focus' ,addPolyfill ,true);
d.addEventListener('blur' ,addPolyfill ,true);
d.addEventListener('focusin' ,removePolyfill ,true);
@derekjohnson
derekjohnson / webfonts.js
Last active December 28, 2015 18:49
Font loader
(function(win, doc, undefined) {
// sanity check - is it a decent browser
if('addEventListener' in win && 'localStorage' in win && 'querySelector' in doc) {
// https://gist.github.com/scottjehl/5406853
var injectref = doc.getElementsByTagName('script')[0],
loadCSS = function(href) {
var fontslink = doc.createElement('link');
@meaku
meaku / .htaccess
Created March 18, 2013 13:14
.htaccess for SSL via SNI to prevent the certificate-error for unsupported browsers. Always share http links and https will be used if supported. Otherwise the connection will be http. SNI is not supported on IE on Windows XP (5 - 8) and Android < 4.x __Important Note__ Don't use this .htaccess if you need HTTPS for all your clients. It is just …
# HTTP(S) Stuff
# Redirect all users except IE 5-8 & Android < 4 to HTTPS
RewriteCond %{SERVER_PORT} !^443$
RewriteCond %{HTTP_USER_AGENT} !MSIE\ [5-8]
RewriteCond %{HTTP_USER_AGENT} !Android.*(Mobile)?\ [0-3]
RewriteRule (.*) https://%{HTTP_HOST}/$1 [L]
@thulstrup
thulstrup / compass-retina-sprites.scss
Created March 20, 2012 19:18
Using Compass to generate normal and retina sprite maps
$sprites: sprite-map("sprites/*.png");
$sprites-retina: sprite-map("sprites-retina/*.png");
@mixin sprite-background($name) {
background-image: sprite-url($sprites);
background-position: sprite-position($sprites, $name);
background-repeat: no-repeat;
display: block;
height: image-height(sprite-file($sprites, $name));
width: image-width(sprite-file($sprites, $name));
@haschek
haschek / _contrast.scss
Last active August 14, 2019 14:20
SCSS/SASS Accessibility Color Methods
/*
SCSS Color Methods for Accessibility
================================================================================
Adjust given colors to ensure that those color combination provide sufficient
contrast.
@version 0.1
@link http://eye48.com/go/scsscontrast
var something = 'blah',
whatever = 'spaces, to make the var names line up';
if (something) {
console.log("tabbed, to indicate it's a child of a code block");
}
// But I tend to use 4 spaces when coding in python, as that's what the python
// expert I work with does.
<!-- Zweiter Versuch by @yatil --->
<!-- Nun auch mit Sprachauszeichnung. --->
<article>
<hgroup>
<h2>Weitersagen!</h2>
<h1>Die führende <span lang="en">Social Media</span> Agentur Europas sucht:</h1>
</hgroup>
<ul>
<li><span lang="en">Online Designer</span> (<abbr title="männlich">m</abbr>/<abbr title="weiblich">w</abbr>)</li>
<li><span lang="en">Online</span> Konzeptionierer (<abbr title="männlich">m</abbr>/<abbr title="weiblich">w</abbr>)</li>

Sass/Less Comparison

In this document I am using Sass's SCSS syntax. You can choose to use the indented syntax in sass, if you prefer it, it has no functional differences from the SCSS syntax.

For Less, I'm using the JavaScript version because this is what they suggest on the website. The ruby version may be different.

Variables