Skip to content

Instantly share code, notes, and snippets.

⌨️
keyboard shredding

Miguel Mota miguelmota

⌨️
keyboard shredding
Block or report user

Report or block miguelmota

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@miguelmota
miguelmota / build.xml
Last active Dec 12, 2015
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/
View build.xml
<?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/>
View reset.css
/*
* 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,
View .gitignore
//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
View mtippy.js
/*
* 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 = {
View media-queries.scss
// 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 Dec 15, 2015
Sass function to convert pixels to em.
View functions.scss
// 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 Dec 15, 2015
Sass mixin to create a triangle. Blog post: http://www.miguelmota.com/blog/sass-triangles
View triangles.scss
//
// 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;
View apple-touch-icons.html
<!--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 -->
View filters.css
/* 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 */
View responsive-video.js
(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];
You can’t perform that action at this time.