Turn lights Off – Meu tema em fundo preto
Site com fundo preto é cansativo, ainda mais se for um site com bastante conteúdo para lermos.
Porém, por diversas razões há quem goste.
Pensando nessa linha, implementei um botão ali no header do meu blog: “black theme”.
Estou em fase de testes. Não travei com cookie ainda.
Adicionei as seguintes linhas no meu css, para “mudar” a cor do meu tema.
/* black style */ #switch { cursor: pointer; border: 1px solid #ccc; display: inline-block; padding: 5px 20px; } body.black { background: #090909; } .black .post time, .black #main { background: transparent; } .black #sidebar a, .black, .black #switch, .black h1 a, .black h2 a { color: #fff; } .black .post time, .black h1, .black h2, .black h3, .black h4, .black h5, .black h6, .black a { color: #00aaff; } /* highlight */ .black .dp-highlighter ol li span { color: #333; } .black .dp-highlighter .tools, .black .dp-highlighter, .black .dp-highlighter ol, .black .dp-highlighter ol li, .black .dp-highlighter .columns div, .black .dp-highlighter ol li.alt { background: transparent; } .black .dp-highlighter .tools, .black .dp-highlighter ol li, .black .dp-highlighter .columns div { border-color: #00aaff; }
Como podem ver, o javascript apenas adiciona uma class ao body e pronto. O css cuida do restante.
Tendo ficado bom, eu termino a implementação e travo com cookie a sua opção de ver meu blog in black.
Me digam oque acharam. =)