Skip to content

Instantly share code, notes, and snippets.

@Calvein
Created February 27, 2012 19:21
Show Gist options
  • Save Calvein/1926444 to your computer and use it in GitHub Desktop.
Save Calvein/1926444 to your computer and use it in GitHub Desktop.
http://jgthms.com theme switcher
javascript:(function(){s=document.createElement('script');s.type='text/javascript';s.src='https://raw.github.com/gist/1926444/b8bfd192702e0fa021fb349ed1605747f0dad271/jgthms.com%20theme%20changer';document.body.appendChild(s);})();
/* HTML */
var themes = document.createElement('div')
, lightTheme = document.createElement('a')
, darkTheme = document.createElement('a')
themes.className = 'themes'
lightTheme.innerHTML = '☀'
lightTheme.href = '#'
darkTheme.innerHTML = '☾'
darkTheme.href = '#'
/* JavaScript */
var color = localStorage.getItem('color') || '#002B36'
document.documentElement.style.backgroundColor = color
color === '#002B36' ?
lightTheme.className = 'active' :
darkTheme.className = 'active'
var toggleTheme = function(e) {
e.preventDefault()
var sibling = this.previousElementSibling || this.nextElementSibling
this.className = ''
sibling.className = 'active'
color = darkTheme.className ? '#FDF6E3' : '#002B36'
document.documentElement.style.backgroundColor = color
localStorage.setItem('color', color)
}
lightTheme.addEventListener('click', toggleTheme)
darkTheme.addEventListener('click', toggleTheme)
themes.appendChild(lightTheme)
themes.appendChild(darkTheme)
document.body.appendChild(themes)
/* CSS */
var head = document.querySelector('head')
, style = document.createElement('style')
style.innerHTML = '.themes{position:absolute;top:10px;right:10px}.themes>a{display:none;font-size:28px;border-bottom-width:0}.themes>a:first-child{color:#fdf6e3}.themes>a:first-child:hover{color:#eee8d5}.themes>a:first-child+a{color:#002b36}.themes>a:first-child+a:hover{color:#073642}.themes>.active{display:block}'
head.appendChild(style)
@jgthms
Copy link

jgthms commented Feb 27, 2012

T'es un malade.

(J'avais songé à un truc comme ça en plus)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment