|
|
@ -27,144 +27,33 @@ $(document).ready(function() { |
|
|
|
</style> |
|
|
|
|
|
|
|
<div style="max-width: 1000px;margin:2em auto;"> |
|
|
|
<div class="ui cards"> |
|
|
|
<div class="green card"> |
|
|
|
<div class="image"> |
|
|
|
<img src="images/wireframe/image.png" class="visible content"> |
|
|
|
</div> |
|
|
|
<div class="content"> |
|
|
|
<a class="header">Card 0</a> |
|
|
|
<div class="meta"> |
|
|
|
<div class="ui small star rating"></div> |
|
|
|
</div> |
|
|
|
<div class="description"> |
|
|
|
<a> |
|
|
|
<i class="red clock icon"></i> |
|
|
|
Today |
|
|
|
</a> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="extra content"> |
|
|
|
<span class="left floated like"> |
|
|
|
<i class="like icon"></i> |
|
|
|
30+ fans |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="green card"> |
|
|
|
<div class="image"> |
|
|
|
<img src="images/wireframe/image.png" class="visible content"> |
|
|
|
</div> |
|
|
|
<div class="content"> |
|
|
|
<a class="header">Card 1</a> |
|
|
|
<div class="meta"> |
|
|
|
<div class="ui small star rating"></div> |
|
|
|
</div> |
|
|
|
<div class="description"> |
|
|
|
<a> |
|
|
|
<i class="red clock icon"></i> |
|
|
|
Today |
|
|
|
</a> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="extra content"> |
|
|
|
<span class="left floated like"> |
|
|
|
<i class="like icon"></i> |
|
|
|
30+ fans |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="green card"> |
|
|
|
<div class="image"> |
|
|
|
<img src="images/wireframe/image.png" class="visible content"> |
|
|
|
</div> |
|
|
|
<div class="content"> |
|
|
|
<a class="header">Card 2</a> |
|
|
|
<div class="meta"> |
|
|
|
<div class="ui small star rating"></div> |
|
|
|
</div> |
|
|
|
<div class="description"> |
|
|
|
<a> |
|
|
|
<i class="red clock icon"></i> |
|
|
|
Today |
|
|
|
</a> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="extra content"> |
|
|
|
<span class="left floated like"> |
|
|
|
<i class="like icon"></i> |
|
|
|
30+ fans |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="green card"> |
|
|
|
<div class="image"> |
|
|
|
<img src="images/wireframe/image.png" class="visible content"> |
|
|
|
</div> |
|
|
|
<div class="content"> |
|
|
|
<a class="header">Card 3</a> |
|
|
|
<div class="meta"> |
|
|
|
<div class="ui small star rating"></div> |
|
|
|
</div> |
|
|
|
<div class="description"> |
|
|
|
<a> |
|
|
|
<i class="red clock icon"></i> |
|
|
|
Today |
|
|
|
</a> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="extra content"> |
|
|
|
<span class="left floated like"> |
|
|
|
<i class="like icon"></i> |
|
|
|
30+ fans |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="green card"> |
|
|
|
<div class="image"> |
|
|
|
<img src="images/wireframe/image.png" class="visible content"> |
|
|
|
</div> |
|
|
|
<div class="content"> |
|
|
|
<a class="header">Card 4</a> |
|
|
|
<div class="meta"> |
|
|
|
<div class="ui small star rating"></div> |
|
|
|
</div> |
|
|
|
<div class="description"> |
|
|
|
<a> |
|
|
|
<i class="red clock icon"></i> |
|
|
|
Today |
|
|
|
</a> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="extra content"> |
|
|
|
<span class="left floated like"> |
|
|
|
<i class="like icon"></i> |
|
|
|
30+ fans |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="green card"> |
|
|
|
<div class="image"> |
|
|
|
<img src="images/wireframe/image.png" class="visible content"> |
|
|
|
<div class="ui vertical labeled icon buttons"> |
|
|
|
<button class="ui button"> |
|
|
|
<i class="pause icon"></i> |
|
|
|
Pause |
|
|
|
</button> |
|
|
|
<button class="ui button"> |
|
|
|
<i class="play icon"></i> |
|
|
|
Play |
|
|
|
</button> |
|
|
|
<button class="ui button"> |
|
|
|
<i class="shuffle icon"></i> |
|
|
|
Shuffle |
|
|
|
</button> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="ui vertical labeled icon buttons"> |
|
|
|
<div class="ui button"> |
|
|
|
<i class="pause icon"></i> |
|
|
|
Pause |
|
|
|
</div> |
|
|
|
<div class="content"> |
|
|
|
<a class="header">Card 5</a> |
|
|
|
<div class="meta"> |
|
|
|
<div class="ui small star rating"></div> |
|
|
|
</div> |
|
|
|
<div class="description"> |
|
|
|
<a> |
|
|
|
<i class="red clock icon"></i> |
|
|
|
Today |
|
|
|
</a> |
|
|
|
</div> |
|
|
|
<div class="ui button"> |
|
|
|
<i class="play icon"></i> |
|
|
|
Play |
|
|
|
</div> |
|
|
|
<div class="extra content"> |
|
|
|
<span class="left floated like"> |
|
|
|
<i class="like icon"></i> |
|
|
|
30+ fans |
|
|
|
</span> |
|
|
|
<div class="ui button"> |
|
|
|
<i class="shuffle icon"></i> |
|
|
|
Shuffle |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |