Skip to content

Instantly share code, notes, and snippets.

@kublaj
kublaj / absolute-centering.css
Created May 31, 2016 10:56 — forked from jhafner/absolute-centering.css
Absolute centering of elements with CSS. Advantages: Cross-browser (including IE8-10) No special markup, minimal styles Responsive with percentages and min-/max- Use one class to center any content Centered regardless of padding (without box-sizing!) Blocks can easily be resized Works great on images Caveats: Height must be declared Recommend se…
.Center-Container {
position: relative;
}
.Absolute-Center {
width: 50%;
height: 50%;
overflow: auto;
margin: auto;
position: absolute;
@kublaj
kublaj / mobile-form.html
Created May 31, 2016 10:56 — forked from jhafner/mobile-form.html
Describes HTML5 Attributes for Forms on Mobile Devices
<form id="mobile-form">
<input type="tel" /> <!-- Displays number pad -->
<input type="text" pattern="\d*" novalidate /> <!-- Displays number pad on text fields -->
<input type="email" autocapitalize="off" /> <!-- Displays email input, disables auto-capitalization -->
<input type="text" autocorrect="off" /> <!-- Disables autocorrect -->
</form>
@kublaj
kublaj / canvas-boilerplate.js
Created May 31, 2016 10:56 — forked from jhafner/canvas-boilerplate.js
Canvas (2D) Boilerplate
var canvas = document.querySelector('canvas');
var ctx = canvas.getContext('2d');
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
function loop() {
clear();
update();
draw();
@kublaj
kublaj / jquery-to-vanilla-js.md
Created May 31, 2016 10:49 — forked from jhafner/jquery-to-vanilla-js.md
jQuery methods in vanilla JavaScript.

Moving from jQuery

Events

// jQuery
$(document).ready(function() {
  // code
})
@kublaj
kublaj / my.css
Created January 21, 2016 12:00 — forked from anonymous/my.css
CSS Gradient Animation
background: linear-gradient(270deg, #387b6a, #155645, #b7cac5, #73aa9c);
background-size: 800% 800%;
-webkit-animation: AnimationName 30s ease infinite;
-moz-animation: AnimationName 30s ease infinite;
-o-animation: AnimationName 30s ease infinite;
animation: AnimationName 30s ease infinite;
@-webkit-keyframes AnimationName {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
@kublaj
kublaj / standalone-vivaldi-mac.md
Created January 19, 2016 15:13 — forked from ruario/standalone-vivaldi-mac.md
A small App that starts Vivaldi for Mac in such a way that it will store its profile within a subfolder (Useful for testing)

Vivaldi "Standalone Mode" on Mac

The following commands will produce a small application that allows you to run Vivaldi—or any other Chromium-based browser—in Standalone mode on a Mac. This could be used for testing a specific setup or version, without touching the system wide settings (profile). It can also be used to create a portable (USB install) of Vivaldi that you could store on an external disk, for sharing between computers.

Manual method

Start Terminal and issue the following:

mkdir -p Standalone\ Mode.app/Contents/MacOS
@kublaj
kublaj / espruino_pico_demo.js
Last active August 29, 2015 14:28 — forked from gyengus/espruino_pico_demo.js
espruino_pico_demo
var l = false;
setInterval(function() {
l = !l;
LED1.write(l);
LED2.write(!l);
}, 500);
function readBTN() {
if (digitalRead(BTN1) == 1) {
@kublaj
kublaj / jsoffline.md
Last active August 29, 2015 14:27 — forked from meagar/jsoffline.md
Taking JavaScript Offline

Note: this presentation was written for Gistdeck. Add the bookmarklet, come back to this gist, click the bookmarklet, then use the arrow keys to navigate.

Note2: See https://github.com/meagar/taking-javascript-offline for code examples; any time a string like 2-basic-caching appears, that's a branch which supports that slide

Taking JavaScript Offline

Who am I?

@meagar

@kublaj
kublaj / Mardown
Last active August 29, 2015 14:24
MarkdownML
---
author: Kublaj
comments: true
date: 2015-07-10 16:06:51+00:00
layout: post
redirect_from: /2013/07/html5-structure
hero: Layout & Data in HTML5
slug: html5-structure-layout
title: Basic HTML5 structure
wordpress_id: 56
<?php
/**
* Plugin Name: Static Templates
*
* If most of your site content is in .php template files, and you're tired of
* creating new pages, assigning them page templates, creating page templates
* then doing it all over again on production, this plugin is for you.
*
* Examples:
*