Skip to content

Instantly share code, notes, and snippets.

@EllyLoel
EllyLoel / reset.css
Last active April 13, 2024 18:14
CSS Reset
/*
Made by Elly Loel - https://ellyloel.com/
With inspiration from:
- Josh W Comeau - https://courses.joshwcomeau.com/css-for-js/treasure-trove/010-global-styles/
- Andy Bell - https://piccalil.li/blog/a-modern-css-reset/
- Adam Argyle - https://unpkg.com/open-props@1.3.16/normalize.min.css / https://codepen.io/argyleink/pen/KKvRORE
Notes:
- `:where()` is used to lower specificity for easy overriding.
*/
@fta2012
fta2012 / DragTransform
Last active October 9, 2022 15:32
Slightly modified compiled coffeescript from this codepen: http://codepen.io/fta/pen/ifnqH. Paste into console on a page that has jQuery to load the two dependent libraries (jquery-ui and numericjs). Then call makeTransformable('#selector-name') to make that element WYSIWYG editable. Use inspector to get the CSS for the transforms.
var selector = 'img' // Replace this with the selector for the element you want to make transformable
jQuery.getScript('//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js', function() {
jQuery.getScript('//cdnjs.cloudflare.com/ajax/libs/numeric/1.2.6/numeric.min.js', function() {
(function() {
var $, applyTransform, getTransform, makeTransformable;
$ = jQuery;
@electricg
electricg / info.md
Created November 27, 2012 17:40
Mixin to convert angle in css3 gradient syntax

According to the documentation about the history of css3 gradients syntax:

Following the initial Apple proposal, the prefixed variants of the syntax all uses the an defined like polar angles, that is with 0deg representing the East. To be coherent with the rest of CSS, the specification defines an angle with 0deg representing the North. To prevent sites using prefixed version of the property to get suddenly broken, even when adapting to the otherwise forward-compatible final syntax, they keep the original angle definition (0deg = East). They will switch to the correct spec when unprefixing the property.

This means that for the -webkit- syntax the value is equal to

$webkit-angle = ($angle - $right-angle) * 1

where $right-angle: 90deg = 100grad = 0.25turn ≈ 1.5708rad

@media only screen and (min-width: 320px) {
/* Small screen, non-retina */
}
@media
only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 320px),
only screen and ( min--moz-device-pixel-ratio: 2) and (min-width: 320px),
only screen and ( -o-min-device-pixel-ratio: 2/1) and (min-width: 320px),
@raphaelstolt
raphaelstolt / php54_php53_pear_macports.markdown
Created May 17, 2012 21:37
Installing PHP 5.4 and 5.3 side by side on Max OSX via MacPorts

##Given Apache 2 and MySQL are already installed.

#Update MacPorts sudo port selfupdate;sudo port -u upgrade outdated

#Install PHP 5.4.* sudo port install php54 php54-apache2handler ##Activate Apache Module cd /opt/local/apache2/modules

@adamesque
adamesque / preloader.js
Created February 16, 2011 23:38
Uses jQuery's new Deferred object to help with image loading
/**
* Helper function for passing arrays of promises to $.when
*/
jQuery.whenArray = function ( array ) {
return jQuery.when.apply( this, array );
};
/**
* Accepts a single image src or an array of image srcs.