Skip to content

Instantly share code, notes, and snippets.

@miguelmota
miguelmota / build.xml
Last active December 12, 2015 09:19
Ant build to compress HTML files recursively using htmlcompressor-1.5.3.jar. Blog post: http://www.miguelmota.com/blog/ant-task-to-compress-html-files/
<?xml version="1.0" encoding="UTF-8"?>
<project default="compress-html">
<target name="compress-html">
<apply executable="java">
<fileset dir="src" includes="**/*.html"/>
<arg value="-jar"/>
<arg path="lib/htmlcompressor-1.5.3.jar"/>
<arg line="-t html"/>
<srcfile/>
/*
* HTML5 Reset Stylesheet
* v1.0 | 20101223
* (c) 2010-2012 Miguel Mota http://www.miguelmota.com
* Released under the MIT license
* Inspired by Richard Clark's CSS Reset http://html5doctor.com/html-5-reset-stylesheet
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
//this will affect all the git repos
git config --global core.excludesfile ~/.gitignore
//update files since .ignore won't if already tracked
git rm --cached <file>
# Compiled source #
###################
*.com
/*
* mtippy - a jQuery tooltip plugin
* v1.0.0 - 20120525
* (c) 2012 Miguel Mota http://www.miguelmota.com
* Released under the MIT license
*/
(function($) {
var methods = {
// Sass Media Query Breakpoints
//
// METHOD 1
//
// Inspired by http://thesassway.com/intermediate/responsive-web-design-in-sass-using-media-queries-in-sass-32
//
// Usage:
//
// div {
@miguelmota
miguelmota / functions.scss
Last active December 15, 2015 21:39
Sass function to convert pixels to em.
// Sass function to convert pixels to em
$em-base: 16px !default;
@function emCalc($pxWidth) {
@return $pxWidth / $em-base * 1em;
}
@miguelmota
miguelmota / triangles.scss
Last active December 15, 2015 21:39
Sass mixin to create a triangle. Blog post: http://www.miguelmota.com/blog/sass-triangles
//
// Sass mixin to create a triangle
//
@mixin triangle($size:24px, $color:#000, $direction:up, $trim:false, $transparent:false) {
content: "";
display: inline-block;
width: 0;
height: 0;
border: solid $size;
<!--iPhone and iPad Apple Touch Icons -->
<!-- iPhone Non-Retina -->
<link rel="apple-touch-icon-precomposed" sizes="57x57" href="apple-touch-icon-57x57.png">
<!-- iPhone Retina -->
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="apple-touch-icon-114x114.png">
<!-- iPad Non-Retina -->
<link rel="apple-touch-icon-precomposed" href="apple-touch-icon-72x72.png" sizes="72x72">
<!-- iPad Retina -->
/* CSS3 Filters */
img {
-webkit-filter: blur(2.5px); /* values: 0px - 25px */
-webkit-filter: brightness(5%); /* values: -100% - 100% */
-webkit-filter: contrast(1.5); /* values: 0 - 5 */
-webkit-filter: drop-shadow(3px 3px 10px rgba(0,0,0,.5)) ; /* values: x-offset y-offset blur-radius color */
-webkit-filter: grayscale(.5); /* values: 0 - 1 */
-webkit-filter: hue-rotate(5deg); /* values: 0deg - 360deg */
-webkit-filter: invert(1); /* values: 0 - 1 */
(function() {
// Responsive Video
function responsiveVideo(selector) {
// Get videos
var videos = document.querySelectorAll(selector);
// Loop through videos
for (var i = 0; i < videos.length; i++) {
var video = videos[i];