Based on code from pen from dmac37 http://codepen.io/dmac37/details/cfArp
Intended use to display recent posts thumbnails in a wordpress theme.
A Pen by Josh Howenstine on CodePen.
Raylin Wright raylinmarie
raylinmarie
/ Hexagon-Image-Tiles-with-Hover-Desc.markdown
Created
May 2, 2014 17:16
A Pen by Josh Howenstine.
raylinmarie
/ gist:9824658
Created
March 28, 2014 03:25
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .model-container-wrapper{ | |
| width: 100%; | |
| display: inline-block; | |
| position: relative; | |
| cursor: pointer; | |
| &:after{ | |
| padding-top: 56.25%; /*16:9 ratio*/ | |
| display: block; | |
| content: ''; | |
| } |
raylinmarie
/ gist:9800236
Created
March 27, 2014 04:30
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <ul id="treeview-collapse"> | |
| <li><span class="icon icon-folder2"></span>level 1 | |
| <ul> | |
| <li>level 2 | |
| <ul> | |
| <li>level 3</li> | |
| <li>level 3 | |
| <ul> | |
| <li>level 4</li> | |
| <li>level 4</li> |
raylinmarie
/ index.html
Created
December 4, 2012 02:27
A CodePen by Scott Grogan. CSS Chronograph - Experimenting with ways to visualize time via CSS
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="timer-group"> | |
| <div class="timer hour"> | |
| <div class="hand"><span></span></div> | |
| <div class="hand"><span></span></div> | |
| </div> | |
| <div class="timer minute"> | |
| <div class="hand"><span></span></div> | |
| <div class="hand"><span></span></div> | |
| </div> | |
| <div class="timer second"> |
raylinmarie
/ index.html
Created
October 17, 2012 21:58
Here's a fun little nav bar. NO IMAGES. CSS3 FTWI relied on pseudo elements, gradients, data urls, icons by Stephen Hutchings and other fun things that may never work in Internet Explorer. Not great for production, but fun to play with.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="container"> | |
| <ul id="nav"> | |
| <li><a href="#" class="icon-home"></a></li> | |
| <li class="active"><a href="#" class="icon-camera"></a></li> | |
| <li><a href="#" class="icon-mail"></a></li> | |
| <li><a href="#" class="icon-comment"></a></li> | |
| <li><a href="#" class="icon-user"></a></li> | |
| <li><a href="#" class="icon-cog"></a></li> | |
| </ul> | |
| </div> |