Lucida
A Pen by matthew jackson on CodePen.
Created
May 22, 2014 21:26
-
-
Save matthewbeta/827bbd774a1f3922e3fd to your computer and use it in GitHub Desktop.
A Pen by matthew jackson.
This file contains hidden or 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
| .main | |
| header | |
| h1 Lucida | |
| h2 Sans aut Grande | |
| span Thursday 22nd May 2014 | |
| p Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ut veritatis quis autem aspernatur similique mollitia aliquam eaque. Dolorum quidem. Lorem ipsum dolor sit amet, consectetur adipisicing elit. | |
| blockquote | |
| p There are now about as many different varieties of letters as there are different kinds of fools | |
| p Accusamus excepturi quaerat ea deserunt rerum consequatur perferendis facilis commodi eum sint? | |
| p Cumque excepturi facere maiores reprehenderit dolorum velit ut deserunt consectetur molestiae voluptas quidem vitae quibusdam quia dolores id enim voluptatem qui voluptatibus. | |
| br | |
| cite This web thing was set in Lucida |
This file contains hidden or 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
| body { | |
| font: 14px/1.7 Lucida Sans Unicode, Lucida Grande, sans-serif; | |
| background-color: #F14C7B ; | |
| color: #FFF; | |
| text-rendering: optimizeLegibility; | |
| border-top: 16px solid #912D2D; | |
| } | |
| .main { | |
| width: 320px; | |
| margin: 40px auto 40px 100px; | |
| } | |
| header { | |
| padding-bottom: 12px; | |
| margin-bottom: 12px; | |
| border-bottom: 1px solid #FFF; | |
| } | |
| h1, h2 { | |
| font-weight: normal; | |
| display: table-cell; | |
| vertical-align: baseline; | |
| line-height: 1; | |
| text-transform: uppercase; | |
| } | |
| h1 { | |
| font-size: 32px; | |
| letter-spacing: 2px; | |
| font-weight: 200; | |
| } | |
| h2 { | |
| letter-spacing: 2px; | |
| text-indent: 12px; | |
| font-size: 16px; | |
| color: #912D2D; | |
| } | |
| p { | |
| margin: 0; | |
| } | |
| p + p { | |
| text-indent: 28px; | |
| } | |
| blockquote { | |
| font-size: 18px; | |
| padding: 12px 0; | |
| margin: 12px 0; | |
| border: solid #912D2D; | |
| border-width: 1px 0; | |
| } | |
| span { | |
| display: block; | |
| text-transform: uppercase; | |
| font-style: normal; | |
| font-size: 10px; | |
| letter-spacing: 2px; | |
| padding: 12px 0 0; | |
| } | |
| cite { | |
| color: #912D2D; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment