Mae no, no por varias razones:
- Uno de los chistes de usar compass es el poder crear sprites on the fly: http://compass-style.org/help/tutorials/spriting/ , compass maneja la posición de los iconos dentro del sprite y optimiza las imagenes.
- Ya tenemos una librería para iconos "Glyphicons", no quiero que mezclemos iconos de varios lados y terminar con un arroz con mango que sea vea horrible, lastimosamente Glyphicons no le dio licencia a Twitter para su set de iconos sociales, pero hay un montón de buenas alternativas que podemos usar como https://github.com/FortAwesome/Font-Awesome o http://icomoon.io/
- En el mejor de los casos estas reglas no deberían estar tiradas en el app.scss, sino ser un nuevo partial (social-icons?) y estar ahí.
- Cuando se usa algún float, el browser siempre pone a ese elemento "display: block;" entonces no ocupas esa regla.
- No quemés los colores (#fff) para eso tenemos las 10001 variables del tema de Bootstrap, en este caso podrías usar: $component-active-color