Skip to content

Instantly share code, notes, and snippets.

@helen
Last active December 16, 2016 18:29
Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save helen/26863da1e2724b69d56e to your computer and use it in GitHub Desktop.
Save helen/26863da1e2724b69d56e to your computer and use it in GitHub Desktop.
Make WordPress Great Again
<?php
// Inspired by http://jsfiddle.net/desandro/Ew6Zt/
add_action( 'admin_head', function(){
?>
<script>
jQuery(document).ready( function($) {
var colorTime = 0,
waveTheta = 0,
maxCount = 100,
colorIncrement = -12,
waveIncrement = 0.1,
xPos = [ -2, -1, 0, 1, 2 ],
yPos = [ -2, -1, 0, 1, 2 ],
props = {};
var getTextShadow = function( x, y, hue ) {
return ', ' + x + 'px ' + y + 'px hsl(' + hue + ', 100%, 50%)';
};
var animate = function() {
var shadows = '0 0 transparent',
hue0 = colorTime % 360,
i, j, x, y,
iLen = xPos.length,
jLen = yPos.length;
// outline
for ( i = 0; i < iLen; i++ ) {
x = xPos[i];
for ( j = 0; j < jLen; j++ ) {
y = yPos[j];
shadows += getTextShadow( x, y, hue0 );
}
}
// renders rainbow river
for ( i = 1; i < maxCount; i++ ) {
var normI = i / maxCount,
hue = ( normI * 360 * 2 + colorTime ) % 360;
x = ~~( ( Math.sin( normI * Math.PI * 2 + waveTheta ) - Math.sin( waveTheta ) ) * 50 );
y = i * 3;
shadows += getTextShadow( x, y, hue );
}
props.groovy.style.textShadow = shadows;
colorTime += colorIncrement;
waveTheta += waveIncrement;
setTimeout( animate, 30 );
};
props.groovy = $('.wrap h1:first-of-type')[0];
setTimeout( animate, 1 );
});
</script>
<style>
.wrap h1:first-of-type {
font: bold 80px 'Cooper Black', 'Cooper Std', 'Cooper Std Black', sans-serif !important;
color: white !important;
margin: 0 !important;
z-index: 99999999 !important;
position: relative !important;
}
</style>
<?php
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment