Skip to content

Instantly share code, notes, and snippets.

ɥɔɐ⅂ ɐɥɔsɐS voodoocode

Block or report user

Report or block voodoocode

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View _mixin.visuallyhidden.scss
// Mixin to quickly apply accessible hiding to elements.
@mixin hidden-visually() {
border: 0 !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
voodoocode / bookmarklet.js
Last active Feb 28, 2018
Bookmarklet to remove Speigel Online adblocker-blocker message
View bookmarklet.js
voodoocode / atom-vertical-file-tabs.less
Last active Sep 26, 2017 — forked from jasesmith/atom-vertical-file-tabs.less
For vertically stacked open file tabs, put this in your `./atom/styles.less`
View atom-vertical-file-tabs.less
atom-workspace-axis.vertical atom-pane {
flex-direction: row-reverse;
.tab-bar {
box-shadow: inset -1px 0 0 #181a1f;
resize: horizontal;
height: auto;
display: block;
padding-right: 1px;
padding-bottom: 3em;
min-width: 14em;
voodoocode /
Last active Jul 1, 2016 — forked from p3t3r67x0/
A CSS pseudo-element is used to style specified parts of an element. In some cases you can style native HTML controls with vendor specific pseudo-elements. Here you will find an list of cross browser specific pseudo-element selectors.

Styling native elements

Native HTML controls are a challenge to style. You can style any element in the web platform that uses Shadow DOM with a pseudo element ::pseudo-element or the /deep/ path selector.

video::webkit-media-controls-timeline {
  background-color: lime;

video /deep/ input[type=range] {
View _helpers.scss
/* shorthand for breakpoints. names as proposed by chris coyier (css-tricks) */
@mixin breakpoint($point) {
@if $point == papa-bear {
@media (min-width: 980px) {
} @else if $point == mama-bear {
@media (max-width: 979px) {
voodoocode / _helpers.scss
Created Aug 22, 2013
flip an image horizontal
View _helpers.scss
@mixin flip {
-moz-transform: scaleX(-1);
-o-transform: scaleX(-1);
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
filter: FlipH;
-ms-filter: "FlipH";
voodoocode / _helpers.scss
Created Aug 22, 2013
box shadow as border. uses inset, so you border can be used dditionally
View _helpers.scss
/* a box shadow that looks like a border. control border strength with $spread. */
@mixin box-shadow-as-border($spread, $r, $g, $b, $a) {
-webkit-box-shadow: inset 0 0 1px $spread rgba($r, $g, $b, $a);
-moz-box-shadow: inset 0 0 1px $spread rgba($r, $g, $b, $a);
box-shadow: 0 0 1px $spread rgba($r, $g, $b, $a) inset;
voodoocode / _helpers.scss
Created Aug 22, 2013
scss mixin for a vertical gradient with 3 steps
View _helpers.scss
@mixin vertical-3stop-gradient($fromColor, $viaColor, $toColor) {
background: #fff; /* Old browsers */
background: -moz-linear-gradient(top, $fromColor 0%, $toColor 49%, $viaColor 50%, $toColor 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, $fromColor), color-stop(49%, $toColor), color-stop(50%, $viaColor), color-stop(100%, $toColor)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, $fromColor 0%, $toColor 49%, $viaColor 50%, $toColor 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, $fromColor 0%, $toColor 49%, $viaColor 50%, $toColor 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, $fromColor 0%, $toColor 49%, $viaColor 50%, $toColor 100%); /* IE10+ */
background: linear-gradient(to bottom, $fromColor 0%, $toColor 49%, $viaColor 50%, $toColor 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#{ie-hex-str($fromColor)}', endColorstr='
voodoocode / gist:ad1f872725171f06658a
Created Apr 21, 2015
post-checkout hook "Master"
View gist:ad1f872725171f06658a
branch=$(git symbolic-ref HEAD | cut -d '/' -f 3);
if [ "master" == "$branch" ]; then
lines[0]="Master, Master, where's the dreams that I've been after?"
lines[1]="Master, Master, you promised only lies"
lines[2]="Laughter, laughter, all I hear or see is laughter"
lines[3]="Laughter, laughter, laughing at my cries"
echo -e "\033[1;31m ${lines[$((RANDOM%${#lines[*]}))]} \033[0m";
voodoocode / SassMeister-input.scss
Created Apr 14, 2015
Generated by
View SassMeister-input.scss
// ----
// Sass (v3.4.12)
// Compass (v1.0.3)
// ----
@function some-function($some-number:10, $another-number:5){
@return $some-number + $another-number
.some-class {
You can’t perform that action at this time.