Por que sass (scss) é melhor do que menos

História curta SASS tem modo de relógio propriedades aninhadas mais fácil de depurar http://www.mobify.com/dev/sass-sleuth-debugging-sass-in-webkit-browsers/ https://addons.mozilla.org/en-us/firefox/addon/firesass-for-firebug/ ! sinalizador padrão para variáveis @extend para seletores de herança e espaço reservado @if, @for, …

Continuar lendo

Blur Mixin

Mixin de desfoque simples, funcionará no Chrome 28+, Safari 6+, IE6-9, Firefox 10+ @mixin blur($px: 0) { -webkit-filter: blur(#{$px}px) !important; -ms-filter: blur(#{$px}px) !important; -moz-filter: blur(#{$px}px) !important; filter: url(“data:image/svg+xml;utf8,<svg >); filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius=’#{$px}’);}

Continuar lendo

Texto girado em SCSS com IE8 +

Gire o texto em todos os navegadores até o IE8. Você só precisa alterar uma variável graças ao SCSS. $rotateDeg: -10;$rotateRad: $rotateDeg * (3.14159 / 180);-ms-filter: “progid:DXImageTransform.Microsoft.Matrix(SizingMethod=’auto expand’, M11=#{$rotateRad}, M12=#{$rotateRad …

Continuar lendo

Consultas de mídia Sass Mixin

Aqui está um media queries Sass mixin que eu costumo usar no projeto. Consultas de mídia responsivas $phone : ‘(max-width: 480px)’;$tablet-portrait: ‘(max-width: 767px)’;$tablet-landscape: ‘(min-width: 768px) and (max-width: 979px)’;$large-desktop: ‘(min-width: 1200px)’;$non-retina: …

Continuar lendo