Skip to content

Instantly share code, notes, and snippets.

@javierarques
Created September 23, 2013 12:07
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save javierarques/6669598 to your computer and use it in GitHub Desktop.
Save javierarques/6669598 to your computer and use it in GitHub Desktop.
CSS3 calendar icon with SASS
// Calendar icon
//------------------------//
.calendar-icon {
// Contenedor principal
display: inline;
float: left;
height: 14px;
margin: 6px 3px 0 0;
position: relative;
width: 14px;
&::after{
// Caja del calendario
display: inline-block;
width: 14px;
height: 14px;
background-color: $afi-gris-claro;
border: 2px solid darken($afi-gris-claro, 10%);
content: "";
position: absolute;
left: 0;
top: 0;
}
&:before{
display: inline-block;
width: 10px;
height: 10px;
content: "";
position: absolute;
left: 2px;
top: -2px;
border-left: 2px solid darken($afi-gris-claro, 10%);
border-right: 2px solid darken($afi-gris-claro, 10%);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment