Skip to content

Instantly share code, notes, and snippets.

@Munter
Created July 19, 2013 08:45
Show Gist options
  • Save Munter/6037695 to your computer and use it in GitHub Desktop.
Save Munter/6037695 to your computer and use it in GitHub Desktop.
This gist shows the development less file of Falcon Social. Profile images are individual images, which are anotated to be sprited in the production build post process. [See the resulting image here](http://global.falconsocial.com/static/69ab1fb324.png). This gives you the power to use images in different modules across the application without h…
.falconeer-profile {
.profile {
margin-top: 8px;
width: 92px;
height: 92px;
background-repeat: none;
}
&#ulrik {
.profile { background-image: url(/images/falconeers/Ulrik-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Ulrik.png?sprite=falconeers); }
}
&#DavidCarrat {
.profile { background-image: url(/images/falconeers/DavidCarrat.png?sprite=falconeers); }
}
&#MortenLi {
.profile { background-image: url(/images/falconeers/MortenLi.png?sprite=falconeers); }
}
&#ThomasWeilby {
.profile { background-image: url(/images/falconeers/ThomasWeilby.png?sprite=falconeers); }
}
&#JacobBratting {
.profile { background-image: url(/images/falconeers/JacobBratting.png?sprite=falconeers); }
}
&#brian {
.profile { background-image: url(/images/falconeers/Brian-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Brian.png?sprite=falconeers); }
}
&#pedro {
.profile { background-image: url(/images/falconeers/Pedro-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Pedro.png?sprite=falconeers); }
}
&#eirik {
.profile { background-image: url(/images/falconeers/Eirik-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Eirik.png?sprite=falconeers); }
}
&#oliver {
.profile { background-image: url(/images/falconeers/Oliver-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Oliver.png?sprite=falconeers); }
}
&#joe {
.profile { background-image: url(/images/falconeers/Joe-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Joe.png?sprite=falconeers); }
}
&#jennifer {
.profile { background-image: url(/images/falconeers/Jennifer-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Jennifer.png?sprite=falconeers); }
}
&#berkant {
.profile { background-image: url(/images/falconeers/Berkant-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Berkant.png?sprite=falconeers); }
}
&#vytautas {
.profile { background-image: url(/images/falconeers/Vytas-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Vytas.png?sprite=falconeers); }
}
&#martin {
.profile { background-image: url(/images/falconeers/Martin-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Martin.png?sprite=falconeers); }
}
&#dennis {
.profile { background-image: url(/images/falconeers/Dennis-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Dennis.png?sprite=falconeers); }
}
&#paw {
.profile { background-image: url(/images/falconeers/Paw-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Paw.png?sprite=falconeers); }
}
&#lazlo {
.profile { background-image: url(/images/falconeers/Laszlo-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Laszlo.png?sprite=falconeers); }
}
&#peter {
.profile { background-image: url(/images/falconeers/Peter-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Peter.png?sprite=falconeers); }
}
&#lars {
.profile { background-image: url(/images/falconeers/Lars-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Lars.png?sprite=falconeers); }
}
&#kasper {
.profile { background-image: url(/images/falconeers/Kasper-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Kasper.png?sprite=falconeers); }
}
&#Noah {
.profile { background-image: url(/images/falconeers/Noah-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Noah.png?sprite=falconeers); }
}
&#ronja {
.profile { background-image: url(/images/falconeers/Ronja-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Ronja.png?sprite=falconeers); }
}
&#anna {
.profile { background-image: url(/images/falconeers/Anna-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Anna.png?sprite=falconeers); }
}
&#may {
.profile { background-image: url(/images/falconeers/May-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/May.png?sprite=falconeers); }
}
&#birgitte {
.profile { background-image: url(/images/falconeers/Birgitte.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Birgitte.png?sprite=falconeers); }
}
&#marcella {
.profile { background-image: url(/images/falconeers/Marcella-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Marcella.png?sprite=falconeers); }
}
&#Laura-cs {
.profile { background-image: url(/images/falconeers/Laura-cs-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Laura-cs.png?sprite=falconeers); }
}
&#christano {
.profile { background-image: url(/images/falconeers/Christano-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Christano.png?sprite=falconeers); }
}
&#frank {
.profile { background-image: url(/images/falconeers/Frank-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Frank.png?sprite=falconeers); }
}
&#toni {
.profile { background-image: url(/images/falconeers/Toni-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Toni.png?sprite=falconeers); }
}
&#florian {
.profile { background-image: url(/images/falconeers/Florian-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Florian.png?sprite=falconeers); }
}
&#roxanna {
.profile { background-image: url(/images/falconeers/Roxanna-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Roxanna.png?sprite=falconeers); }
}
&#laura {
.profile { background-image: url(/images/falconeers/Laura-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Laura.png?sprite=falconeers); }
}
&#filipo {
.profile { background-image: url(/images/falconeers/Filippo-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Filippo.png?sprite=falconeers); }
}
&#urban {
.profile { background-image: url(/images/falconeers/Urban-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Urban.png?sprite=falconeers); }
}
&#Ieva {
.profile { background-image: url(/images/falconeers/Jeva-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Jeva.png?sprite=falconeers); }
}
&#Alexandra {
.profile { background-image: url(/images/falconeers/Alexandra-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Alexandra.png?sprite=falconeers); }
}
&#Bjoern {
.profile { background-image: url(/images/falconeers/Bjoern-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Bjoern.png?sprite=falconeers); }
}
&#Ingrid {
.profile { background-image: url(/images/falconeers/Ingrid-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Ingrid.png?sprite=falconeers); }
}
&#Inga {
.profile { background-image: url(/images/falconeers/Inga-side.png?sprite=falconeers); }
&:hover .profile { background-image: url(/images/falconeers/Inga.png?sprite=falconeers); }
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment