<article>
<p><a href="http://factmag.com/tag/kanye-west" target="_blank"><strong>Kanye West</strong></a> performed at the first annual Roc City Classic tonight in New York City, an event streamed on <a href="http://factmag.com/tag/jay-z" target="_blank"><strong>Jay Z</strong></a>‘s <em>Life+Times</em> website that also featured NBA star Kevin Durant.</p>
<p>Kanye’s set consisted predominantly of material from 2013’s <em>Yeezus</em> album, however he also performed ‘Clique,’ ‘Blessings,’ ‘I Don’t Fuck With You’ and ‘Mercy’ with the <a href="http://factmag.com/tag/g-o-o-d-music" target="_blank"><strong>G.O.O.D. Music</strong></a> crew before wrapping things up with his latest single ‘Only One’.</p>
<p>Earlier today, Kanye debuted a new track entitled <a href="http://www.factmag.com/2015/02/12/kanye-west-premieres-wolves-featuring-sia-vic-mensa-produced-cashmere-cat-sinjin-hawke/" target="_blank"><strong>‘Wolves’</strong></a> featuring <strong><a href="http://factmag.com/tag/sia" target="_blank">Sia</a> </strong>and <a href="http://factmag.com/tag/vic-mensa" target="_blank"><b>Vic Mensa</b></a>. [via <a href="http://pitchfork.com/news/58459-kanye-west-performs-at-first-annual-roc-city-classic/" target="_blank"><strong><em>Pitchfork</em></strong></a>]</p>
<p class="note">This is a recreation of the link hover effect from <a href="http://www.factmag.com/2015/02/13/kanye-west-pusha-t-2-chainz-perform-first-annual-roc-city-classic-watch-full-show/">factmag.com</a></small>
</article>
@import "compass/css3";
/* Link hover effect from http://www.factmag.com/2015/02/13/kanye-west-pusha-t-2-chainz-perform-first-annual-roc-city-classic-watch-full-show/ */
@import url(https://fonts.googleapis.com/css?family=Noto+Serif:400,700,400italic);
$link-color: #E71818;
$text-color: #442;
$article-font: Noto serif, serif;
article {
color: $text-color;
font-family: $article-font;
margin: 5em auto;
max-width: 30em;
}
p {
font-size: 18px;
line-height: 1.5;
}
article a {
@extend %fancy-link;
}
.note {
display: inline-block;
border-top: 1px solid $link-color;
color: #777;
font-size: .8em;
font-style: italic;
margin-top: 2em;
padding-top: 1em;
}
%fancy-link {
color: $link-color;
position: relative;
text-decoration: none;
transition: all 0.15s ease-out;
&:before {
content: "";
position: absolute;
width: 100%;
height: 1px;
bottom: 0px;
left: 0;
background: #f00;
visibility: hidden;
transform: scaleX(0);
transition: all 0.3s ease-in-out 0s;
}
&:hover {
transition: all 0.15s ease-out;
&:before {
visibility: visible;
transform: scaleX(1);
}
}
}
View Compiled
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.