Responsive compass sprite mixin

@mixin resize-sprite($map, $sprite, $percent) { $spritePath: sprite-path($map); $spriteWidth: image-width($spritePath); $spriteHeight: image-height($spritePath); $width: image-width(sprite-file($map, $sprite)); $height: image-height(sprite-file($map, $sprite)); @include background-size(ceil($spriteWidth * ($percent/100)) ceil($spriteHeight * ($percent/100))); width: ceil($width*($percent/100)); height: ceil($height*($percent/100)); background-position: 0 floor(nth(sprite-position($map, $sprite), 2) * ($percent/100) ); } To generate sprite (map-sprite, name of icon, %) @include resize-sprite($spr-sprites, $icon-name, 50);

Change color address bar mobile browser

This small article will educate you, how you can change color address bar mobile browser. <!– Chrome, Firefox OS and Opera –> <meta name=”theme-color” content=”#4285f4″> <!– Windows Phone –> <meta name=”msapplication-navbutton-color” content=”#4285f4″> <!– iOS Safari –> <meta name=”apple-mobile-web-app-status-bar-style” content=”#4285f4″> In order to make it work on apple devices you need to allow full screen mode […]