Skip to content

Instantly share code, notes, and snippets.

@MikeFielden
Forked from chriscoyier/dabblet.css
Created January 21, 2012 20:36
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 MikeFielden/1653913 to your computer and use it in GitHub Desktop.
Save MikeFielden/1653913 to your computer and use it in GitHub Desktop.
Opening Scene to movie :)
body { background: black; padding: 100px; margin: 0; }
h1 {
text-align: center;
color: white;
text-transform: uppercase;
padding: 1px;
font-family: 'Raleway', cursive;
font-weight: 100;
position: relative;
background: linear-gradient(left, black, #eee, black);
}
h1:before {
content: "";
position: absolute;
left: 50%;
top: -50px;
width: 800px;
margin-left: -300px;
margin-top: -220px;
height: 600px;
background: radial-gradient(50% 50%, ellipse closest-side, #444, black);
z-index: -1;
}
h1 a {
background: black;
display: block;
padding: 20px;
text-decoration: none;
letter-spacing: 5px;
color: white;
animation: comein 2.0s 1 ease-in-out forwards;
}
@keyframes comein {
0% { letter-spacing: 10px; color: rgba(255,255,255,0); }
70% { letter-spacing: 20px; }
100% { letter-spacing: 30px; color: rgba(255,255,255,1) }
}
<link href='http://fonts.googleapis.com/css?family=Raleway:100' rel='stylesheet'>
<h1><a href="#">one-eva dashboard</a></h1>
{"view":"split","prefixfree":"1","page":"css"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment