update
I've created a little repository that simply exposes the final utility as npm
module.
It's called html-escaper
there is basically one rule only: do not ever replace one char after another if you are transforming a string into another.
/* | |
.disable-hover, | |
.disable-hover * { | |
pointer-events: none !important; | |
} | |
if you have many box-shadow elements or any animated elements | |
that cause of browser repaints |
/* because me lazy */ | |
Object.getOwnPropertyNames(Math).map(function(p) { | |
window[p] = Math[p]; | |
}); | |
// PI/3, | |
// cos(a); | |
// sin(a); | |
function curry( fn ) { | |
var arity = fn.length; | |
return (function resolver() { | |
var memory = Array.prototype.slice.call( arguments ); | |
return function() { | |
var local = memory.slice(), next; | |
Array.prototype.push.apply( local, arguments ); | |
next = local.length >= arity ? fn : resolver; | |
return next.apply( null, local ); | |
}; |
['AF','AX','AL','DZ','AS','AD','AO','AI','AQ','AG','AR','AM','AW','AU','AT','AZ','BS','BH','BD','BB','BY','BE','BZ','BJ','BM','BT','BO','BA','BW','BV','BR','IO','BN','BG','BF','BI','KH','CM','CA','CV','KY','CF','TD','CL','CN','CX','CC','CO','KM','CG','CD','CK','CR','CI','HR','CU','CY','CZ','DK','DJ','DM','DO','EC','EG','SV','GQ','ER','EE','ET','FK','FO','FJ','FI','FR','GF','PF','TF','GA','GM','GE','DE','GH','GI','GR','GL','GD','GP','GU','GT','GG','GN','GW','GY','HT','HM','VA','HN','HK','HU','IS','IN','ID','IR','IQ','IE','IM','IL','IT','JM','JP','JE','JO','KZ','KE','KI','KR','KW','KG','LA','LV','LB','LS','LR','LY','LI','LT','LU','MO','MK','MG','MW','MY','MV','ML','MT','MH','MQ','MR','MU','YT','MX','FM','MD','MC','MN','ME','MS','MA','MZ','MM','NA','NR','NP','NL','AN','NC','NZ','NI','NE','NG','NU','NF','MP','NO','OM','PK','PW','PS','PA','PG','PY','PE','PH','PN','PL','PT','PR','QA','RE','RO','RU','RW','BL','SH','KN','LC','MF','PM','VC','WS','SM','ST','SA','SN','RS','SC','SL','SG','SK','SI','SB','SO','ZA','GS','ES |
overlay three gradients to make a background with nearly the full spectrum of colors that can be displayed on a monitor. | |
https://blog.logrocket.com/advanced-effects-with-css-background-blend-modes-4b750198522a | |
.spectrum-background { | |
background: | |
linear-gradient(red, transparent), | |
linear-gradient(to top left, lime, transparent), | |
linear-gradient(to top right, blue, transparent); | |
background-blend-mode: screen; |
/* | |
* Hide only visually, but have it available for screenreaders: h5bp.com/v | |
no display:none, ---> disable tab focusing. not playing video | |
*/ | |
.visuallyhidden { | |
border: 0; | |
clip: rect(0 0 0 0); | |
height: 1px; | |
margin: -1px; |
@keyframes border-transform{ | |
0%,100% { border-radius: 63% 37% 54% 46% / 55% 48% 52% 45%; } | |
14% { border-radius: 40% 60% 54% 46% / 49% 60% 40% 51%; } | |
28% { border-radius: 54% 46% 38% 62% / 49% 70% 30% 51%; } | |
42% { border-radius: 61% 39% 55% 45% / 61% 38% 62% 39%; } | |
56% { border-radius: 61% 39% 67% 33% / 70% 50% 50% 30%; } | |
70% { border-radius: 50% 50% 34% 66% / 56% 68% 32% 44%; } | |
84% { border-radius: 46% 54% 50% 50% / 35% 61% 39% 65%; } | |
} |
const delay = second => () => new Promise((resolve, rejects) => { | |
setTimeout(() => { | |
resolve() | |
}, second * 1000); | |
}) | |
// some tasks that take long time | |
let tasks = [ | |
delay(0), |
update
I've created a little repository that simply exposes the final utility as npm
module.
It's called html-escaper
there is basically one rule only: do not ever replace one char after another if you are transforming a string into another.
// Only add setZeroTimeout to the window object, and hide everything | |
// else in a closure. | |
(function() { | |
var timeouts = []; | |
var messageName = "zero-timeout-message"; | |
// Like setTimeout, but only takes a function argument. There's | |
// no time argument (always zero) and no arguments (you have to | |
// use a closure). | |
function setZeroTimeout(fn) { |