More Related Content
More from Andréa Zambrana (13)
Sass maps, my precious!
- 2. Quem sou eu?
Andréa Zambrana
front-end @ Amil [multicanais]
@akfzambrana
http://andreazambrana.com.br
- 21. $palette: (
red: (
base: $base-color-red,
light: lighten($base-color-red, 20%),
dark: darken($base-color-red, 20%)
),
grey: (
base: $base-color-grey,
light: lighten($base-color-grey, 20%),
dark: darken($base-color-grey, 20%)
)
);
- 28. .my-link {
color: black;
@include respond-to(small) { color: tomato; }
@include respond-to(medium) { color: blue; }
@include respond-to(large) { color: orange; }
}
- 29. .my-link {
color: black;
}
@media (min-width: 767px) {
.my-link { color: tomato; }
}
@media (min-width: 992px) {
.my-link { color: blue; }
}
@media (min-width: 1200px) {
.my-link { color: orange; }
}
- 32. @function layer($key) {
@if map-has-key($z-layers, $key) {
@return map-get($z-layers, $key);
} @else {
@warn "Unknown `#{$key}` in $z-layers.";
}
@return null;
}
- 35. $icons: (
twitter: (char: "f099", color: #55acee),
google: (char: "f0d5", color: #dd4b39),
facebook:(char: "f09a", color: #3b5998),
github: (char: "f09b", color: #231f20)
);
- 36. @each $social, $icon in $icons {
&[href*="#{$social}"] {
background-color: map-get($icon, color);
&:before {
content: map-get($icon, char);
}
}
}
- 39. IE 6 e 7
%clearfix {
&:before,
&:after {
content: '';
display: table;
}
&:after {
clear: both;
}
& {
zoom: 1;
}
}