Skip to content

Instantly share code, notes, and snippets.

@netviperinc
Created June 23, 2015 17:28
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 netviperinc/ba6777cdcaa03f89d20c to your computer and use it in GitHub Desktop.
Save netviperinc/ba6777cdcaa03f89d20c to your computer and use it in GitHub Desktop.
common css files for animated icon
.c-hamburger {
display: block;
position: relative;
overflow: hidden;
margin: 0;
padding: 0;
width: 96px;
height: 96px;
font-size: 0;
text-indent: -9999px;
appearance: none;
box-shadow: none;
border-radius: none;
border: none;
cursor: pointer;
transition: background 0.3s;
}
.c-hamburger:focus {
outline: none;
}
.c-hamburger span {
display: block;
position: absolute;
top: 44px;
left: 18px;
right: 18px;
height: 8px;
background: white;
}
.c-hamburger span::before,
.c-hamburger span::after {
position: absolute;
display: block;
left: 0;
width: 100%;
height: 8px;
background-color: #fff;
content: "";
}
.c-hamburger span::before {
top: -20px;
}
.c-hamburger span::after {
bottom: -20px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment