Hakim El Hattab hakimel
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @font-face { | |
| font-family: 'Cabin Sketch'; | |
| font-style: normal; | |
| font-weight: 700; | |
| src: url('cabinsketch-regular.eot'); | |
| src: url('cabinsketch-regular.eot?#iefix') format('embedded-opentype'), | |
| url('cabinsketch-regular.woff') format('woff'), | |
| url('cabinsketch-regular.ttf') format('truetype'); | |
| } | |
hakimel
/ gist:6800908
Created
October 2, 2013 21:39
Hacky way of zooming out iframes in reveal.js presentations.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .reveal .slides section { | |
| padding: 10px; | |
| } | |
| .reveal .slides section iframe { | |
| -webkit-transform: scale(0.5) translate(-50%, -50%); | |
| -moz-transform: scale(0.5) translate(-50%, -50%); | |
| transform: scale(0.5) translate(-50%, -50%); | |
| min-width: 200%; | |
| min-height: 200%; |
hakimel
/ reverse-events.js
Last active
December 27, 2015 06:39
Sometimes I wish events worked like this. Normal event listeners: "when X happens do Y"
Reversed events listeners: "do Y when X happens".
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Function.prototype.on = function( scope, eventName, useCapture ) { | |
| scope.addEventListener( eventName, this, useCapture ); | |
| }; | |
| Function.prototype.off = function( scope, eventName, useCapture ) { | |
| scope.removeEventListener( eventName, this, useCapture ); | |
| }; | |
| // Sample listener | |
| function doSomething() { console.log( 'Doing it.' ); } |
hakimel
/ gist:7534649
Created
November 18, 2013 20:22
Simple script authored in the console to normalize linear path data. Makes it so that the path begins at 0,0 and expands to 100x100.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var d = '350,75 379,161 469,161 397,215 423,301 350,250 277,301 303,215 231,161 321,161'.split(' ') | |
| for( var i = 0; i < d.length; i++ ) { | |
| d[i] = d[i].split(',') | |
| } | |
| for( var i = 0; i < d.length; i++ ) { | |
| d[i][0] = parseInt(d[i][0]) | |
| d[i][1] = parseInt(d[i][1]) | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // This is semi-transparent black | |
| h1, h2, h3 { | |
| background: rgba( 0, 0, 0, 0.4 ); | |
| padding: 0.1em; | |
| } | |
| // This is semi-transparent white | |
| h1, h2, h3 { | |
| background: rgba( 255, 255, 255, 0.4 ); | |
| padding: 0.1em; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <link rel="stylesheet" href="css/reveal.css"> | |
| <link rel="stylesheet" href="css/theme/default.css" id="theme"> | |
| </head> | |
| <body> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html lang="en"> | |
| <head> | |
| <link rel="stylesheet" href="css/reveal.css"> | |
| <link rel="stylesheet" href="css/theme/default.css" id="theme"> | |
| </head> | |
| <body> |
hakimel
/ reveal-js-data-state-callback.html
Created
May 8, 2014 10:29
reveal.js data-state callback
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <link rel="stylesheet" href="css/reveal.css"> | |
| <link rel="stylesheet" href="css/theme/default.css" id="theme"> | |
| </head> |
hakimel
/ gist:c7b71eb214b29cb180aa
Last active
August 29, 2015 14:17
reveal.js: Go to slide with ID
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var indices = Reveal.getIndices( document.getElementById( 'sectionID' ) ); | |
| Reveal.slide( indices.h, indices.v ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @keyframes dark-mode-icon-in { | |
| 0% { transform: rotate(90deg); } | |
| 100% { transform: rotate(0deg); } | |
| } | |
| @keyframes dark-mode-icon-out { | |
| 0% { transform: rotate(0deg); } | |
| 100% { transform: rotate(-90deg); } | |
| } |
OlderNewer