Skip to content

Instantly share code, notes, and snippets.

Clément P yukulele

  • France
Block or report user

Report or block yukulele

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
@yukulele
yukulele / dabblet.css
Created Feb 4, 2014 — forked from LeaVerou/dabblet.css
urlencoded SVG checkerboard
View dabblet.css
/**
* urlencoded SVG checkerboard
*/
html{
min-height: 300px;
background: tan center url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" fill="%2358a"><rect x="50" width="50" height="50" /><rect y="50" width="50" height="50" /></svg>');
background-size: 20px;
transition:2s all;
}
@yukulele
yukulele / dabblet.css
Created Jan 11, 2014 — forked from LeaVerou/dabblet.css
(C)Leanest CSS spinner ever
View dabblet.css
/**
* (C)Leanest CSS spinner ever
*/
@keyframes spin {
to { transform: rotate(1turn); }
}
.progress {
position: relative;
View performance.now()-polyfill.js
// if Navigation Timing is not supported, fallback to Date.naw() called on start (sufficient in many cases)
// Date.now is also polyfilled
(function(p){
if(!Date.now)
Date.now = function(){return +new Date};
if (!p.now){
var start = (p.timing && p.timing.navigationStart) || Date.now();
p.now = function now(){
return Date.now() - start;
@yukulele
yukulele / dabblet.css
Created Mar 13, 2013 — forked from LeaVerou/dabblet.css
Hexagon kitty - By @LeaVerou
View dabblet.css
/* Hexagon kitty - By @LeaVerou
Disappointingly inflexible, but still interesting methinks.
*/
.hexagon {
display: inline-block;
position: relative;
width: 200px;
height: 200px;
transform: scale(1.25,.707) rotate(-45deg);
@yukulele
yukulele / dabblet.css
Created Mar 5, 2013 — forked from LeaVerou/dabblet.css
gracefully degrading switch-style checkboxes
View dabblet.css
/**
* gracefully degrading switch-style checkboxes
* need <label> wrapper and <span> immediatly after checkbox.
*/
input[type="checkbox"]+span{display:none}
input[type="checkbox"]:not(:checked),
input[type="checkbox"]:checked { /* :checked here acting as a filter for older browsers */
display:none;
}
input[type="checkbox"]:not(:checked)+span,
@yukulele
yukulele / dabblet.css
Created Nov 8, 2012 — forked from LeaVerou/dabblet.css
Testing mailto forms
View dabblet.css
/**
* Testing mailto forms
*/
View dabblet.css
/**
* 3D cube
*/
#cube {
position:relative;
background:#ccc;
width:300px;
height:300px;
margin:0 auto;
@yukulele
yukulele / dabblet.css
Created May 30, 2012 — forked from anonymous/dabblet.css
My first 3D trasform + transition test
View dabblet.css
/* My first 3D trasform + transition test */
#c
{
left: 50%;
perspective: 230px;
perspective-origin: 50% 80%;
position: absolute;
top: 50%;
You can’t perform that action at this time.