I hereby claim:
- I am keithchu on github.
- I am catharsis (https://keybase.io/catharsis) on keybase.
- I have a public key whose fingerprint is 8504 0391 3AD0 D0D5 DB32 7382 6A7D E12C 1CD9 9E7A
To claim this, I am signing this object:
// define breakpoints | |
$small: #{"screen and (max-width: 479px)"} | |
$medium: #{"screen and (min-width: 480px) and (max-width: 767px)"} | |
$large: #{"screen and (min-width: 768px)"} | |
// define mixin | |
=respond-to($media...) | |
$media-list: null | |
@each $query in $media | |
$media-list: append($media-list, unquote("#{$query}"), comma) |
I hereby claim:
To claim this, I am signing this object:
<div> | |
<a href="#open" class="trigger">Open Flyout</a> | |
<a href="#" class="close">Close</a> | |
<div class="flyout-wrapper" id="open"> | |
<ul class="flyout"> | |
<li>One</li> | |
<li>Two</li> | |
<li>Three</li> | |
<li>Four</li> | |
<li>Five</li> |
javascript:window.location=%22data:text/html,%20%3Chtml%20contenteditable%20style='font:%2024px%20%5C%22Avenir%20Next%5C%22,%20Georgia,%20serif'%3E%22; |
<article class="sandbox"> | |
<header> | |
<h1>Demo of <code>image-set()</code> and <code>srcset</code></h1> | |
</header> | |
<section class="image-set"> | |
<h2><code>image-set()</code></h2> | |
<!-- 1. normal use case, bg images --> |
<i class="square"></i> |
/** | |
* Death to the Bottom Line / @catharsis | |
*/ | |
body { | |
font-family: sans-serif; | |
line-height: 1.5; | |
margin: 2em 4em; | |
width: 500px; | |
} | |
code { |
/** | |
* Deployotron | |
* original art: @mrdiec | |
* code: @catharsis | |
*/ | |
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } | |
body { margin: 10em 15em; } | |
.robo { |
@spinner-size: 64px; | |
@spinner-offset: @spinner-size / 2; | |
@spinner-anim-length: 3s; | |
@spinner-tine-size: 12px; | |
@spinner-tine-steps: 12; | |
@spinner-tine-step: 360deg / @spinner-tine-steps; | |
@spinner-tine-step-delay: (@spinner-anim-length / 2) / @spinner-tine-steps; | |
@-webkit-keyframes spinner { | |
0% { |
/** | |
* Star Rating Using HTML <input type="range"> | |
*/ | |
html { | |
min-height: 100%; | |
-webkit-tap-highlight-color: rgba(0,0,0,0); | |
tap-highlight-color: rgba(0,0,0,0); | |
} |